在 Silverlight 2 應用程式中動態載入新網頁

在 Silverlight 2 應用程式中有許多方法可動態載入內容。此程序會建立內容網頁的物件，然後載入其中一個物件，以在使用者按一下按鈕時顯示內容。您可以在 MSDN 的 Silverlight 文件 (英文) 以及 Silverlight 社群網站 (英文) 中找到其他解決方案。

若要在執行階段載入網頁

1. 在具有多個內容網頁的 Silverlight 2 專案中，開啟啟動頁面 (通常是 Page.xaml)。針對此教學課程，假設您有兩個名為 UserControl1.xaml 和 UserControl2.xaml 的內容網頁。

   秘訣：
   若要新增內容網頁，請按一下 [檔案] 功能表上的 [新增項目]。

2. 在 [工具箱] 中，按一下 [資產庫]  按鈕，然後選取 [框線]  版面配置面板。使用您的滑鼠，在畫板上繪製框線物件。

   

   秘訣：
   在選取新框線物件時，您可以設定 [屬性] 面板中 [筆刷] 和 [外觀] 下的屬性，變更該物件的外觀。例如，您可以將 BorderBrush 屬性設定為 [單色筆刷] ，並將 BorderThickness 屬性設定為 2。

3. 在 [物件與時間軸] 下，以滑鼠右鍵按一下 [框線] 物件，並選取 [重新命名]，然後將物件名稱變更為 [PageContainer]。這讓您日後可在程式碼後置檔案中參考此物件。

4. 在 [物件與時間軸] 下，按兩下 [LayoutRoot] 物件，讓它成為使用中的物件。[LayoutRoot] 周圍會出現黃色的框線，且您在畫板上所繪製的任何新物件將成為 [LayoutRoot] 的子物件。

5. 在 [工具箱] 中，按一下 [按鈕] ，然後在 [PageContainer] 物件外的畫板上繪製按鈕。

   秘訣：
   在您繪製可顯示文字的控制項之後，可以按下 F2 進入文字編輯模式以修改文字。若要結束文字編輯模式，請按 ESC 鍵。

6. 選取 [物件與時間軸] 下的 [按鈕] 物件。

   

7. 在 [屬性] 面板中，按一下 [事件]  按鈕以將屬性檢視切換為事件檢視。

   秘訣：
   若要將 [屬性] 面板切換回屬性檢視，請按一下 [屬性]  按鈕。

8. 連按兩下 Click 事件旁的文字方塊。Microsoft Expression Blend 會產生事件處理常式 (使用者於執行中應用程式內按一下按鈕時呼叫) 的名稱 (Button_Click)。

   

   Expression Blend 會複製事件處理常式的程式碼到剪貼簿，然後在 Microsoft Visual Studio 2008 中開啟專案 (若已安裝)。

   如果您沒有安裝程式碼編輯器，請在文字編輯器中開啟使用者控制項的程式碼後置檔案，並貼入下列程式碼：

   private void Button_Click(object sender, RoutedEventArgs e)
   {
   
   }
   

   Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
   
   End Sub
   

   如需有關 Visual Studio 2008 與 Expression Blend 互通性的詳細資訊，請參閱編輯程式碼後置檔案。

9. 若要在 [PageContainer] 框線物件中所顯示的兩個內容網頁之間進行切換，請在記憶體中建立網頁的例項，然後在事件處理常式中，新增其中一個網頁至 [PageContainer]。例如，將下列粗體標示的程式碼貼入您的程式碼後置檔案中：「UserControl1」和「UserControl2」是您專案中其他兩個內容網頁的名稱。

   秘訣：
   框線控制項僅能有一個子物件。對於可包含多個子控制項的控制項，例如 [格線]  版面配置面板，該程式碼會略有不同。

   private UserControl1 uc1 = new UserControl1();private UserControl2 uc2 = new UserControl2();private bool atUC2 = false;
   
   private void Button_Click(object sender, RoutedEventArgs e)
   {
     if (atUC2)  {    this.PageContainer.Child = uc1;  }  else  {    this.PageContainer.Child = uc2;  }  atUC2 = !atUC2;
   }
   

   Private uc1 As UserControl1 = New UserControl1()Private uc2 As UserControl2 = New UserControl2()Private atUC2 As Boolean = False
   
   Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
     If atUC2 Then    Me.PageContainer.Child = uc1  Else    Me.PageContainer.Child = uc2  End If  atUC2 = Not atUC2
   End Sub
   

10. 測試您的專案 (F5)，然後按一下按鈕以檢視 UserControl1 和 UserControl2 是否載入至 [PageContainer] 框線中。

    

疑難排解

• 如果出現「無法變更程式碼後置檔案。找不到下列類別」的錯誤，當您在 Expression Blend 中的 [事件] 面板內按兩下時，則可能需要切換至外部程式碼編輯器 (通常是 Microsoft Visual Studio) 以重新載入解決方案。重新載入將會包含定義遺失類別的新檔案。如果在 Visual Studio 2008 中出現「無法載入解決方案」的錯誤，則可能是尚未安裝 Visual Studio 2008 的 Microsoft Silverlight 工具 (英文)。請安裝該工具然後嘗試在 Expression Blend 中的 [事件] 面板內按兩下。

• 如果您無法檢視動態載入網頁的內容，可能是 [PageContainer] 框線太小而放不下所有載入的內容。請嘗試放大 [PageContainer] 框線，或將動態載入網頁中的版面配置屬性進行下列設定：

  • Width = Auto

  • Height = Auto

  • Margin 屬性 = 0

• 如果按鈕在您按下時消失，可能是因為您將按鈕物件新增為 [PageContainer] 框線的子物件，而不是 [LayoutRoot] 的子物件。(您新增的程式碼將取代 [PageContainer] 框線物件的子物件)。在 [物件與時間軸] 下，您可以將按鈕物件拖曳至 [LayoutRoot] 面板，將它從 [PageContainer] 框線移出。

• 如果您建立新物件來觸發載入網頁 (而非按鈕)，然後在 Expression Blend 中，將 Button_Click 事件處理常式的名稱複製到 [屬性] 面板之 [事件]  檢視中的新物件，則可能在測試 (F5) 專案時，在網頁瀏覽器中發生錯誤。這可能是因為不符合新物件類型的事件處理常式的錯誤簽章所致。例如，按鈕 Click 事件處理常式的簽章，如下所示：

  private void Button_Click(object sender, RoutedEventArgs e)
  

  Private Sub Button_Click(ByVal sender As System.Object, ByVal e As System.Windows.RoutedEventArgs)
  

  MouseLeftButtonDown 事件處理常式的簽章，如下所示：

  private void Path_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
  

  Private Sub Path_MouseLeftButtonDown(ByVal sender As System.Object, ByVal e As System.Windows.Input.MouseButtonEventArgs)
  

  您可以在 [屬性] 面板之 [事件]  檢視中，按兩下正確的事件處理常式旁的文字方塊，使用正確的簽章在程式碼後置檔案中建立新方法，藉此修正此問題。

下一步

• 您可以在 Silverlight 社群網站 (英文) 中找到特定工作的其他相關使用方法和視訊。