將物件建立到按鈕中

您可以使用 Microsoft Expression Blend 中的 [製作按鈕] 功能，透過畫板上的任意物件 (如影像或圖形) 來製作按鈕。[製作按鈕] 工具會將物件包裝在您可以套用至任何其他按鈕物件的樣式資源中。

秘訣：
Expression Blend 中的「物件」是任何您可以放在畫板上的項目，例如版面配置面板、圖形、文字控制項、影像、按鈕、控制項範本或任何其他使用者介面 (UI) 設計元素。將 UI 元素放到畫板上，就會在應用程式中建立該元素的物件例項。

透過橢圓形建立按鈕

1. 如果尚未這麼做，請開啟或建立新的專案。如需詳細資訊，請參閱建立新文件或專案。

2. 在畫板上，使用 [工具箱] 中的 [橢圓形] 工具繪製圓形。若要使橢圓形變得更明顯，您可以在 [屬性] 面板的 [筆刷] 下變更橢圓形的屬性，以變更外觀。如需詳細資訊，請參閱將筆刷套用至物件的填滿或筆觸。

3. 如果已在 [互動] 面板的 [物件與時間軸] 下選取橢圓形，請按一下 [工具] 功能表上的 [製作按鈕]，將橢圓形轉換為按鈕。此時會開啟 [建立樣式資源] 對話方塊。

4. 在 [資源名稱 (索引碼)] 下，選取第一個選項按鈕 (預設值)，然後輸入要用以識別按鈕樣式的名稱。如果畫板上的按鈕尚未依名稱來參照樣式，您也可以選取 [全部套用] 選項，將該樣式套用至畫板上的這類按鈕。

5. 在 [定義於] 之下，按一下會反映要在其中定義按鈕樣式的選項。按一下 [應用程式]，可以讓按鈕樣式適用於應用程式中的所有文件。按一下 [此文件 (Window: Window)]，則可讓按鈕樣式只適用於目前的文件。而按一下 [資源字典]，則可以在應用程式的資源字典中定義按鈕樣式。

6. 按一下 [確定] 結束 [建立樣式資源] 對話方塊，以及建立按鈕樣式。

   請注意，在 [物件與時間軸] 下，橢圓形物件會轉換為按鈕物件，而此按鈕物件的樣式會設為新的按鈕樣式。

   此外，按鈕樣式會列在定義該按鈕樣式之節點的 [資源] 索引標籤中 (例如，在 [視窗] 節點中)。

   出現在 Expression Blend 的 [資源] 索引標籤中的新按鈕樣式

   

回到頁首

修改按鈕樣式

1. 若要修改剛才所建立的按鈕樣式，請以滑鼠右鍵按一下 [物件與時間軸] 下的新按鈕物件，並指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。

   畫板會切換為控制項範本的編輯範圍。

   秘訣：
   有多種方式可以進入控制項範本的編輯範圍。例如，您可以在 [資源] 索引標籤中檢視按鈕樣式，然後按一下資源名稱旁邊的 [編輯資源] 按鈕。如此會帶您進入樣式的編輯範圍，並由此進入控制項範本的編輯範圍，方法是以滑鼠右鍵按一下 [物件與時間軸] 下的樣式物件，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。 若要結束控制項範本的編輯範圍，請按一下 [物件與時間軸] 下的 [選定範圍] 按鈕。如果已從樣式的編輯範圍進入控制項範本的編輯範圍，則會回到該樣式。請再按一下 [選定範圍] 按鈕，回到文件的編輯模式。

   秘訣：
   [製作按鈕] 工具會將原始物件 (橢圓形) 包裝在含有控制項範本的樣式資源中。樣式可定義在套用樣式之物件上所設定的屬性 (在此情況下，即為按鈕物件)。而控制項範本可定義物件的狀態、結構及外觀。

2. 控制項範本內有 [格線] 面板，內含原始物件 (橢圓形) 以及可顯示按鈕物件內容的 [ContentPresenter] 元素。將物件置於 [格線] 面板內，可讓您快速新增及排列其他元素。

   新按鈕樣式的控制項範本結構

   

   您可以查看資源的可延伸應用程式標記語言 (XAML)，查看樣式及控制項範本的關係。例如，按鈕樣式結構可能如下所示：

     <Window.Resources>
       <Style x:Key="ButtonStyle1" ...>
         <Setter Property="Template">
           <Setter.Value>
             <ControlTemplate TargetType="{x:Type Button}">
               <Grid>
                 <Ellipse>
                   ...
                 </Ellipse>
                 <ContentPresenter .../>
               </Grid>
               <ControlTemplate.Triggers>
                 ...
               </ControlTemplate.Triggers>
             </ControlTemplate>
           </Setter.Value>
         </Setter>
       </Style>
     </Window.Resources>
   

3. 在 [互動] 面板的 [觸發程序] 下，視需要定義按鈕的狀態。例如，按一下 [IsMouseOver = True] 會在使用者將滑鼠移過按鈕上方時，啟動狀態的觸發程序記錄。選取 [物件與時間軸] 下的橢圓形，然後在 [屬性] 面板的 [外觀] 之下，將橢圓形的 [Fill] 屬性變更為不同的色彩。請注意，[ellipse.Fill] 的新屬性變更會新增至 [使用時的屬性] 的 [觸發程序] 之下 (如下列影像所示)。

   注意事項：
   您可能必須調整 [觸發程序] 窗格的大小，才能看到 [使用時的屬性] 區段。若要調整大小，請按一下並拖曳窗格的框線及窗格內的框線。

   指標在按鈕上方且變更橢圓形的 [Fill] 之後的 [觸發程序] 面板

   

4. 您也可以新增按鈕的動畫。例如，在 [觸發程序] 面板中，按一下 [IsPressed = True]，會在使用者按一下按鈕時，啟動狀態的觸發程序記錄。如果橢圓形在 [物件與時間軸] 下仍然為選取狀態，則請按住 SHIFT 及 ALT 鍵，並拖曳橢圓形的一角。(SHIFT+ALT 組合鍵可維持物件的中心點)。

   您也可以建立新腳本，並從 [IsPressed] 事件的 [事件觸發程序] 觸發該腳本，以新增更加複雜的動畫。如需詳細資訊，請參閱觸發程序與使用者互動功能。

5. 視需要定義按鈕的狀態之後，請按一下 [物件與時間軸] 下的 [選定範圍] 按鈕，回到文件的編輯範圍。

6. 若要測試狀態，請按一下 [專案] 功能表上的 [測試專案] (或按 F5)，然後查看按鈕狀態是否正常運作。例如，將指標移至按鈕上方時，填滿色彩應該會改變。

回到頁首

將按鈕樣式套用至按鈕

1. 確定您位於想要的編輯範圍中。您可以將樣式套用至任何範圍中的按鈕 (包括控制項範本的範圍內)。

2. 在畫板上，使用 [工具箱] 中的 [Button] 控制項繪製按鈕。

3. 以滑鼠右鍵按一下 [物件與時間軸] 下的新按鈕物件，並依序指向 [編輯控制項組件 (範本)] 及 [套用資源]，然後從清單中選取按鈕樣式。

   您也可以使用 [物件] 功能表上的 [編輯樣式] 及 [編輯控制項組件 (範本)] 命令來套用樣式資源。

   使用按一下滑鼠右鍵的方法，將按鈕樣式套用至按鈕物件

   

回到頁首

移除或變更按鈕樣式

• 因為按鈕樣式是資源，所以您可以將它視同任何其他資源。如需有關移除或變更樣式資源的詳細資訊，請參閱資源中的 HOW TO 主題。

回到頁首

請參閱

概念

從現有的物件建立控制項