建立已加上標題的控制項

標題控制項具有用以標記控制項的標題屬性。標題屬性可以像文字字串一樣簡單，也可以像 Microsoft .NET Framework 物件一樣複雜。根據您所用之已加上標題的控制項類型而定，已加上標題的控制項也可以顯示內容或項目集合。例如，[TabControl] 內的 [TabItem] 是已加上標題的內容控制項，而 [ToolBar] 及 [MenuItem] 都是標題項目控制項。

下列程序顯示如何在項目控制項 ([TabControl]) 內建立已加上標題的內容控制項 (TabItem 控制項)。此程序也可搭配使用在 MSDN 文件庫之 HeaderedContentControl 類型 主題 (英文) 的 "Types" 下，所列出之其他已加上標題的內容控制項。標題項目控制項會列於 MSDN 的 HeaderedItemsControl 類型 (英文) 中。

注意事項：
Microsoft Silverlight 1.0 專案中無法使用已加上標題的控制項。但是，您可以將包含 [TextBlock] 物件的 [Canvas] 版面配置面板分層，然後連接 JavaScript 事件處理常式，以根據使用者按下的索引標籤顯示或隱藏項目。如需有關 JavaScript 的詳細資訊，請參閱 Silverlight 指令碼與滑鼠事件 (英文)。

注意事項：
Silverlight 2 版本中已加上標題的控制項不隨附於 Microsoft Expression Blend 2 Service Pack 1。但是，Silverlight 2 SDK (包含在 Visual Studio 的 Microsoft Silverlight 工具) 隨附包含已加上標題的控制項 (如 TabControl) 組件。如需如何將組件加入至專案的詳細資訊，請參閱新增參照以匯入自訂控制項。

建立已加上標題的內容控制項

1. 在 Microsoft Expression Blend 左側的 [工具箱] 中，按一下 [資產庫] 按鈕。在 [控制項] 索引標籤中，按一下 [系統控制項] (若尚未選取)，然後從清單中選取 [TabControl] 控制項。

   [TabControl] 控制項的圖示會出現在 [資產庫] 按鈕上方，而且會為已選取狀態，您可隨時將 TabControl 新增至畫板。

   秘訣：
   最常用的使用者介面 (UI) 元素 (例如 [Button] 控制項) 已顯示於 [資產庫] 按鈕上方的下拉式清單中，以便您迅速新增這些 UI 元素。

2. 若要將按鈕新增至畫板，請按兩下 [TabControl] 控制項的 [工具箱] 圖示。[TabControl] 預設會包含兩個 [TabItem] 物件。

   畫板上以預設大小及位置建立的 TabControl 物件 (左上)

   

   秘訣：
   也可視需要將其他 [TabItem] 物件新增至 [TabControl]。在 [物件與時間軸] 下，按兩下 [TabControl] 物件，讓它成為已啟動的元素。並在 [工具箱] 中，從 [資產庫] 中選取 [TabItem] 控制項 (選取 [全部顯示] 核取方塊)。然後按兩下 [TabItem] 控制項的圖示，將它新增為 [TabControl] 的子元素。

3. 在畫板上，拖曳右下角的調整大小控點，以放大索引標籤控制項。您的指標會變更為雙頭箭號 ，表示可以進行調整大小作業。請放大 [TabControl]，讓它的頂端足以顯示三個索引標籤。

   秘訣：
   此外，您還可以在 [屬性] 面板的 [版面配置] 類別中設定 [Height] 及 [Width] 屬性，以調整 [TabControl] 的大小。

4. 若要命名其中一個 [TabItem] 物件，請在 [物件與時間軸] 下選取該物件，並在 [屬性] 面板的 [一般屬性] 類別中輸入 [Header] 屬性的名稱。例如，將第一個 [TabItem] 物件命名為 Personal Info。

   秘訣：
   您也可以將另一個控制項 (如 [Image] 控制項) 當做 [TabItem] 的標題使用。在 [物件與時間軸] 下，展開 [TabItem] 物件，並按兩下 [Header] 物件，讓它成為已啟動的元素。您可以從 [工具箱] 或 [檔案] 面板新增 [Image] 控制項。

5. 若要新增其中一個 [TabItem] 物件的內容，請在 [物件與時間軸] 下按兩下該物件加以啟動。

6. 在 [工具箱] 中，按兩下 [StackPanel] ，將 [StackPanel] 新增至 [TabItem]。[TabItem] 的內容屬性會從預設 [Grid] 物件變更為 [StackPanel] 物件。

   秘訣：
   內容屬性只可包含一個項目。這有助於將面板控制項 (如 [StackPanel] 或 [Grid]) 當作該項目使用，然後將多個項目新增至面板控制項。

7. 在 [物件與時間軸] 下，按兩下 [StackPanel] 物件，讓它成為使用中的元素。您現在可以將所需數目的元素新增至 [TabItem]。例如，您可以從 [工具箱] 中新增 [TextBlock] 或 [ListBox] 控制項。

   新增至 TabControl 物件的子物件

   

8. 如果想要新增整個 [TabControl] 的框線及標題，可以使用另一個標題內容控制項：[GroupBox] 控制項。如果已在 [物件與時間軸] 下啟動 [LayoutRoot] 物件，請從 [資產庫] 中選取 [GroupBox] 控制項，然後使用滑鼠在畫板上繪製控制項，讓它稍微比 [TabControl] 大。

9. 若要讓 [TabControl] 成為 [GroupBox] 的子元素，請在 [物件與時間軸] 下將 [TabControl] 拖曳至 [GroupBox]。

   將 TabControl 拖曳至 GroupBox

   

10. 在 [物件與時間軸] 下選取 [GroupBox]，然後在 [屬性] 面板的 [一般屬性] 類別中變更 [Header] 屬性，以變更 [GroupBox] 的標題。

11. 建置專案 (F5) 以查看產生的應用程式。

    注意事項：
    如需包含會對 [ListBox] 中選定項目反應之程式碼的完整範例，請參閱 MSDN 文件庫的 GroupBox 範例 (英文)。範例程式碼位於可從 Windows SDK .NET Framework 3.0 範本 (英文) 取得的 WPFSamples.exe 套件中。