Animar objetos en el Diseñador XAML

Blend para Visual Studio le permite crear fácilmente animaciones cortas para el movimiento y el fundido de objetos, por ejemplo.

Para crear una animación, necesita un guion gráfico. que puede contener una o más escalas de tiempo. Establezca fotogramas clave en una escala de tiempo para marcar los cambios de propiedad. Luego, al ejecutar la animación, Blend para Visual Studio interpola los cambios de propiedad durante el período de tiempo designado, lo que produce una transición fluida. Se puede animar cualquier propiedad que pertenezca a un objeto, incluso las propiedades no visuales.

En las imágenes siguientes se muestra un guion gráfico denominado Storyboard1. La escala de tiempo contiene fotogramas clave que marcan la posición X e Y de un rectángulo. Cuando se ejecuta esta animación, el rectángulo se mueve de una posición a otra de manera fluida.

Storyboard for animation in Blend for Visual Studio

Creación de una animación

  1. Para crear un guion gráfico, seleccione el botón Opciones de guion gráfico en la ventana Objetos y escala de tiempo y, luego, seleccione Nuevo.

    Add a storyboard in Blend for Visual Studio

  2. En el cuadro de diálogo Create Storyboard Resource (Crear recurso Guion gráfico), escriba un nombre para el guion gráfico.

  3. En el panel Recursos de la vista Diseño, agregue un rectángulo en la parte inferior izquierda de la página.

    Rectangle in Assets panel of XAML Designer

  4. En la ventana Objetos y escala de tiempo, mueva el puntero de hora amarillo a 3 segundos.

    Time indicator in timeline

  5. En la vista Diseño de la página, arrastre el rectángulo hasta el lado derecho de la página.

  6. Presione Reproducir para ver que el rectángulo se mueve de izquierda a derecha en la página.

Juegue con otros cambios en el rectángulo en distintos momentos. Por ejemplo, puede cambiar el color de relleno o voltear la orientación en la ventana Propiedades.