Slider 控件样式设置提示

Slider 控件表示一个值范围，其中的当前值由称为 Thumb 的对象类型的位置表示。

与所有控件一样，您可以修改 Slider 控件，使其外观与其默认外观截然不同。默认情况下，Slider 控件如下所示：

重要的 Slider 控件属性

通过在“属性”面板中的“公共属性”下设置“Orientation”属性，可以使 Slider 控件沿水平或垂直方向放置。还可以通过选择“IsDirectionReversed”属性，反转数字的方向。可以通过设置“Minimum”和“Maximum”属性来指定值范围。当前值（在“Value”属性中指定）必须介于最小值和最大值之间。“公共属性”类别中还有其他一些可设置的属性，如“LargeChange”和“SmallChange”属性。

可通过下列方法设置这些属性：

• 设置对象的属性   在美工板绘制 Slider 对象之后，您可以直接设置该对象的这些属性。如果希望若干 Slider 控件使用相同的值，请在样式中设置这些属性。

• 在样式中设置属性   如果在 Slider 对象的样式 中设置这些属性，则使用该样式的任何 Slider 对象都将使用这些值。您可以为特定对象覆盖这些值。

  有关详细信息，请参阅创建样式。

Slider 控件的外观随其状态的变化而变化。通过在“状态”面板中选择状态，您可以在模板编辑模式下修改每种状态所对应的外观。

有关详细信息，请参阅下表中列出的状态，并参阅定义控件的不同视觉状态。

Slider 模板的部件

Slider 控件仅使用一种模板，即，“Slider 模板”。该模板的各个部件将对应用了该模板的 Slider 对象的外观和行为产生影响。

模板中可存在其他对象，以修饰 Slider 控件的外观，但下表中列出的部件与约定的部件行为相关。

若要查看模板的部件，请在修改模板的同时打开“部件”面板。

部件名称	对象类型	描述
HorizontalTemplate  VerticalTemplate	FrameworkElement	一个包含对象的版式面板，其中的对象定义 Slider 控件沿水平（或垂直）方向放置时的外观。 此部件是必需的。
HorizontalTrackLargeChangeDecreaseRepeatButton  VerticalTrackLargeChangeDecreaseRepeatButton	RepeatButton	一个对象，单击该对象时，ScrollBar 的 Value 属性值将减小。Value 属性值按 LargeChange 属性中的值递减。
HorizontalThumb  VerticalThumb	Thumb	一个对象，其在轨道上的位置表示 Slider 控件的当前值。 此部件是必需的。
HorizontalTrackLargeChangeIncreaseRepeatButton  VerticalTrackLargeChangeIncreaseRepeatButton	RepeatButton	一个对象，单击该对象时，ScrollBar 的 Value 属性值将减小。Value 属性值按 LargeChange 属性中的值递增。

Slider 控件的状态

默认情况下，Slider 控件所处的状态可以为“CommonStates”状态组中的以下三种状态之一，在修改 Slider 模板时，您可以在“状态”面板中查看这些状态：

状态名称	描述
Normal	Slider 控件没有交互时的外观。
MouseOver	用户将指针移到 Slider 控件上时该控件的外观。
Disabled	当“IsEnabled”属性设置为“False”时 Slider 控件的外观。

Slider 控件所处的状态可以为“FocusStates”状态组中的以下两种状态之一：

状态名称	描述
Unfocused	Slider 控件没有键盘焦点时的外观。
Focused	Slider 控件具有键盘焦点时的外观。例如，用户可能会按 Tab 键循环显示应用程序中的对象，直到键盘焦点对准 Slider 控件为止。

提示：
状态组包含属于同一逻辑类别并且无法同时显示的可视状态。例如，“CommonStates”组包含的状态和用户与输入设备（例如鼠标）的交互相关。一次只能显示状态组中的一种状态，但一个组中的状态可与另一个状态组中的状态同时显示。

当您选择状态时，状态记录功能将启用，并且将为该状态记录您进行的任何更改。若要禁用状态记录功能，请单击记录按钮 ，或者在“状态”面板中选择“Base”。若要在两个独立状态处于活动状态时修改控件的外观，您可以固定一个状态组中状态的预览，同时修改另一个状态组中的状态。

将对象转换为 Slider 控件

若要修改 Slider 控件的模板，请执行下列操作之一：

• 在美工板上绘制“Slider”，然后创建默认模板的副本。

  有关详细信息，请参阅创建或修改模板。

• 通过绘制对象或导入作品来设计 Slider 控件的外观，然后使用“构成控件”命令。

如果使用“构成控件”命令，请按以下步骤进行操作，以确保创建 Slider 模板需要的所有对象：

1. 将希望用于定义 Slider 控件的外观的所有对象组合到“网格”版式面板中。

2. 选择新的 Grid 对象，然后在“工具”菜单上，单击“构成控件”。

3. 在出现的对话框中，选择“Slider”，为模板命名，然后选择模板的存储位置。

   有关位置的信息，请参阅创建资源。

4. 单击“确定”之后，Microsoft Expression Blend 将进入模板编辑模式，并显示组成垂直 Slider 控件的对象。

5. Slider 控件的模板包括在 Slider 对象沿水平或垂直方向放置时使用的部件。您可以向模板中的对象分配“部件”面板中的所有部件，也可以只分配与 Slider 控件的某个方向相关的部件。如果只有一组对象，但希望为 Slider 控件的两个方向都设计模板，则可以复制对象，并重新排列复制的一组对象。

   提示：
   如果只向模板中的对象分配“部件”面板中的垂直部件，那么，当（应用了该模板的）Slider 对象设置为水平显示时，则对象将从美工板中消失。若要更改 Slider 对象的方向，请单击美工板顶部的痕迹导航栏中的“[Slider]”以返回到 Slider 对象的编辑范围，将“Orientation”属性设置为“Vertical”，然后使用痕迹导航栏上的第三个按钮返回到模板编辑模式。

6. 若要为 HorizontalTemplate（或 VerticalTemplate）部件创建对象，请执行下列操作：

   1. 绘制包含三列（或三行）的“网格” 版式面板。这三列的大小调整设置应分别为“自动”、“自动”和经比例缩放的（“*”）。

      有关详细信息，请参阅添加或删除行或列和更改行或列的调整大小选项。

   2. 右键单击新的 Grid 对象，指向“构成 Slider 的部件”，然后单击“HorizontalTemplate”（或“VerticalTemplate”）。

7. Thumb 对象在其中移动的空间称为轨道。轨道不是模板部件，因此是可选的。将要用于表示轨道的任意一个或多个对象放入 HorizontalTemplate（或 VerticalTemplate）对象，跨越全部三列（或行）。

   提示：
   若要使对象跨越多个列（或行），请选择该对象，然后在“属性”面板中，设置“RowSpan”（或“ColumnSpan”）属性。

8. 由于 Thumb 对象可以有自己的模板，因此应通过执行下列操作，将您希望使用的对象转换为 Thumb 控件：

   1. 将表示 Thumb 对象的对象组合到版式面板中。

   2. 将新的版式面板移到“HorizontalTemplate”（或“VerticalTemplate”）对象的中间列（或行）中。

      提示：
      若要将对象放入特定的列（或行），请选择该对象，然后在“属性”面板中，设置“Column”（或“Row”）属性。第一列（或行）的编号为 0。

   3. 右键单击新的版式面板，指向“构成 Slider 的部件”，然后单击“HorizontalThumb”（或“VerticalThumb”）。

   4. 在“构成部件”对话框中，选择模板的存储位置。

   5. 当新的 Thumb 对象处于模板编辑模式时，您可以继续进行修改，例如，在“状态”面板中选择状态以修改这些状态下 Thumb 对象的外观。如果希望 Thumb 对象中有边距，请在根对象上设置“Margin”属性。

   6. 通过以下方法返回到 Slider 对象的模板编辑模式：在“对象和时间线”面板中单击“范围上移”，或者在美工板顶部的痕迹导航栏中单击“VerticalThumb”（或“HorizontalThumb”）。

   7. 将新 Thumb 对象的“Width”和“Height”属性设置为特定值，以便中间列（或行）将自动重设大小以适应 Thumb 对象。

9. 如果希望用户能够单击轨道任意一端的按钮按较小的增量移动 Thumb 对象，请执行下列操作：

   1. 将希望用作递减按钮的对象组合到版式面板中。

   2. 将新的版式面板移到“HorizontalTemplate”对象的第一列（或“VerticalTemplate”对象的第一行）中。

   3. 右键单击新的版式面板，指向“构成 Slider 的部件”，然后单击“HorizontalTrackLargeChangeDecreaseRepeatButton”（或“VerticalTrackLargeChangeDecreaseRepeatButton”）。

   4. 在“构成部件”对话框中，选择模板的存储位置。

   5. 当新的 RepeatButton 对象处于模板编辑模式时，您可以继续进行修改，如删除“ContentPresenter”对象。如果要在 RepeatButton 对象中设置边距，请设置根对象的“Margin”属性。

   6. 通过以下方法返回到 Slider 对象的模板编辑模式：在“对象和时间线”面板中单击“范围上移”，或者在美工板顶部的痕迹导航栏中单击“HorizontalTrackLargeChangeDecreaseRepeatButton”（或“VerticalTrackLargeChangeDecreaseRepeatButton”）。

   7. 在“属性”面板中的“布局”下面调整属性，以使 RepeatButton 对象出现在所需的位置。如果您的对象隐藏在其他对象后面，则可能还需要对您的对象重新排序。

      有关详细信息，请参阅更改对象的分层顺序。

   8. 为“HorizontalTrackLargeChangeIncreaseRepeatButton”（或“VerticalTrackLargeChangeIncreaseRepeatButton”）对象重复以上步骤，将对象移到“HorizontalTemplate”对象的最后一列（或“VerticalTemplate”对象的最后一行）中。

10. 可以在此模式下继续修改模板。例如，添加或修改对象，或者在“状态”面板中选择一种状态以修改该状态下模板的外观。

11. 考虑将模板中对象的某些画笔属性绑定到将最终使用模板的 Slider 对象的以下属性：

    • Background

    • BorderBrush

    • Foreground

    • BorderThickness

    有关详细信息，请参阅在模板中使用对象属性。

12. 若要退出模板编辑模式，请在美工板顶部的痕迹导航栏中单击“[Slider]”，或者在“对象和时间线”面板中单击“范围上移”。

    有关向其他 ScrollBar 对象应用新的 ScrollBar 模板的信息，请参阅应用或删除资源。

引用

您可以在 MSDN 上的 Silverlight Control Gallery（Silverlight 控件库）中找到关于 Microsoft Silverlight Button 控件的属性和事件的详细信息。

另请参见

任务

将对象绑定到用户输入或其他内部值

概念

常用 Silverlight 控件的样式提示

SimpleSlider

设置支持模板的控件的样式