Pasar fácilmente por los cambios de diseño

Artículo
10/11/2017

Las propiedades de diseño normalmente se establecen en valores discretos (como los números de filas o columnas) o en valores automáticos (como el ancho y el alto). Para crear una transición sencilla entre cambios para estos tipos de propiedades, use el diseño fluido. Por ejemplo, si un objeto aparece en la celda inferior izquierda de un panel de diseño de cuadrícula (Grid) en un estado, y aparece en la celda inferior derecha de dicho panel en otro estado, la transición entre esos dos estados dará lugar a un cambio instantáneo a menos que active el diseño fluido para el grupo de estados e incremente la duración de la transición.

[!NOTA]

El diseño fluido solo afecta a las propiedades de diseño.

Para pasar fácilmente por los cambios de diseño

Diseñe sus objetos en un documento abierto. Por ejemplo, es posible que tenga un objeto Grid con tres columnas y tres filas, con diferentes objetos en cuatro de las celdas.
En el panel Estados, defina diferentes estados visuales y cambie las propiedades de diseño de sus objetos en los estados. Por ejemplo, para cada uno de los objetos, defina un estado que mostrará el objeto en la esquina inferior derecha, extendiendo dos filas y columnas.

Para obtener información acerca de la creación de estados, vea Definir estados visuales y tiempos de transición diferentes en un control de usuario.
En el panel Estados, establezca el tiempo de transición predeterminada para el grupo de estados en 1 segundo.
Opcionalmente, haga clic en Función de entrada o salida lenta para seleccionar la función de entrada o salida lenta que se aplicará a la transición. Las funciones de entrada y salida lenta crean una animación más realista. Por ejemplo, la función de entrada o salida lenta de rebote crea un efecto de rebote.
Para habilitar el cambio entre estados, abra el panel Activos, seleccione la categoría Controles de comportamiento y arrastre el control de comportamiento GoToStateAction al objeto de la esquina inferior izquierda.
En el panel Propiedades, cambie la propiedad StateName del comportamiento GoToStateAction al nombre del estado que mueve el objeto de la esquina superior izquierda. Por ejemplo, cambie la propiedad StateName a Show1.

Para obtener más información acerca de los controles de comportamiento, vea Agregar controles de comportamiento a objetos.
Ahora que tiene una transición de estado que funciona, pruebe la aplicación; para ello, presione F5 y haga clic en el objeto de la esquina inferior izquierda de la cuadrícula. Se moverá instantáneamente a la esquina inferior derecha, aunque el tiempo de transición sea 1 segundo.
En el panel Estados, haga clic en Activar diseño fluido para el grupo de estados.
Vuelva a probar la aplicación. Para ello, presione F5 y haga clic en el objeto de la esquina inferior izquierda de la cuadrícula. Se moverá instantáneamente a la esquina inferior derecha en el transcurso de 1 segundo.