Animación (DirectComposition)

  • Artículo

Nota:

En el caso de las aplicaciones en Windows 10, se recomienda usar las API de Windows.UI.Composition en lugar de DirectComposition. Para obtener más información, consulta Modernize your desktop app using the Visual layer (Modernización de la aplicación de escritorio mediante la capa visual).

En este tema se describen los conceptos básicos de la animación de Microsoft DirectComposition. Incluye los temas siguientes:

¿Qué es una animación?

La animación es una ilusión óptica creada al realizar rápidamente cambios incrementales en un objeto visual durante un período de tiempo mientras se vuelve a dibujar el objeto visual después de realizar cada cambio. Dado que los redraws se producen rápidamente, el cerebro percibe los cambios incrementales como una sola escena cambiante, igual que en una película o vídeo de acción en directo.

En la tabla siguiente se describen algunas de las formas típicas de usar la animación.

Animación Descripción
Desplazarse Usa la animación para agregar características como el impulso de emulación física a un control de lista de desplazamiento.
Transiciones de escena Use la animación para crear transiciones de escena de navegación que proporcionan continuidad entre las tareas de un flujo de trabajo. Las transiciones de la escena de navegación proporcionan contexto que muestra al usuario dónde han estado, dónde están y dónde deben ir a continuación.
Interacciones entre ventanas Anima elementos de interfaz de usuario de diferentes aplicaciones de una manera que proporciona la percepción de una continuidad perfecta entre ellos para ayudar al usuario a completar las tareas que implican cambiar de una aplicación a otra.

 

Propiedades que se pueden animar

En DirectComposition, se anima un objeto visual aplicando animación a propiedades individuales de los objetos que definen el objeto visual. Por ejemplo, si desea mover un objeto visual horizontalmente a través de la pantalla, aplicaría la animación a la propiedad OffsetX del objeto visual. Del mismo modo, si desea realizar una rotación 2D animada simple de un objeto visual, aplicaría animación a la propiedad Angle de un objeto de transformación 2D y, a continuación, aplicaría el objeto de transformación 2D a la propiedad Transform del objeto visual.

DirectComposition permite aplicar la animación a cualquier propiedad de objeto que tome un valor escalar. Puede aplicar animaciones simultáneas a varias propiedades y varios objetos.

DirectComposition ejecuta animaciones en un subproceso independiente. Puede iniciar una animación o un conjunto de animaciones y, a continuación, realizar otro trabajo en los subprocesos de la aplicación, o incluso poner subprocesos en suspensión, mientras que el motor de composición ejecuta las animaciones a la velocidad de fotogramas adecuada.

Funciones de animación

DirectComposition anima una propiedad de objeto basada en una función de animación que defina. Una función de animación es una construcción que especifica cómo cambia el valor de una propiedad de objeto durante un período de tiempo. Por ejemplo, podría definir una función de animación que cambie el valor de una propiedad de 1 a 360 durante el transcurso de 4 segundos. A continuación, si aplica la función de animación a la propiedad Angle de un objeto de transformación de rotación 2D y, a continuación, aplica el objeto de transformación a la propiedad Transform de un objeto visual, la función de animación giraría el objeto visual en un círculo completo durante 4 segundos.

Una función de animación se representa mediante un objeto de animación creado por una llamada al método IDCompositionDevice::CreateAnimation . Se crea una función de animación mediante los métodos de la interfaz IDCompositionAnimation de un objeto de animación para anexar segmentos de animación, de uno en uno, a la matriz que define la función de animación. Al anexar un segmento, se especifica un desplazamiento basado en cero que marca la hora de inicio del segmento, en relación con el principio de la función de animación. Los segmentos de animación deben anexarse en orden creciente de horas de inicio. Se producirá un error al intentar anexar un segmento de animación cuya hora de inicio sea anterior o igual a un segmento anterior. Una función de animación puede tener una hora de finalización especificada, lo que indica cuándo debe concluirse la función.

A menos que se especifique lo contrario, una función de animación se inicia cuando el Administrador de ventanas de escritorio (DWM) recibe el comando para ejecutar la animación. Cada segmento se ejecuta hasta que se alcanza la hora de inicio del siguiente segmento. Los cambios discontinuos que se producen en el valor de la propiedad animada entre segmentos se consideran cambios discretos.

Para aplicar una función de animación a una propiedad, establezca el valor de propiedad en el puntero IDCompositionAnimation del objeto de animación que representa la función de animación. El mismo objeto de animación se puede aplicar a varias propiedades del mismo objeto, así como a las propiedades de otros objetos creados por el mismo dispositivo.

Segmentos de animación

Los segmentos de animación son las definiciones de tiempo fundamentales de una función de animación; son los primitivos a partir de los cuales se crean funciones de animación de nivel más complejas y superiores. Un segmento de animación se construye a partir de una serie de parámetros que describen la función y la hora en que comienza el segmento, en relación con el principio de la función de animación. Para cada segmento, el tiempo (t) progresa a lo largo del eje horizontal y comienza en t = 0.

Segmento cúbico

El tiempo de un segmento cúbico se define mediante un polinomio cúbico. Para una entrada de tiempo determinada (t), la ecuación siguiente proporciona el valor de salida:

x(t) = at³ + bt² + ct + d

En el diagrama siguiente se muestra una función de animación que contiene dos segmentos cúbicos. El primer segmento realiza una transición de un valor de 0 a 16 más de 4 segundos y el segundo cambia el valor linealmente de 16 a 0 en los próximos 4 segundos. La primera transición se produce a lo largo de este polinomio cúbico:

x(t) = t³ - 6t² + 12t

y la segunda transición se produce a lo largo de esta:

x(t) = - 4t + 16

diagrama de una función de animación con dos segmentos cúbicos

Agregue un segmento cúbico a una función de animación mediante el método IDCompositionAnimation::AddCubic .

Segmento sinusoidal

El tiempo de un segmento sinusoidal se define mediante la siguiente ecuación:

x(t) = Amplitud de sesgo + * sin(t*Frequency*2*PI + Phase*PI/180.0)

Agregue un segmento sinusoidal a una función de animación mediante el método IDCompositionAnimation::AddSinusoidal .

Repetir segmento

Un segmento de repetición repite una parte anterior especificada de una función de animación. Un segmento de repetición hace que la parte especificada de la función de animación se repita indefinidamente hasta que se encuentre el siguiente segmento o se alcance el final especificado de la animación. La parte anterior de una animación se compone de otros segmentos, incluidos otros segmentos de repetición. No se puede usar un segmento de repetición como primer segmento de una función de animación.

En el diagrama siguiente se muestra una función de animación que consta de dos segmentos cúbicos de 4 segundos de duración cada uno, seguido de un segmento repetido que dura 12 segundos. El segmento de repetición comienza 8 segundos en la animación y repite los 6 segundos anteriores de la animación dos veces hasta que se alcanza el segmento final en 20 segundos.

diagrama de una función de animación que contiene dos segmentos cúbicos y un segmento de repetición

Para agregar un segmento de repetición a una función de animación, use el método IDCompositionAnimation::AddRepeat .

Segmento final

Después de construir una función de animación a partir de segmentos, puede anexar un segmento final para que la función de animación finalice en un momento determinado. Si no anexa un segmento final, el segmento final de la función de animación se ejecuta indefinidamente.

Para anexar un segmento final, llame al método IDCompositionAnimation::End , especificando un desplazamiento desde el principio de la función de animación que indica el punto final de la función. El desplazamiento debe ser mayor que el desplazamiento inicial del segmento anterior. Además, no se puede usar un segmento final como primer primitivo en una función de animación.

Al llamar a End, también se especifica un valor final para la propiedad que se va a animar. La propiedad se establece en el valor final especificado en el momento en que se alcanza el punto final de la función de animación.

Después de anexar un segmento final, no puede anexar ningún otro segmento a la función de animación. Es decir, todas las llamadas de método en el objeto de animación producen un error excepto IDCompositionAnimation::Reset. La llamada a Reset devuelve el objeto de animación para limpiar el estado en el que la función de animación no contiene ningún segmento, momento en el que puede agregar segmentos de nuevo.

Compatibilidad con el Administrador de animaciones de Windows

El Administrador de animaciones de Windows (Animación de Windows) genera primitivos de animación en un formato compatible con la API DirectComposition. Esto significa que DirectComposition puede crear animaciones basadas en primitivos de animación creados por La animación de Windows.

Para obtener más información, vea Administrador de animaciones de Windows, el método IUIAnimationVariable2::GetCurve y Administrar la animación DirectComposition con el Administrador de animaciones de Windows v2.

Conceptos de DirectComposition