試試看:使用效果設定按鈕樣式
除了使用屬性觸發程序來根據使用者互動以變更按鈕的外觀以外,在 Microsoft Expression Blend 中,您還可以對每一種狀態套用效果。
在按鈕上建立效果
在 Expression Blend 的畫板上繪製一個 SimpleButton 物件。
秘訣:
在 [資產] 面板的 [樣式] 類別中,[簡單樣式] 下提供可用的簡單樣式控制項。從清單中選取簡單樣式控制項之後,就可以在畫板上繪製該控制項。
以滑鼠右鍵按一下 [物件與時間軸] 面板中的按鈕,指向 [編輯範本],然後按一下 [編輯目前的項目]。若不想變更 SimpleStyles.xaml 資源字典,您可以按一下 [編輯複本] 代替 [編輯目前的項目] 來建立新範本並儲存至文件中。
如需有關建立複本的詳細資訊,請參閱建立資源。
秘訣:
若要結束範本編輯模式並返回您的文件範圍:在 [物件與時間軸] 面板中的物件樹狀目錄上方,按一下 [將範圍傳回]
。
若要返回現有範本的範本編輯模式:在 [物件與時間軸] 面板中,以滑鼠右鍵按一下要編輯範本的物件,指向 [編輯範本],然後按一下 [編輯目前的項目]。
在控制項範本的編輯範圍中,刪除 [Grid] 物件的 [Border] 子物件。
按一下 [Grid] 物件,使其成為使用中狀態,以便新增子物件。
在格線中繪製 [矩形] 物件,然後在 [屬性] 面板的 [筆刷] 下將 [Fill] 屬性設為黃色。
以滑鼠右鍵按一下 [矩形] 物件,指向 [順序],然後按一下 [移到最下層],將矩形物件放在 [ContentPresenter] 物件的後一層。
使用提示
(當滑鼠指標移至矩形左上角之外的兩個控點之一時出現),或在 [屬性] 面板的 [外觀] 下使用 [RadiusX] 和 [RadiusY] 屬性,將 [Rectangle] 物件變成圓角。
從 [資產] 面板的 [效果] 類別,將 [DropShadowEffect] 物件拖曳到 [矩形] 物件。
陰影隨即新增至 [矩形] 物件,成為子物件。
在 [物件與時間軸] 面板中選取 [DropShadowEffect] 後,在 [屬性] 面板中調整該效果的屬性。請將 [ShadowDepth] 屬性設為 20。
在 [觸發程序] 面板中,按一下 [IsMouseOver = True] 觸發程序,以啟用觸發程序錄製功能。在 [屬性] 面板中,將 [ShadowDepth] 屬性設為 25。
[觸發程序] 面板中的 [使用時的屬性] 下會出現新行,反映當滑鼠移至按鈕上方時會發生的屬性變更。
秘訣:
您可能需要調整 [觸發程序] 面板的視窗,才能看到所有的觸發程序和動作。請使用滑鼠來調整視窗的大小。
在 [觸發程序] 面板中,按一下 [IsPressed = True] 觸發程序,以啟用觸發程序錄製功能。在 [屬性] 面板中,將 [ShadowDepth] 屬性設為 10。
[觸發程序] 面板中的 [使用時的屬性] 下會出現新行,反映在執行中應用程式裡按一下按鈕時會發生的屬性變更。
在 [觸發程序] 面板中按一下 [預設],關閉觸發程序錄製功能。
測試您的應用程式 (F5) 以查看使用中的效果。