Share via

Créer des variables d’animation

  • Article

Une application doit créer une variable d’animation pour chaque caractéristique visuelle qui doit être animée à l’aide de l’animation Windows.

Vue d’ensemble

Les variables d’animation sont créées à l’aide du gestionnaire d’animations, et l’application doit conserver une référence à chacune d’elles aussi longtemps que nécessaire. Votre application crée généralement chaque variable d’animation en même temps que l’objet visuel qu’elle anime.

Lorsqu’une variable d’animation est créée, sa valeur initiale doit être spécifiée. Par la suite, sa valeur ne peut être modifiée qu’en planifiant des storyboards qui l’animent.

Les variables d’animation étant passées en tant que paramètres lors de la construction de storyboards, l’application ne doit pas les libérer tant que les caractéristiques visuelles qu’elles représentent n’ont plus besoin d’être animées, généralement lorsque les objets visuels associés sont sur le point d’être détruits.

Exemple de code

Animation des couleurs

L’exemple de code suivant est tiré de MainWindow.cpp dans les exemples d’animation Windows d’animation pilotée par l’application et d’animationpilotée par le minuteur. Dans l’exemple, trois variables d’animation sont créées à l’aide de CreateAnimationVariable pour représenter les couleurs d’arrière-plan. Le code utilise également les méthodes SetLowerBound et SetUpperBound pour contrôler la valeur de la variable d’animation.

const DOUBLE INITIAL_RED = COLOR_MAX;
const DOUBLE INITIAL_GREEN = COLOR_MAX;
const DOUBLE INITIAL_BLUE = COLOR_MAX;

HRESULT hr = m_pAnimationManager->CreateAnimationVariable(
    INITIAL_RED,
    &m_pAnimationVariableRed
    );
if (SUCCEEDED(hr))
{
    hr = m_pAnimationVariableRed->SetLowerBound(COLOR_MIN);
    if (SUCCEEDED(hr))
    {
        hr = m_pAnimationVariableRed->SetUpperBound(COLOR_MAX);
        if (SUCCEEDED(hr))
        {
            hr = m_pAnimationManager->CreateAnimationVariable(
                INITIAL_GREEN,
                &m_pAnimationVariableGreen
                );
            if (SUCCEEDED(hr))
            {
                hr = m_pAnimationVariableGreen->SetLowerBound(COLOR_MIN);
                if (SUCCEEDED(hr))
                {
                    hr = m_pAnimationVariableGreen->SetUpperBound(COLOR_MAX);
                    if (SUCCEEDED(hr))
                    {
                        hr = m_pAnimationManager->CreateAnimationVariable(
                            INITIAL_BLUE,
                            &m_pAnimationVariableBlue
                            );
                        if (SUCCEEDED(hr))
                        {
                            hr = m_pAnimationVariableBlue->SetLowerBound(COLOR_MIN);
                            if (SUCCEEDED(hr))
                            {
                                hr = m_pAnimationVariableBlue->SetUpperBound(COLOR_MAX);
                            }
                        }
                    }
                }
            }
        }
    }
}

Notez les définitions suivantes de MainWindow.h.

class CMainWindow
{

    ...

private:

    // Animated Variables

    IUIAnimationVariable *m_pAnimationVariableRed;
    IUIAnimationVariable *m_pAnimationVariableGreen;
    IUIAnimationVariable *m_pAnimationVariableBlue;

    ...

};

Animation des coordonnées x et y

L’exemple de code suivant est extrait de Thumbnail.cpp dans l’exemple de disposition de grille d’animation Windows ; consultez la méthode CMainWindow::CreateAnimationVariables. Deux variables d’animation sont créées pour représenter les coordonnées X et Y de chaque objet.

// Create the animation variables for the x and y coordinates

hr = m_pAnimationManager->CreateAnimationVariable(
    xInitial,
    &m_pAnimationVariableX
    );

if (SUCCEEDED(hr))
{
    hr = m_pAnimationManager->CreateAnimationVariable(
        yInitial,
        &m_pAnimationVariableY
        );

    ...

}

Notez les définitions suivantes de Thumbnail.h.

class CThumbnail
{
public:

    ...

    // X and Y Animation Variables

    IUIAnimationVariable *m_pAnimationVariableX;
    IUIAnimationVariable *m_pAnimationVariableY;

    ...

};

Les variables d’animation sont des nombres à virgule flottante, mais leurs valeurs peuvent également être extraites sous forme d’entiers. Par défaut, chaque valeur est arrondie à l’entier le plus proche, mais il est possible de remplacer le mode d’arrondi utilisé pour une variable. L’exemple de code suivant utilise la méthode SetRoundingMode pour spécifier que les valeurs doivent toujours être arrondies vers le bas.

hr = m_pAnimationVariableX->SetRoundingMode(
    UI_ANIMATION_ROUNDING_MODE_FLOOR
    );
if (SUCCEEDED(hr))
{
    hr = m_pAnimationVariableY->SetRoundingMode(
        UI_ANIMATION_ROUNDING_MODE_FLOOR
        );

    ...

}

Étape précédente

Avant de commencer cette étape, vous devez avoir effectué cette étape : Créer les objets d’animation principaux.

étape suivante

Une fois cette étape terminée, l’étape suivante est : Mettre à jour le gestionnaire d’animations et dessiner les images.

IUIAnimationManager::CreateAnimationVariable

IUIAnimationVariable::SetLowerBound

IUIAnimationVariable::SetRoundingMode

IUIAnimationVariable::SetUpperBound

Vue d’ensemble de l’animation Windows