Pequeño Laboratorio de Animaciones y Triggers en WPF

Por petición de Julio Trujillo Leon, este post son los pasos de la realización de un pequeño ejemplo para realizar un proyecto con una pequeña animación disparada con un Trigger y asi ver como se comporta la teoría vista en los post:Animaciones en WPF y Triggers en WPF.

 

 

1.  Crear un nuevo proyecto WPF 

a.  Utilizando Microsoft Expression Blend crear un proyecto WPF Application

(.exe) de nombre AnimacionSimple

Utilizar como lenguaje C# y como Target .Net Framework 3.5

b.  En el fichero Windows1.xaml modificar para que la ventana aparezca en

tamaño de 640 por 480 y el fonde totalmente negro.

Podrá modificar las propiedades en la ventana propiedades 

c.  Modificar el fondo para que sea totalmente negro. 

2.  Añadir un circulo y animarlo  

a.  Crear un circulo centrado en la pantalla de 140 por 120.

b.  Cambiar el fondo del circulo para usar un Gradient Brush donde crear

un degradado de blanco a rojo.

c.  En la ventana de Objects and Timeline crear un StoryBoard y un Timeline

d.  Una vez creado tanto el StoryBoard o el Timeline, se inicia la grabación. La

línea amarilla marcará el inicio de cada movimiento (en nuestro caso).

clip_image002

e.   Modificar la posición del circulo mediante las propiedades X e Y de

RenderTransform.

clip_image004

f.  Moviendo la línea amarilla y modificando la X e Y del circulo crear la

animación.

g.  Una vez creada la animación podremos ver el resultado previo de la

animación pulsando el botón play.

image

3.   Lanzar la animación del circulo en un evento

a.  En la ventana de Triggers seleccionar el evento que ya esta creado y

eliminarlo.

clip_image008

b.  En esta misma ventana, añadir un nuevo evento

Window.MouseDoubleClick que lanzará nuestra animación creada.

c.  Ejecutar el proyecto con el botón F5 para ver el resultado. 

 

Un comentario sobre “Pequeño Laboratorio de Animaciones y Triggers en WPF”

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *