SimpleSlider

滑桿是簡單的控制項，可讓使用者藉由移動 Thumb 控制項，在各式各樣的值中選擇。根據預設，滑桿會以水平方式顯示，但您可以在 Microsoft Expression Blend 的 [屬性] 面板中的 [一般屬性] 下設定 [Orientation] 屬性，將它變更為以垂直方式顯示。若要設定滑桿值，請使用 Minimum、Maximum 和 Value 屬性。

SimpleSlider 控制項的畫板檢視

深入控制項範本

SimpleSlider 控制項範本由下列項目組成：

• 名稱為 GridRoot 的 [格線] 面板：在滑桿內用來存放多個子元素。Grid 可讓應用程式使用者介面 (UI) 設計師輕鬆地將更多元素新增至範本。GridRoot 會分割成三列：最上列會保留 TopTick 元素，中間列會保留 Thumb 元素，而最下列則保留 BottomTick 元素。

• 名稱為 TopTick 和 BottomTick 的兩個 TickBar 元素：用來顯示滑桿上的記號。根據預設，Visibility 屬性會設為 [折疊]。TickBar 元素會根據這個範本所套用的屬性 (在滑桿控制項上設定)，決定要顯示的刻度數。TickBar 元素不會提供可編輯的範本，但是您可以設定滑桿控制項上的 Foreground 屬性 (這個 TickBar 是受限於範本之滑桿控制項的 Foreground 屬性)，即可設定用來顯示記號的筆刷。

• [框線] 元素：此元素有 BorderThickness 屬性，可以透過範本繫結至套用此範本之按鈕控制項的 BorderThickness 屬性。

• 名稱為 PART_Track 的 Track 元素：用來顯示沿著捲軸的 Thumb 元素。使用者可以拖曳 Thumb 元素。根據預設，Thumb 元素會使用您可以編輯的 SimpleThumbStyle 範本。

• 兩個 RepeatButton 元素：包含在 PART_Track 元素內，可讓使用者按一下捲動方塊的任一邊來對滑桿值做較大的變更。您可以在滑桿的 LargeChange 屬性中 (而非範本)，對這些變更指定步驟值。當使用者以方向鍵來移動捲動方塊時，會使用 SmallChange 屬性所指定的間距值。

• 版面配置轉換：用來顯示水平方向的滑桿。這項設計讓您不需費力編輯兩個不同的範本，省事許多。不過，如果需要使用兩個差異極大的方向，則需要不同的範本。在這種情況下，您可以在 Expression Blend 的 XAML 檢視中，在 <Style> 元素中使用 XAML 資源庫，根據方向來切換範本。系統 Slider 控制項的預設範本中可找到此範例。

  警告：
  請勿重新命名以 "PART_" 作為名稱開頭的任何元素，因為實作控制項的程式碼會參照這些元素。

  物件檢視：SimpleSlider 控制項的基本部分 (範本)

  

回到頁首

使用屬性觸發程序

控制項範本中的屬性觸發程序，可讓控制項回應屬性變更。您可以在 [互動] 面板中，按一下 [觸發程序] 底下的項目，檢視觸發程序啟動時變更的屬性。例如，在 SimpleSlider 範本中，觸發程序便是根據 TickPlacement 屬性，決定是否顯示 TickBar 元素。該屬性可以設定 TopTick 和 BottomTick 元素的可見度。在 SimpleSlider 範本的觸發程序中，還可設定水平和垂直方向。方法是在滑桿上套用版面配置轉換，將滑桿以 90 度旋轉。由於追蹤會自行自動定位，因此會強制回復原狀以避免旋轉兩次。

回到頁首

使用筆刷

在 SimpleStyles.xaml 資源字典中，SimpleSlider 範本會使用下列筆刷資源：

• 當沒有任何作用中的觸發程序時，Background 屬性是使用 LightBrush 來設定，而當 IsEnabled 為 False 時，則是使用 DisabledBackgroundBrush 來設定。

• 當沒有任何作用中的觸發程序時，BorderBrush 屬性是使用 NormalBorderBrush 來設定，而當 IsEnabled 為 False 時，則是使用 DisabledBorderBrush 來設定。

• TopTick 元素的 Foreground 屬性是使用 GlyphBrush 來設定。

• SimpleThumb 範本的 Fill 屬性是使用 NormalBrush 來設定，而 Stroke 屬性是使用 NormalBorderBrush 來設定。

回到頁首

最佳作法與設計方針

• 一般而言，如果您希望設計師在控制項上新增更多視覺元素，請使用 Grid 控制項作為範本的根。Expression Blend 會搜尋類似 Grid 控制項的版面配置面板，並且將它設為預設啟用，讓新增至畫板的新元素成為版面配置面板的子元素。

• 若有需要，您可以將觸發程序新增至 SimpleSlider 範本，或修改 PART_Track 元素，讓滑桿看起來更有趣，但請勿重新命名以 "PART_" 作為名稱開頭的任何元素，因為實作控制項的程式碼會參照這些元素。Thumb 和重複按鈕必須放置在 Track 內正確的元素中。追蹤控制項知道如何根據 Slider 值來放置 Thumb 元素。重複按鈕會使用命令繫結來增加或減小滑桿的值。

• 當您編輯 SimpelSlider 的範本時，可以使用 [互動] 面板的 [觸發程序] 區域來選取適當的觸發程序，強制顯示 TickBar 元素。例如，在 SimpleSlider 範本中，當 TickPlacement 設為 [兩者] 時，如果將 Visibility 屬性設為 [可見] 即可顯示這兩個 TickBar 元素。

回到頁首

請參閱

概念

試試看：自訂 SimpleSlider 的 Thumb 元素