首頁 > 控制項 > 簡單樣式 (Simple Styles) > 自訂 SimpleSlider 的 Thumb 元素

自訂 SimpleSlider 的 Thumb 元素

您可以在 Microsoft® Expression Blend™ 中，使用 SimpleSlider 控制項範本輕易地自訂 Thumb 控制項的外觀。

自訂 SimpleSlider 的 Thumb 元素

1. 在 Expression Blend 的畫板上繪製一個 SimpleSlider。

   在 [資產庫] 中，您可以從 [控制項] 索引標籤的 [Simple Styles] 類別中取得簡單樣式 (Simple Styles) 控制項。從清單中選取簡單樣式 (Simple Styles) 控制項之後，就可以在畫板上繪製該控制項。

2. 以滑鼠右鍵按一下 [物件與時間軸] 底下的滑桿，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。如果您不想變更 SimpleStyles.xaml 資源字典，您可以按一下 [編輯複本] 代替 [編輯範本] 來建立新範本並儲存至文件中。如需建立複本的詳細資訊，請參閱建立資源。

   若要結束範本編輯模式並返回您的文件範圍，請在 [互動] 面板中的元素樹狀目錄上方按一下 [選定範圍] 按鈕 。 若要返回現有範本的範本編輯模式，請在 [物件與時間軸] 下，以滑鼠右鍵按一下您要編輯其範本的元素，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯範本]。

3. 以滑鼠右鍵按一下 [物件與時間軸] 下的 [Thumb] 元素，指向 [編輯控制項組件 (範本)]，然後按一下 [編輯複本]。
4. 根據預設，Thumb 範本會包含具有 Ellipse 元素的格線。請刪除此 Ellipse 元素。
5. 在 [物件與時間軸] 下按兩下 Grid 元素，這樣就可以在此元素中新增子元素。
6. 使用 [工具箱] 上的 [畫筆] 工具 ，在 [Grid] 元素中繪製路徑。您可以使用 [直接選取] 工具 ，調整路徑上的點來修改路徑。

   若要放大顯示畫板上的內容，您可以使用畫板底部的 [縮放] 文字方塊 ，或是在按住 CTRL 鍵時使用滑鼠上的捲動按鈕。

   另一種代替使用 [畫筆] 工具來繪製路徑元素的方式，就是使用從 Microsoft® Expression® Design 匯入的藝術資源，或是已經新增至您專案中的影像檔。

7. 測試您的應用程式 (F5) 以查看效果。