Modificar el tiempo de transición entre cambios de estado en controles del sistema

Los controles tienen un aspecto diferente según el estado en el que están. Por ejemplo, un botón cambia de color ligeramente cuando se le pasa por encima el puntero del mouse. "MouseOver" es uno de los estados de un botón. Puede personalizar el tiempo de transición entre estados de controles del sistema modificando una copia de la plantilla del control.

El siguiente procedimiento usa un botón, pero puede personalizar cualquier control del sistema que se incluya con Microsoft Expression Blend 2 o cualquier control de Silverlight 2 personalizado que haya importado que se herede de la clase Control.

Sugerencia:
También puede modificar los estados y el tiempo de transición de los controles de usuario. Para obtener más información, vea Definir estados visuales y tiempos de transición diferentes en un control de usuario.

Modificar el tiempo de transición entre estados

1. Crear una plantilla reutilizable para un control del sistema como el control Button .

2. Si no está en el modo de edición de una plantilla, haga clic con el botón secundario en un control de la mesa de trabajo, elija Editar partes del control (Plantilla) y haga clic en Editar plantilla. Otra opción es seleccionar el objeto y hacer clic en Plantilla en la barra de ruta de navegación.

   

3. En el modo de edición de plantilla, los estados del botón (como Normal y MouseOver) se muestran en Estados en el panel Interacción. Los estados están contenidos en grupos de estados (como CommonStates y FocusStates).

   

   Junto a CommonStates un cuadro de texto con el valor de 0 segundos ("0"). Esta es la duración de transición predeterminada para todas las transiciones entre los estados del grupo de estados. Por ejemplo, se tardan 0 segundos en pasar de cualquier estado al estado Normal. Puede cambiar esta duración de transición predeterminada.

   

   Este valor se invalida con el valor "0,1" cuando se pasa al estado MouseOver y al estado Pressed. El asterisco y la flecha indican "de cualquier estado a este".

   

4. Haga clic en el botón Agregar transición  para el estado MouseOver en Estados y después haga clic en la transición MouseOver a Normal.

   

5. En la nueva línea para la transición MouseOver a Normal, cambie el valor del cuadro de texto de "0" a "0,5".

   

6. Guarde el trabajo (CTRL+S) y presione F5 para generar y probar la aplicación. Una vez abierta la aplicación en una ventana del explorador, mueva el puntero del mouse sobre el botón para ver la lentitud con que vuelve a su estado anterior cuando se aleja el mouse del botón.

Solución de problemas

• Si encuentra problemas al ver la aplicación en un explorador, quizá no tiene instalado el motor en tiempo de ejecución correcto de Silverlight 2. Para obtener más información, vea Instalar el visor en tiempo de ejecución y las herramientas de Silverlight 2.

Pasos siguientes

• Puede cambiar la apariencia del botón en diferentes estados. Para obtener más información, vea Modificar la apariencia de un control del sistema en diferentes estados.

• Puede agregar animación, como hacer que un botón gire cuando se pasa sobre él el puntero del mouse. Para obtener más información, vea Agregar animación que se reproducirá después de cambiar un estado.

• Puede aplicar esta plantilla a otro botón del proyecto o dibujar un nuevo botón que ya tenga la plantilla asignada. Para obtener más información, vea Aplicar un recurso de estilo.

Vea también

Conceptos

Dibujar un control en un proyecto Silverlight 2

Agregar animación que se reproducirá después de cambiar un estado