Compartir a través de


Inténtelo: Crear un botón de sustitución (soporte WPF en Blend)

JJ170580.bf9c77b1-ba7a-4f3b-8380-d05728d208d1(es-es,VS.120).png

Se puede crear un efecto de sustitución en una plantilla de botón si se cambia la apariencia del botón en función de la interacción del usuario. Como alternativa a desencadenar una escala de tiempo de animación o desencadenar cambios en la propiedad para generar un efecto de sustitución, puede usar el siguiente procedimiento para crear varios paneles Grid para representar cada estado del botón y, a continuación, alternar las propiedades Visibility de cada panel Grid.

Para crear un efecto de sustitución en un botón

  1. Dibuje un objeto SimpleButton en la mesa de trabajo.

    Sugerencia

    Los controles de estilo simple están disponibles en Estilos simples, en la categoría Estilos del panel Activos JJ170580.0d8b8d29-1af9-418f-8741-be3097d76eab(es-es,VS.120).png.Una vez seleccionado un control de estilo simple de la lista, puede dibujarlo en la mesa de trabajo.

  2. Haga clic con el botón secundario en el objeto Button en el panel Objetos y escala de tiempo, elija Editar plantilla y, a continuación, haga clic en Editar actual. Si no desea modificar el diccionario de recursos SimpleStyles.xaml, puede hacer clic en Editar una copia en lugar de en Editar actual para crear una plantilla nueva y guardarla en el documento.

    Para obtener más información acerca de cómo crear una copia, vea Crear o modificar una plantilla en Blend.

    Sugerencia

    Para salir del modo de edición de plantillas y volver al ámbito del documento, haga clic en Devolver ámbito a JJ170580.55844eb3-ed98-4f20-aa66-a6f5b23eeb2b(es-es,VS.120).png, que está encima del árbol de objetos en el panel Objetos y escala de tiempo.

    Para volver al modo de edición de plantilla para una plantilla existente, en el panel Objetos y escala de tiempo, haga clic con el botón secundario en el objeto cuya plantilla desee editar, elija Editar plantilla y, a continuación, haga clic en Editar actual.

  3. En el ámbito de edición de la plantilla de control, elimine el objeto secundario Border del objeto Grid.

  4. Haga clic en el objeto Grid para activarlo y poder así agregar objetos secundarios.

  5. En la Barra de herramientas, agregue tres controles Grid JJ170580.a87ee957-7fbf-4135-a6ab-6de7e63160aa(es-es,VS.120).png al objeto Grid raíz de la plantilla. Para que los nuevos objetos Grid rellenen el objeto Grid primario, selecciónelos, elija Redimensionar automáticamente en el menú Objeto y, a continuación, haga clic en Fill.

  6. Haga clic con el botón secundario en el objeto ContentPresenter, elija Ordenar y, a continuación, haga clic en Traer al frente para colocar el objeto ContentPresenter en la capa situada delante de los nuevos objetos Grid.

  7. En el panel Objetos y escala de tiempo, cambie el nombre de los nuevos objetos de cuadrícula a "Default", "Pressed" y "MouseOver", respectivamente; para ello, haga clic con el botón secundario en cada objeto y, a continuación, haga clic en Cambiar nombre.

  8. Para configurar el comportamiento del desencadenador, es necesario hacer que un solo objeto de cuadrícula sea visible por desencadenador. Por ejemplo, si se ha seleccionado Default en el panel Desencadenadores, haga clic en los objetos de cuadrícula Pressed y MouseOver mientras mantiene presionada la tecla Ctrl para seleccionar esos objetos. A continuación, en la categoría Apariencia del panel Propiedades, establezca la propiedad Visibility en Hidden.

  9. Haga clic en IsMouseOver = True en el panel Desencadenadores, seleccione los objetos de cuadrícula Pressed y Default y, a continuación, en Apariencia en el panel Propiedades, establezca la propiedad Visibility en Hidden. Seleccione el objeto de cuadrícula MouseOver y establezca la propiedad Visibility en Visible.

  10. Por último, con IsPressed = True seleccionado en Desencadenadores, seleccione los objetos de cuadrícula MouseOver y Default y, en Apariencia en el panel Propiedades, establezca la propiedad Visibility en Hidden. Seleccione el objeto de cuadrícula Pressed y establezca la propiedad Visibility en Visible.

  11. Ahora puede diseñar cada objeto de cuadrícula como desee que aparezca en diferentes situaciones seleccionadas en el panel Desencadenadores.

    Puede usar las herramientas de dibujo y las escalas de tiempo de animación para crear un comportamiento único para el botón.

    Para obtener más información, vea Drawing (objetos) de Blend y Animar objetos.

    Para diseñar uno de los objetos de cuadrícula sin que los otros estén visibles, puede hacer clic en el botón Ocultar/Mostrar JJ170580.3df73f86-a06e-4df8-b696-261c23fac3cc(es-es,VS.120).png, situado al lado de los demás objetos de cuadrícula en el panel Objetos y escala de tiempo.

  12. Pruebe la aplicación (F5) para ver los efectos.

Vea también

Conceptos

SimpleButton