一般 Silverlight 控制項的樣式提示
Microsoft Expression Blend 附有許多 Microsoft Silverlight 控制項,可讓您用來提供絕佳的使用經驗。您也可以從信任的來源下載控制項。
如需詳細資訊,請參閱新增參照以匯入自訂控制項。
當您找到符合功能性需求的控制項但對外觀不滿意,如果該控制項支援範本,則可以修改控制項的範本來變更其外觀。
若要簡化操作程序,您可以先專注在設計上,透過使用繪圖工具及匯入圖案或其他資產,在畫板上繪製所有項目。完成後,您可以使用 [變成控制項] 命令將物件轉換為任何控制項的範本。
範本繫結
控制項具有範本中的物件可以繫結的屬性。這稱為「範本繫結」 ** 。藉由將範本的組件繫結至控制項,您可以有效地建立範本的參數。例如,與其說「這個 Rectangle 是藍色」,不如說「這個 Rectangle 與控制項的 Background 同色」。如此一來,當您將範本套用到具有不同 Background 屬性的控制項時,結果就是不同色的範本。
若要對屬性進行範本繫結,請選取範本中的物件,然後按一下 [屬性] 面板中的 [進階選項],再從 [範本繫結] 選擇屬性。
某些屬性,例如 OpacityMask 、 Font 、 FontSize 、 LayoutTransform 和 RenderTransform ,並不需要與範本繫結。這些屬性會自動套用到範本中的物件。
Content 與 Header 屬性
有多個控制項包含 Content 屬性 (例如 Button 、 CheckBox 和 RadioButton ) 或 Header 屬性 ( TabItem 和 MenuItem )。 Content 和 Header 屬性可用來顯示任何類型的內容。
顯示任何類型的內容
如果要顯示任何類型的內容 (不只是文字),範本中需要有 ContentPresenter 以及透過範本繫結至控制項之 Content (或 Header ) 屬性的 Content (或 Header ) 屬性。如果您使用 [變成控制項] 將圖案變成範本,Expression Blend 會將 [ContentPresenter] 新增到範本。如果您先前使用 TextBlock 來顯示內容,請在將圖案變成控制項後刪除 [TextBlock]。[ContentPresenter] 會顯示 TextBlock 先前所顯示的內容。
顯示文字
如果只要顯示文字,可以使用 TextBlock 而不必使用 ContentPresenter 。請將 TextBlock 放入範本,然後將 TextBlock 的 Text 屬性透過範本繫結至 Button 的 Content (或 Header ) 屬性。如果您使用 [變成控制項] 將圖案變成範本,而且先前使用 TextBlock 來顯示內容,請刪除 Expression Blend 新增到範本的 [ContentPresenter]。當您將文字新增到套用此樣式之控制項的 Content (或 Header ) 屬性時, TextBlock 會顯示該文字。
變成 ContentControl
當您使用 [變成控制項] 將包含 TextBlock 物件的圖案變成 ContentControl (例如按鈕) 的範本時,Expression Blend 會執行下列動作:
將 ContentPresenter 放入範本以取代 TextBlock 。
將 [版面配置] 屬性從 TextBlock 複製到 ContentPresenter 。
將 Typography 屬性從 TextBlock 複製到控制項的樣式。
將 Text 屬性從 TextBlock 複製到控制項之 Content 屬性的例項。
變成 TextBox
當您使用 [變成控制項] 將包含 TextBlock 物件的圖案變成 TextBox 的範本時,Expression Blend 會執行下列動作:
將代表 ContentElement 組件的 ScrollViewer 放入範本以取代 TextBlock 。
將 [版面配置] 屬性從 TextBlock 複製到 ContentElement 組件。
將 Typography 屬性從 TextBlock 複製到 TextBox 樣式。
將 Text 屬性從 TextBlock 複製到 TextBox 控制項的例項。
視覺狀態
狀態群組中的視覺狀態是互斥的。不過,任何群組中的狀態則獨立於任何其他群組中的狀態。這表示一次可以套用每個群組的任一種狀態,而不會產生衝突。
在相同群組的一種以上狀態中變更物件的屬性是常見的作法。例如,您可以針對 MouseOver 、 Pressed 和 Disabled 狀態變更 Rectangle 的 Fill 屬性。因為同時只會套用 CommonStates 狀態群組的一種狀態,所以可以這樣做。不過,在一個以上的狀態群組中變更物件的屬性會破壞狀態群組的獨立性質,若同時有一種以上的狀態嘗試設定相同物件的屬性,就會導致衝突。偵測到狀態衝突時,Expression Blend 會顯示警告。
重要訊息: |
---|
範本中的每個狀態名稱都必須是唯一的,即使是跨狀態群組。 |
Normal 視覺狀態
每個狀態群組都具有預設狀態。例如, CommonStates 具有 Normal ,而 CheckedStates 具有 Unchecked 。最佳的作法是在修改物件的屬性時,保留預設狀態不變。例如,對核取方塊來說,核取記號和核取方塊矩形在 Base 中是空白 (隱藏),而在 Checked (核取記號) 和 Focused (核取方塊矩形) 中則會顯示。
請注意, Base 並不是一種狀態。因此,您無法定義或控制 Base 與其他狀態間的切換。例如,您無法定義從 Base 到 MouseOver 的切換,因為 Base 不是狀態。 Base 代表範本的基本型態,未套用任何狀態。定義切換時應只考慮狀態。
當您建立自己的控制項範本時,應在每個狀態群組中定義一個一般狀態,並讓控制項在載入時預設為該一般狀態。如果控制項 (例如 Button ) 在載入時不是處於一般狀態,則切換 (例如,從 Normal 狀態到 MouseOver 狀態) 就無法執行。
本節內容
另請參閱
概念
定義控制項的不同視覺狀態
設定 Silverlight 控制項範本的組件樣式
設定支援範本之控制項的樣式
WPF 簡單樣式的樣式提示
Copyright © 2011 by Microsoft Corporation. All rights reserved.