Zoom animé avec WPF

loupe

L’animation du zoom (voir le précédent billet : Zoom de l’UI avec WPF ) se fait simplement en utilisant le mécanisme de minuteur et de synchronisation fourni par les classes WPF.

Dans le cas du zoom, il faut utiliser la classe d’animation de valeur DoubleAnimation Le code vu précédement qui applique la valeur de zoom sur le contrôle Grid :

Le code vu dans le billet précédent qui applique la valeur de zoom sur le contrôle Grid :

void SetZoom(
    double zoomFactor)
{
    GridScaleTransform.ScaleX = zoomFactor;
    GridScaleTransform.ScaleY = zoomFactor;
}

est modifié légèrement pour introduire un changement progressif de la valeur de zoom depuis la valeur actuelle jusqu’à la valeur souhaitée, s’appuyant sur les classes DoubleAnimation et la méthode Animate de WPF :

void SetZoom(
    // valeur de zoom souhaité entre 0 et 1 compris
    double zoomFactor)
{
    // durée de l'animation souhaitée en milli secondes (150)
    var duration =
        new Duration(TimeSpan.FromMilliseconds(150));
    var zfx = 
        new DoubleAnimation(
            GridScaleTransform.ScaleX,
            zoomFactor,
            duration);
    var zfy =
        new DoubleAnimation(
            GridScaleTransform.ScaleY,
            zoomFactor,
            duration);
    GridScaleTransform
        .BeginAnimation(
            ScaleTransform.ScaleXProperty,
            zfx);
    GridScaleTransform
         .BeginAnimation(
            ScaleTransform.ScaleYProperty,
            zfy);
}

Cette méthode pourra être liée à des événements de contrôles comme la sélection d’une liste déroulante, la saisie dans une boîte de texte ou le changement de valeur d’un slider …

Laisser un commentaire