共用方式為


逐步解說:建立可顯示 SharePoint 之 OData 的 Silverlight Web 組件

SharePoint 可透過 OData 公開其清單資料。在 SharePoint 中, OData 服務是由靜態的服務 ListData.svc 實作。本逐步解說示範如何建立裝載 Silverlight 應用程式的 SharePoint Web 組件。使用 ListData.svc 的 Silverlight 應用程式顯示 SharePoint 公告清單資訊。如需詳細資訊,請參閱 SharePoint Foundation REST 介面開啟資料通訊協定

本逐步解說將示範下列工作:

  • 建立 Silverlight 應用程式與 Silverlight Web Part.

  • 自訂 Silverlight 應用程式.

  • 自訂 Silverlight 應用程式.

  • 自訂 Silverlight 應用程式.

  • 測試 Silverlight Web Part.

注意事項注意事項

您的電腦可能會在下列說明中,以不同名稱或位置顯示某些 Visual Studio 使用者介面項目。您所擁有的 Visual Studio 版本以及使用的設定會決定這些項目。如需詳細資訊,請參閱 Visual Studio 設定

必要條件

您需要下列元件才能完成此逐步解說:

建立 Silverlight 應用程式與 Silverlight Web Part

首先,在 Visual Studio 中建立 Silverlight 應用程式。使用 ListData.svc 服務, Silverlight 應用程式從 SharePoint 公告擷取資料清單。

注意事項注意事項

Silverlight 沒有版本,支援在 Web 參考的 SharePoint 清單資料之前需要的介面。

若要建立 Silverlight 應用程式與 Silverlight 網路中斷

  1. 在功能表列上,選擇 [檔案], [新增], [Project] 顯示 [新增專案] 對話方塊。

  2. 展開節點 [SharePoint] 在 [Visual C#] 或 [Visual Basic] 下,然後選取 [2010] 節點。

  3. 在 [範本] 窗格中,選取 SharePoint 2010 Silverlight Web 組件範本。

  4. 在 [Name]方塊中,輸入 SLWebPartTest 然後選取 [確定] 按鈕。

    [SharePoint 自訂精靈] 對話方塊隨即出現。

  5. 在 [指定網站和安全性層級進行偵錯] 頁面上,輸入您想要偵錯網站定義之 SharePoint 伺服器網站的 URL,或使用預設位置 (http://system name/)。

  6. 在 [這是什麼 SharePoint 方案的信任層級?]區段中,選取 [部署為陣列方案] 選項按鈕。

    雖然本範例使用陣列方案, Silverlight Web 組件專案可以部署,當陣列或沙箱化方案。如需沙箱化方案與陣列方案的詳細資訊,請參閱 沙箱化方案考量

  7. 在 [指定 Silverlight 組態資訊] 網頁的 [您要如何關聯 Silverlight Web 組件]區域中,選取 [建立新 Silverlight 專案並與 Web 組件產生關聯] 選項按鈕。

  8. 變更 [Name] 到 SLApplication,設定 [語言] 對 [Visual Basic] [Visual C#],然後設定 [Silverlight 版本] 對 [Silverlight 版)]。

  9. 選取 [完成] 按鈕。專案會出現在 [方案總管]。

    方案包含兩個專案:Silverlight 應用程式與 Silverlight Web 組件。Silverlight 應用程式擷取並顯示從 SharePoint 清單的資料,因此, Silverlight Web 組件裝載 Silverlight 應用程式,可讓您檢視至 SharePoint。

自訂 Silverlight 應用程式

將程式碼和設計項目加入至 Silverlight 應用程式。

自訂 Silverlight 應用程式

  1. 加入至 System.Windows.Data 的組件參考在 Silverlight 應用程式。如需詳細資訊,請參閱HOW TO:使用加入參考對話方塊加入或移除參考

  2. 在 [方案總管],開啟 [參考] 的捷徑功能表,然後選取 [加入服務參考]。

    注意事項注意事項

    如果您使用 Visual Basic,您必須選取 [顯示所有檔案] 圖示在 [方案總管] 顯示 [參考] 節點。

  3. 在位址 [加入服務參考] 箱對話方塊中,輸入您的 SharePoint 網站 URL,例如 http://MySPSite,然後選取 [執行] 按鈕。

    在 Silverlight 找出 SharePoint OData 服務 ListData.svc 時,它是由服務周到 URL 取代這個位址。在這個範例中, http://myserver 變成 http://myserver/_vti_bin/ListData.svc。

  4. 選取 [確定] 按鈕加入專案的服務參考,且使用預設的服務名稱, ServiceReference1。

  5. 在功能表列上,選擇, [組建][建置方案]。

  6. 將新的資料來源以 SharePoint 服務的專案。若要這麼做,請在功能表列上,選擇[檢視], [其他視窗], [資料來源]。

    [資料來源] 視窗會顯示所有可用的 SharePoint 清單資料,例如工作、公告和行事曆。

  7. 加入公告清單資料加入至 Silverlight 應用程式。您可以將「公告」從 Silverlight 設計工具上的 [資料來源] 視窗。

    建立這個的方格控制項繫結至 SharePoint 網站的公告清單。

  8. 調整方格控制項調整 Silverlight 頁面。

  9. 在 MainPage.xaml 程式碼檔 (Visual C# 或 MainPage.xaml.vb 的 MainPage.xaml.cs Visual Basic 中的),加入下列命名空間參考。

    ' Add the following three Imports statements.
    Imports SLApplication.ServiceReference1
    Imports System.Windows.Data
    Imports System.Data.Services.Client
    
    // Add the following three using statements.
    using SLApplication.ServiceReference1;
    using System.Windows.Data;
    using System.Data.Services.Client;
    
  10. 將下列變數宣告在類別的頂端。

    Private context As TeamSiteDataContext
    Private myCollectionViewSource As CollectionViewSource
    Private announcements As New DataServiceCollection(Of AnnouncementsItem)()
    
    private TeamSiteDataContext context;
    private CollectionViewSource myCollectionViewSource;
    DataServiceCollection<AnnouncementsItem> announcements = new DataServiceCollection<AnnouncementsItem>();
    
  11. 以下列內容取代 UserControl_Loaded 程序。

    Private Sub UserControl_Loaded_1(sender As Object, e As RoutedEventArgs)
        ' The URL for the OData service.
        ' Replace <server name> in the next line with the name of your SharePoint server.
        context = New TeamSiteDataContext(New Uri("http://<server name>/_vti_bin/ListData.svc"))
    
        ' Do not load your data at design time.
        If Not System.ComponentModel.DesignerProperties.GetIsInDesignMode(Me) Then
            'Load your data here and assign the results to the CollectionViewSource.
            myCollectionViewSource =   DirectCast(Me.Resources("announcementsViewSource"), System.Windows.Data.CollectionViewSource)
            announcements.LoadCompleted += New EventHandler(Of LoadCompletedEventArgs)(AddressOf announcements_LoadCompleted)
            announcements.LoadAsync(context.Announcements)
        End If
    End Sub
    
    private void UserControl_Loaded_1(object sender, RoutedEventArgs e)
    {
        // The URL for the OData service.
        // Replace <server name> in the next line with the name of your 
        // SharePoint server.
        context = new TeamSiteDataContext(new Uri("https://ServerName>/_vti_bin/ListData.svc"));
    
        // Do not load your data at design time.
        if (!System.ComponentModel.DesignerProperties.GetIsInDesignMode(this))
        {
            //Load your data here and assign the results to the CollectionViewSource.
            myCollectionViewSource = (System.Windows.Data.CollectionViewSource)this.Resources["announcementsViewSource"];
            announcements.LoadCompleted += new EventHandler<LoadCompletedEventArgs>(announcements_LoadCompleted);
            announcements.LoadAsync(context.Announcements);
        }
    }
    

    請務必在正在執行 SharePoint 伺服器的名稱取代 ServerName 預留位置。

  12. 將下列錯誤處理程序。

    Private Sub announcements_LoadCompleted(sender As Object, e As LoadCompletedEventArgs)
        ' Handle any errors.
        If e.[Error] Is Nothing Then
            myCollectionViewSource.Source = announcements
        Else
            MessageBox.Show(String.Format("ERROR: {0}", e.[Error].Message))
        End If
    End Sub
    
    void announcements_LoadCompleted(object sender, LoadCompletedEventArgs e)
    {
        // Handle any errors.
        if (e.Error == null)
        {
            myCollectionViewSource.Source = announcements;
        }
        else
        {
            MessageBox.Show(string.Format("ERROR: {0}", e.Error.Message));
        }
    }
    

修改 Silverlight Web Part

變更在 Silverlight Web 組件專案的屬性啟用 Silverlight 偵錯。

修改 Silverlight Web 組件

  1. 開啟 Silverlight Web 組件專案 ([SLWebPartTest]) 捷徑功能表,然後選取 [屬性]。

  2. 在 [屬性] 視窗中,選取 [SharePoint] 索引標籤。

  3. 如果尚未選取,請選取 啟用偵錯的 Silverlight (而非偵錯的指令碼) 核取方塊。

  4. 儲存專案。

測試 Silverlight Web Part

在 SharePoint 中測試新的 Silverlight Web 組件以確保正確顯示 SharePoint 清單資料。

測試 Silverlight Web 組件

  1. 選擇 F5 鍵建立並執行 SharePoint 方案。

  2. 在 SharePoint 中,在 [設置動作] 功能表中,選擇 [新網頁]。

  3. 在 [新網頁] 對話方塊中,輸入標題,例如 SL Web 組件測試,然後選取 [建立] 按鈕。

  4. 在網頁設計工具, [編譯工具] 索引標籤上,選取 [插入]。

  5. 在索引標籤區域中,選取 [網頁組件]。

  6. 在 [分類] 方塊中,選取 [自訂] 資料夾。

  7. 在 [Web 組件] 清單中,選取 Silverlight Web 組件,然後選取 [新增] 按鈕加入 Web 組件加入至設計工具。

  8. 在您進行任何新增到想要的 Web 網頁後,請選取 [] 索引標籤,然後選取工具列的 [儲存和關閉] 按鈕。

    Silverlight Web 組件現在應該會顯示從 SharePoint 網站上的資料。根據預設,頁面在網站頁面儲存在 SharePoint 清單。

    注意事項注意事項

    當存取 Silverlight 資料跨網域時, Silverlight 防範可以用於利用 Web 應用程式的安全性弱點。如果您遇到問題,當存取 Silverlight 時的遠端資料的詳細資訊, 可讓服務可用在跨應用程式定義域界限請參閱

請參閱

概念

部署、發行和升級 SharePoint 方案套件

其他資源

建立 SharePoint 的 Web 組件