繪製內容控制項
「內容控制項」具有可以定義控制項所顯示之內容的單一內容屬性。內容屬性可以是簡單的文字字串,也可以是複雜的 Microsoft .NET Framework 物件。若將版面配置面板控制項新增至內容控制項,則面板控制項會變成可在其中新增多個子物件的內容,因而可不受單一內容物件的限制。
下列程序顯示如何建立內容控制項 (按鈕),並將其內容屬性設為版面配置面板 (StackPanel)。您也可以將此程序用於 MSDN 上 ContentControl Types (ContentControl 類型) 主題之<Types>(類型) 下列出的其他內容控制項。
建立內容控制項
在 Microsoft Expression Blend 應用程式視窗左側的 [工具] 面板中,按一下 [資產]。在 [資產] 面板的 [控制項] 類別中,從清單選取 [Button] 。
[Button] 控制項的圖示會出現在 [工具] 面板中的 [資產] 按鈕下方,而且為已選取狀態,您可隨時將 [Button] 新增至畫板。
秘訣: 最常用的使用者介面 (UI) 元素 (例如 [Button] 控制項) 已顯示於 [資產] 按鈕下方的下拉式清單中,方便您迅速新增這些 UI 元素。
若要將按鈕新增至畫板,請按兩下 [Button] 控制項的 [工具] 面板圖示。按鈕的預設內容為 "Button" 字串。
在畫板上建立的 Button 物件,大小與位置 (左上方) 為其預設值
秘訣: 您也可以選取 [工具] 面板中的控制項,然後按一下畫板並拖曳滑鼠以指定控制項的週框方塊,將控制項新增至畫板中。
秘訣: 將 UI 設計元素 (例如 [Button] 控制項) 新增至畫板後,它就會變成應用程式中的「物件」。
在 [資產] 面板中 [控制項] 類別的 [面板] 下,選取 [StackPanel] 。按兩下 [StackPanel] 控制項的圖示,將該控制項新增至畫板。
在 [物件與時間軸] 面板中,將 StackPanel 物件拖曳到 Button 物件。
[StackPanel] 會取代 [Button] 物件的內容字串。若要查看此行為的證據,請選取 [物件與時間軸] 面板中的 [Button],然後檢視 [屬性] 面板之 [一般屬性] 類別中的 [Content] 屬性。
畫板上新增為按鈕內之子物件的 StackPanel 物件
設為預設大小的 [StackPanel],高度與寬度為 100,而最小高度與寬度為 0。若要讓 [StackPanel] 更容易使用,請選取 [物件與時間軸] 面板中的 [StackPanel],然後在 [屬性] 面板的 [版面配置] 類別中,將 [Width] 變更為 150 像素 (換算為與裝置無關的單位約為 1/96 英吋),以及將 [Height] 變更為 75 像素。
秘訣: 您也可以拖曳週框方塊角落處的提示符號,調整畫板上物件的大小。
若要讓 Button 物件隨著您調整其子物件 (StackPanel 物件) 而自動調整大小,請選取 Button 物件,然後在 [屬性] 面板的 [版面配置] 類別中,將 [Width] 和 [Height] 屬性設定為 [Auto].
在 [物件與時間軸] 面板中的 [StackPanel] 呈選取狀態時,將 [屬性] 面板之 [版面配置] 類別中的 [Orientation] 屬性設為 [水平],使 [StackPanel] 中的子物件以水平方向堆疊。
在 [物件與時間軸] 面板中,按一下 [StackPanel] 物件將它啟動,以便新增子物件。
秘訣: 不同於大部分的 UI 元素,某些版面配置面板 (例如 [StackPanel] 和 [格線]) 可包含多個子物件。這對整理和配置應用程式設計而言相當有用。如需詳細資訊,請參閱排列物件。
從 [工具] 面板中選取 [橢圓形] ,然後在畫板上的 [StackPanel] 內繪製圓形。接著,從 [工具] 面板中選取 [TextBox] ,並且在 [StackPanel] 內繪製此控制項。由於包含子物件之 [StackPanel] 物件的方向為水平,所以子物件會由左至右並列堆疊。若要增加子物件間的間隔,可以調整 [屬性] 面板之 [版面配置] 類別中物件的 [Margin] 屬性。
新增至 StackPanel 物件的子物件
建置專案 (F5) 以查看產生的應用程式。