SimpleSlider (soporte WPF en Blend)

El control deslizante es un control simple que, al mover un control Thumb, permite a un usuario seleccionar entre una variedad de valores. De forma predeterminada, el control deslizante se muestra en horizontal, pero puede cambiarlo a vertical con la propiedad Orientation de Propiedades comunes en el panel Propiedades de Blend para Visual Studio. Para establecer el valor de un control deslizante, use las propiedades Minimum, Maximum y Value.

Vista de la mesa de trabajo de un control SimpleSlider

Desglosar la plantilla de control

La plantilla del control SimpleSlider está formada por los siguientes elementos:

• Un panel de cuadrícula denominado GridRoot, que se usa para que el control deslizante contenga varios objetos secundarios. El panel Grid también se usa porque facilita al diseñador de la interfaz de usuario de la aplicación (UI) la incorporación de más objetos a la plantilla. El panel GridRoot se divide en tres filas: la fila superior contiene el objeto TopTick, la fila central contiene el objeto Thumb y la fila inferior contiene el objeto BottomTick.

• Dos elementos TickBar denominados TopTick y BottomTick, que se usan para mostrar marcas de graduación en el control deslizante. De manera predeterminada, la propiedad Visibility está establecida en Collapsed. Los elementos TickBar determinan el número de marcas de graduación que se mostrará en función de las propiedades establecidas en el control deslizante al que se aplica esta plantilla. Los elementos TickBar no proporcionan ninguna plantilla modificable, pero puede establecer el pincel que usan para mostrar la marca de graduación mediante la propiedad Foreground en el control deslizante (TickBar está enlazado mediante plantilla a la propiedad Foreground del control deslizante).

• Un elemento Border, que se usa porque incluye una propiedad BorderThickness que se puede enlazar mediante plantilla con la propiedad BorderThickness del control de botón al que se aplica esta plantilla.

• Un elemento Track denominado PART_Track, que se usa para mostrar un elemento Thumb a lo largo de una barra. El usuario puede arrastrar el elemento Thumb. De forma predeterminada, el elemento Thumb usa la plantilla SimpleThumbStyle, que se puede modificar.

• Dos elementos RepeatButton, que están incluidos en el elemento PART_Track y permiten al usuario hacer clic en cualquier lado del control para hacer cambios importantes en el valor del control deslizante. Puede especificar el valor para estos cambios en la propiedad LargeChange del control deslizante (no en la plantilla). El valor que se especifica mediante la propiedad SmallChange se usa cuando el usuario mueve el control con las teclas de dirección.

• Una transformación de diseño, que se usa para mostrar el control deslizante con una orientación horizontal. Este diseño facilita la edición, para que no necesite acordarse de modificar dos plantillas distintas. No obstante, existen casos en los que las dos orientaciones deben ser suficientemente distintas y requieren plantillas independientes. En este caso, puede usar un objeto Setter en el elemento START de la vista XAML de Blend para cambiar las plantillas en función de la orientación. Puede ver un ejemplo de ello en la plantilla predeterminada del control del sistema Slider.

  Precaución
  No cambie el nombre de ningún elemento cuyo nombre empiece por "PART_", porque el código que implementa el control hace referencia a estos elementos.

Desencadenadores de propiedad usados

Los desencadenadores de propiedad de la plantilla de control sirven para hacer que el control reaccione ante los cambios de propiedad. Puede hacer clic en los elementos en el panel Desencadenadores para ver las propiedades que cambian cuando se activa un desencadenador. Por ejemplo, en la plantilla SimpleSlider, los desencadenadores se usan para hacer que los elementos TickBar aparezcan en función de la propiedad TickPlacement. Esto establece la visibilidad de los elementos TopTick y BottomTick. La orientación vertical y horizontal también se configuran en los desencadenadores de la plantilla SimpleSlider. Esto aplica una transformación de diseño al control deslizante, que gira 90 grados. Puesto que Track se orienta automáticamente, se fuerza hacia atrás para que no se gire dos veces.

Pinceles usados

Los siguientes recursos de pincel del diccionario de recursos SimpleStyles.xaml se utilizan en la plantilla SimpleSlider:

• La propiedad Background se establece mediante LightBrush cuando no hay ningún desencadenador activo, y mediante DisabledBackgroundBrush cuando IsEnabled es False.

• La propiedad BorderBrush se establece mediante NormalBorderBrush cuando no hay ningún desencadenador activo, y mediante DisabledBorderBrush cuando IsEnabled es False.

• La propiedad Foreground del elemento TopTick se establece mediante GlyphBrush.

• La propiedad Fill de la plantilla SimpleThumb se establece mediante NormalBrush, y la propiedad Stroke se establece mediante NormalBorderBrush.

Procedimientos recomendados e instrucciones de diseño

• En general, debe usar un control Grid como raíz de la plantilla si espera que el diseñador agregue más elementos visuales al control. Blend busca un panel de diseño como el control Grid y lo activa de forma predeterminada para que los objetos nuevos de la mesa de trabajo se agreguen como objetos secundarios del panel de diseño.

• Si lo desea, puede agregar desencadenadores a la plantilla SimpleSlider o modificar el elemento PART_Track para hacer que la apariencia del control deslizante sea más interesante, pero no puede cambiar el nombre de ningún elemento cuyo nombre empiece por "PART_", ya que el código que implementa el control hace referencia a estos elementos. Es necesario colocar Thumb y los botones de repetición en los elementos correctos dentro de Track. El control track sabe cómo colocar el elemento Thumb en función del valor de Slider. Los botones de repetición usan enlaces de Command para hacer que el valor del control deslizante aumente o disminuya.

• Al modificar la plantilla de SimpleSlider, puede hacer que los elementos TickBar aparezcan si usa el panel Desencadenadores para seleccionar el desencadenador adecuado. Por ejemplo, en la plantilla SimpleSlider, cuando TickPlacement está establecido en Both, los dos elementos TickBar se muestran estableciendo su propiedad Visibility en Visible.

Vea también

Tareas

Inténtelo: Personalizar el elemento Thumb de un control SimpleSlider (soporte WPF en Blend)