修改不同狀態的系統控制項外觀

控制項在不同的狀態下，會有不同的外觀。例如，將滑鼠指標移至狀態的上方時，按鈕的顏色會稍微改變。「MouseOver」是狀態按鈕之一。您可以自訂不同狀態的系統控制項外觀。

下列程序會使用按鈕，但是您可以自訂任何隨附在 Microsoft Expression Blend 中的系統控制項，或任何繼承自 Control 類別的匯入自訂 Microsoft Silverlight 控制項。

修改不同狀態的按鈕外觀

1. 為系統控制項 (例如 [Button] 控制項 ) 建立可重複使用的範本。

2. 若尚未準備進入範本的編輯模式，請在畫板的控制項上按一下滑鼠右鍵，指向 [編輯範本]，然後按一下 [編輯目前的項目]。您也可以選擇在階層連結列中選取物件然後按一下 [範本]。

   

3. 進入範本編輯模式時，[狀態] 面板中會顯示按鈕的狀態 (如 [Normal] 和 [MouseOver])。狀態會內含在狀態群組中 (如 [CommonStates] 和 [FocusStates])。

   

   範本的組件會在 [物件與時間軸] 面板中顯示。而這些組件的外觀是已選取狀態的可修改部分。

   

4. 按一下 [狀態] 面板中的 [MouseOver]。請注意出現在畫板上方的紅色圓形，該圖形表示已開啟狀態錄製。而這代表在已選取的 狀態中會錄製任何您所變更的屬性。在 [物件與時間軸] 面板中，Expander 按鈕周圍的紅色圓形會識別範本組件與選取 [Base] 時的不同屬性設定。

   

5. 若要變更按鈕在 [MouseOver] 狀態中的大小，請按一下 [物件與時間軸] 面板中的 [格線]。

   秘訣：
   [格線]  是根據水平對齊、垂直對齊和邊界來排列子物件的版面配置面板。如需版面配置面板的詳細資訊，請參閱排列物件 與 使用格線版面配置面板。

6. 在 [屬性] 面板的 [轉換] 下，按一下 [縮放] 索引標籤 。將 [X] 和 [Y] 的值變更為 1.1。

7. 儲存檔案 (CTRL+S)，然後按 F5 鍵以建置並測試您的應用程式。在瀏覽器視窗中開啟應用程式之後，將滑鼠指標移至按鈕上方將其展開。

疑難排解

• 某些範本組件的屬性繫結範本外的值。例如，[Background] 組件的 [Fill] 屬性是「範本繫結」至按鈕的 [Background] 屬性。這表示當使用此範本繪製按鈕時，範本會自動套用該按鈕所設定的值。雖然範本繫結可讓使用者設計自訂的控制項，但將控制項加入應用程式時仍會啟用部分變更。

  範本中的黃色週框方塊會識別繫結屬性。若要變更範本繫結屬性，請依序按一下屬性旁的 [進階屬性選項]  和 [重設]。

  

• 無法將自訂狀態和狀態群組加入系統控制項的範本。但是，您可以建立自訂使用者控制項，然後定義自訂狀態並加入程式碼，進而根據使用者互動來變更狀態。

  如需詳細資訊，請參閱下列主題：

  • 在專案中建立新的使用者控制項

  • 定義使用者控制項的不同視覺狀態和切換時間

  • 根據使用者互動變更狀態

• 若您無法在瀏覽器中檢視應用程式，那麼，您所安裝的 Silverlight 執行階段可能不正確。

  如需詳細資訊，請參閱安裝 Silverlight 工具和執行階段。

下一步

• 您可以變更滑鼠指標移到按鈕上方時，展開按鈕所需的時間。如需詳細資訊，請參閱修改狀態變更之間的切換時間。

• 您可以加入動畫，例如當滑鼠指標移到按鈕上方時按鈕會旋轉。如需詳細資訊，請參閱新增狀態變更後播放的動畫。

• 您也可以套用此範本至專案中的按鈕，或繪製已指派範本的新按鈕。如需詳細資訊，請參閱套用樣式資源。

請參閱

工作

在專案中繪製控制項

修改狀態變更之間的切換時間

建立可重複使用的範本以設定系統控制項的樣式