首頁 > 控制項 > 建立內容控制項

建立內容控制項

「內容控制項」具有可以定義控制項所顯示之內容的單一內容屬性。內容屬性可以是簡單的文字字串，也可以是複雜的 Microsoft® .NET Framework 物件。若將版面配置面板控制項新增至內容控制項，則面板控制項會變成可在其中新增多個子元素的內容，因而可不受單一內容元素的限制。

下列程序顯示如何建立內容控制項 (按鈕)，並將其內容屬性設為版面配置面板 (StackPanel)。這個程序也可以搭配 MSDN 上＜ContentControl 類型＞(英文) 主題中＜Types＞下所列的其他內容控制項使用。

建立內容控制項

1. 在 Microsoft Expression® Blend 左邊的 [工具箱] 中，按一下 [資產庫] 按鈕 。在 [控制項] 索引標籤中，按一下 [系統控制項] (如果尚未選取)，然後從清單中選取 Button 。
   Button 控制項的圖示會顯示在 [資產庫] 按鈕上方，並且呈選取狀態，讓您可以將按鈕新增至畫板中。

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

2. 若要將按鈕新增至畫板，請按兩下 Button 控制項的 [工具箱] 圖示。
   按鈕的預設內容為 "Button" 字串。

   

   在畫板上建立的 Button 物件，大小與位置 (左上方) 為其預設值

   您也可以選取 [工具箱] 中的控制項，然後按一下畫板並拖曳滑鼠以指定控制項的選框工具，將控制項新增至畫板中。

   將 UI 設計元素 (例如 Button 控制項) 新增至畫板後，它就會變成應用程式中的「物件」。

3. 在 [物件與時間軸] 下，按兩下 Button 物件，使其成為啟動的元素。請注意，元素周圍會出現黃色的反白顯示。啟動物件可以讓您新增子元素。

   您也可以先選取 [工具箱] 中的 [選取] 工具 ，然後按兩下畫板上的物件，啟動畫板上的物件。

4. 在 [工具箱] 中，從 [資產庫] 或其中一個通用控制項的下拉式清單中選取 StackPanel 控制項 。按兩下 StackPanel 控制項的圖示，將該控制項新增為按鈕內的子元素。
   StackPanel 會取代 Button 物件的內容字串。若要查看此行為的證據，請選取 [物件與時間軸] 下的 [Button]，然後檢視 [屬性] 面板之 [通用屬性] 類別中的 [內容] 屬性。

   

   畫板上新增為按鈕內之子元素的 StackPanel 物件

5. 設為預設大小的 StackPanel，高度與寬度為 100，最小高度與寬度為 0。若要讓 StackPanel 更容易使用，請選取 [物件與時間軸] 下的 [StackPanel]，然後在 [屬性] 面板的 [版面配置] 類別中，將 [寬度] 變更為 150 像素 (與裝置無關的單位，約為 1/96 英吋)，以及將 [高度] 變更為 75 像素。請注意，當您調整按鈕的子元素 (StackPanel) 時，按鈕會自動調整大小。

   您也可以按住並拖曳選框工具角落處的提示符號，調整畫板上物件的大小。

6. 在 [物件與時間軸] 下的 [StackPanel] 仍為選取狀態時，將 [屬性] 面板之 [版面配置] 類別中的 [Orientation] 屬性設為 [Horizontal]，使 StackPanel 中的子元素以水平方向堆疊。在將項目新增至 StackPanel 前，此屬性變更不會影響 StackPanel 在畫板上的顯示。
7. 在 [物件與時間軸] 下，按兩下 [StackPanel] 物件來加以啟動，以便新增子元素。

   不同於大部分的 UI 元素，某些版面配置面板 (例如 StackPanel 和格線) 可包含多個子元素。這對整理和配置應用程式設計而言相當有用。如需詳細資訊，請參閱版面配置系統。

8. 從 [工具箱] 中選取 [橢圓形] 工具 ，然後在畫板上的 StackPanel 內繪製圓形。接著，從 [工具箱] 中選取 TextBox 控制項 ，並且在 StackPanel 內繪製此控制項。
   由於包含子元素的 StackPanel 方向為水平，子元素會由左至右並列堆疊。若要增加子元素間的間隔，可以調整 [屬性] 面板之 [版面配置] 類別中元素的 [Margin] 屬性。

   

   新增至 StackPanel 物件的子物件

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