Partager via

Graphiques et animations Android

  • Article

Android fournit un framework très riche et diversifié pour prendre en charge les graphismes et animations 2D. Cette rubrique présente ces frameworks et explique comment créer des graphiques et des animations personnalisés à utiliser dans une application Xamarin.Android.

Vue d’ensemble

Malgré l’exécution sur les appareils qui sont traditionnellement d’une puissance limitée, les applications mobiles les plus performantes ont souvent une expérience utilisateur sophistiquée,complète avec des graphismes et des animations de haute qualité qui fournissent une sensation intuitive, réactive et dynamique. À mesure que les applications mobiles sont plus sophistiquées, les utilisateurs ont commencé à s’attendre à de plus en plus d’applications.

Heureusement pour nous, les plateformes mobiles modernes ont des infrastructures très puissantes pour créer des animations sophistiquées et des graphiques personnalisés tout en conservant la facilité d’utilisation. Cela permet aux développeurs d’ajouter une interactivité riche avec très peu d’efforts.

Les infrastructures d’API d’interface utilisateur dans Android peuvent être divisées en deux catégories : graphiques et animations.

Les graphiques sont divisés en différentes approches pour effectuer des graphiques 2D et 3D. Les graphiques 3D sont disponibles via un certain nombre d’infrastructures intégrées telles que OpenGL ES (une version mobile spécifique d’OpenGL) et des infrastructures tierces telles que MonoGame (un kit de ressources multiplateforme compatible avec le kit de ressources XNA). Bien que les graphismes 3D ne se trouvent pas dans la portée de cet article, nous examinerons les techniques de dessin 2D intégrées.

Android fournit deux API différentes pour créer des graphiques 2D. L’une est une approche déclarative de haut niveau et l’autre une API de bas niveau programmatique :

  • Ressources dessinables : elles sont utilisées pour créer des graphiques personnalisés par programmation ou (plus généralement) en incorporant des instructions de dessin dans des fichiers XML. Les ressources dessinables sont généralement définies en tant que fichiers XML qui contiennent des instructions ou des actions pour Android afin d’afficher un graphique 2D.

  • Canevas : il s’agit d’une API de bas niveau qui implique de dessiner directement sur une bitmap sous-jacente. Il fournit un contrôle très précis sur ce qui est affiché.

En plus de ces techniques graphiques 2D, Android fournit également plusieurs façons de créer des animations :

  • Animations dessinables : Android prend également en charge les animations frame par image appelées Animation dessinable. Il s’agit de l’API d’animation la plus simple. Android charge et affiche séquentiellement des ressources dessinables en séquence (comme un dessin animé).

  • Animations d’affichage : les animations d’affichage sont les API d’animation d’origine dans Android et sont disponibles dans toutes les versions d’Android. Cette API est limitée dans le fait qu’elle fonctionne uniquement avec les objets View et ne peut effectuer que des transformations simples sur ces vues. Les animations d’affichage sont généralement définies dans les fichiers XML trouvés dans le /Resources/anim dossier.

  • Animations de propriété : Android 3.0 a introduit un nouvel ensemble d’animations api appelées Animations de propriété. Ces nouvelles API ont introduit un système extensible et flexible qui peut être utilisé pour animer les propriétés d’un objet, et non pas seulement afficher des objets. Cette flexibilité permet aux animations d’être encapsulées dans des classes distinctes qui facilitent le partage de code.

Les animations d’affichage sont plus adaptées aux applications qui doivent prendre en charge les anciennes API pré-Android 3.0 (niveau d’API 11). Dans le cas contraire, les applications doivent utiliser les api d’animation de propriété les plus récentes pour les raisons mentionnées ci-dessus.

Toutes ces infrastructures sont des options viables, mais, dans la mesure du possible, la préférence doit être donnée aux animations de propriétés, car il s’agit d’une API plus flexible à utiliser. Les animations de propriété permettent d’encapsuler la logique d’animation dans des classes distinctes qui facilitent le partage de code et simplifient la maintenance du code.

Accessibilité

Les graphismes et les animations aident à rendre les applications Android attrayantes et amusantes à utiliser ; Toutefois, il est important de se rappeler que certaines interactions se produisent par le biais de lecteurs d’écran, d’appareils d’entrée alternatifs ou d’un zoom assisté. En outre, certaines interactions peuvent se produire sans fonctionnalités audio.

Les applications sont plus utilisables dans ces situations si elles ont été conçues avec l’accessibilité à l’esprit : fournir des conseils et une assistance de navigation dans l’interface utilisateur, et s’assurer qu’il existe du texte ou des descriptions pour les éléments pictorials de l’interface utilisateur.

Pour plus d’informations sur l’utilisation des API d’accessibilité d’Android, consultez le Guide d’accessibilité de Google.

Graphiques 2D

Les ressources dessinables sont une technique populaire dans les applications Android. Comme pour d’autres ressources, les ressources dessinables sont déclaratives : elles sont définies dans des fichiers XML. Cette approche permet une séparation propre du code des ressources. Cela peut simplifier le développement et la maintenance, car il n’est pas nécessaire de modifier le code pour mettre à jour ou modifier les graphiques dans une application Android. Toutefois, bien que les ressources dessinables soient utiles pour de nombreuses exigences graphiques simples et courantes, elles n’ont pas la puissance et le contrôle de l’API Canvas.

L’autre technique, à l’aide de l’objet Canvas , est très similaire à d’autres frameworks d’API traditionnels tels que System.Drawing ou le dessin principal d’iOS. L’utilisation de l’objet Canvas offre le plus de contrôle sur la façon dont les graphiques 2D sont créés. Il convient aux situations où une ressource dessinable ne fonctionnera pas ou sera difficile à utiliser. Par exemple, il peut être nécessaire de dessiner un contrôle de curseur personnalisé dont l’apparence change en fonction des calculs liés à la valeur du curseur.

Examinons d’abord les ressources dessinables. Ils sont plus simples et couvrent les cas de dessin personnalisés les plus courants.

Ressources dessinables

Les ressources dessinables sont définies dans un fichier XML dans le répertoire /Resources/drawable. Contrairement à l’incorporation de PNG ou JPEG, il n’est pas nécessaire de fournir des versions spécifiques à la densité des ressources dessinables. Au moment de l’exécution, une application Android charge ces ressources et utilise les instructions contenues dans ces fichiers XML pour créer des graphiques 2D. Android définit plusieurs types de ressources dessinables :

  • ShapeDrawable : il s’agit d’un objet Dessinable qui dessine une forme géométrique primitive et applique un ensemble limité d’effets graphiques sur cette forme. Ils sont très utiles pour des éléments tels que la personnalisation des boutons ou la définition de l’arrière-plan de TextViews. Nous allons voir un exemple d’utilisation ultérieure ShapeDrawable dans cet article.

  • StateListDrawable : il s’agit d’une ressource dessinable qui modifiera l’apparence en fonction de l’état d’un widget/contrôle. Par exemple, un bouton peut modifier son apparence selon qu’il est enfoncé ou non.

  • LayerDrawable : cette ressource dessinable qui empile plusieurs autres dessinables l’une sur l’autre. Un exemple de LayerDrawable est illustré dans la capture d’écran suivante :

    Exemple LayerDrawable

  • TransitionDrawable : il s’agit d’une coucheDrawable , mais avec une différence. Une TransitionDrawable est en mesure d’animer une couche s’affichant au-dessus d’une autre.

  • LevelListDrawable : ceci est très similaire à un StateListDrawable dans lequel il affichera une image basée sur certaines conditions. Toutefois, contrairement à un StateListDrawable, LevelListDrawable affiche une image basée sur une valeur entière. Un exemple de LevelListDrawable serait d’afficher la force d’un signal Wi-Fi. À mesure que la puissance du signal Wi-Fi change, le dessinable affiché change en conséquence.

  • ScaleDrawable/ClipDrawable : comme leur nom l’indique, ces dessinables fournissent à la fois des fonctionnalités de mise à l’échelle et de découpage. ScaleDrawable met à l’échelle un autre dessinable, tandis que le ClipDrawable découpe un autre dessinable.

  • InsetDrawable : ce dessinable applique des ensembles sur les côtés d’une autre ressource Dessinable. Elle est utilisée lorsqu’une vue a besoin d’un arrière-plan plus petit que les limites réelles de la vue.

  • BitmapDrawable XML : ce fichier est un ensemble d’instructions, en XML, qui doivent être effectuées sur une image bitmap réelle. Certaines actions qu’Android peut effectuer sont des mosaïdes, des trames et des anticrénelages. L’une des utilisations les plus courantes consiste à vignetter une bitmap en arrière-plan d’une disposition.

Exemple dessinable

Examinons un exemple rapide de création d’un graphique 2D à l’aide d’un ShapeDrawable. Un ShapeDrawable peut définir l’une des quatre formes de base : rectangle, ovale, trait et anneau. Il est également possible d’appliquer des effets de base, tels que le dégradé, la couleur et la taille. Le code XML suivant est un ShapeDrawable fichier qui se trouve dans le projet complémentaire AnimationsDemo (dans le fichier Resources/drawable/shape_rounded_blue_rect.xml). Il définit un rectangle avec un arrière-plan dégradé violet et des angles arrondis :

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<!-- Specify a gradient for the background -->
<gradient android:angle="45"
          android:startColor="#55000066"
          android:centerColor="#00000000"
          android:endColor="#00000000"
          android:centerX="0.75" />

<padding android:left="5dp"
          android:right="5dp"
          android:top="5dp"
          android:bottom="5dp" />

<corners android:topLeftRadius="10dp"
          android:topRightRadius="10dp"
          android:bottomLeftRadius="10dp"
          android:bottomRightRadius="10dp" />
</shape>

Nous pouvons référencer cette ressource dessinable de manière déclarative dans une disposition ou un autre dessinable, comme indiqué dans le code XML suivant :

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#33000000">
    <TextView android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_centerInParent="true"
              android:background="@drawable/shape_rounded_blue_rect"
              android:text="@string/message_shapedrawable" />
</RelativeLayout>

Les ressources dessinables peuvent également être appliquées par programme. L’extrait de code suivant montre comment définir par programmation l’arrière-plan d’un TextView :

TextView tv = FindViewById<TextView>(Resource.Id.shapeDrawableTextView);
tv.SetBackgroundResource(Resource.Drawable.shape_rounded_blue_rect);

Pour voir à quoi cela ressemblerait, exécutez le projet AnimationsDemo et sélectionnez l’élément Dessinable de forme dans le menu principal. Nous devrions voir quelque chose de similaire à la capture d’écran suivante :

Vue de texte avec un arrière-plan personnalisé, dessinable avec un dégradé et des angles arrondis

Pour plus d’informations sur les éléments XML et la syntaxe de Drawable Resources, consultez la documentation de Google.

Utilisation de l’API de dessin de canevas

Les tiroirs sont puissants, mais ont leurs limites. Certaines choses ne sont pas possibles ou très complexes (par exemple : application d’un filtre à une image prise par une caméra sur l’appareil). Il serait très difficile d’appliquer une réduction des yeux rouges à l’aide d’une ressource dessinable. Au lieu de cela, l’API Canvas permet à une application d’avoir un contrôle très précis pour modifier de manière sélective les couleurs dans une partie spécifique de l’image.

Une classe couramment utilisée avec canvas est la classe Paint . Cette classe contient des informations de couleur et de style sur la façon de dessiner. Il est utilisé pour fournir des choses telles une couleur et une transparence.

L’API Canvas utilise le modèle du peintre pour dessiner des graphiques 2D. Les opérations sont appliquées dans des couches successives au-dessus des autres. Chaque opération couvre une zone de la bitmap sous-jacente. Lorsque la zone chevauche une zone précédemment peinte, la nouvelle peinture masque partiellement ou complètement l’ancienne. Il s’agit de la même façon que de nombreuses autres API de dessin telles que System.Drawing et le travail graphique principal d’iOS.

Il existe deux façons d’obtenir un Canvas objet. La première façon consiste à définir un objet Bitmap , puis à instancier un Canvas objet avec celui-ci. Par exemple, l’extrait de code suivant crée un canevas avec une bitmap sous-jacente :

Bitmap bitmap = Bitmap.CreateBitmap(100, 100, Bitmap.Config.Argb8888);
Canvas canvas = new Canvas(b);

L’autre moyen d’obtenir un Canvas objet est la méthode de rappel OnDraw fournie à la classe de base View . Android appelle cette méthode lorsqu’elle décide qu’une vue doit se dessiner et passer dans un Canvas objet pour que l’affichage fonctionne.

La classe Canvas expose des méthodes pour fournir par programmation les instructions de dessin. Par exemple :

  • Canvas.DrawPaint : remplit la bitmap de la zone de dessin entière avec la peinture spécifiée.

  • Canvas.DrawPath : dessine la forme géométrique spécifiée à l’aide de la peinture spécifiée.

  • Canvas.DrawText : dessine le texte sur le canevas avec la couleur spécifiée. Le texte est dessiné à l’emplacement x,y .

Dessin avec l’API Canvas

Voici un exemple de l’API Canvas en action. L’extrait de code suivant montre comment dessiner une vue :

public class MyView : View
{
    protected override void OnDraw(Canvas canvas)
    {
        base.OnDraw(canvas);
        Paint green = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0x99, 0xcc, 0),
        };
        green.SetStyle(Paint.Style.FillAndStroke);

        Paint red = new Paint {
            AntiAlias = true,
            Color = Color.Rgb(0xff, 0x44, 0x44)
        };
        red.SetStyle(Paint.Style.FillAndStroke);

        float middle = canvas.Width * 0.25f;
        canvas.DrawPaint(red);
        canvas.DrawRect(0, 0, middle, canvas.Height, green);
    }
}

Ce code ci-dessus crée d’abord une peinture rouge et un objet de peinture verte. Il remplit le contenu du canevas en rouge, puis indique au canevas de dessiner un rectangle vert de 25 % de la largeur du canevas. Vous pouvez voir un exemple de ceci dans le AnimationsDemo projet inclus dans le code source de cet article. En démarrant l’application et en sélectionnant l’élément de dessin dans le menu principal, nous devrions afficher un écran similaire à ce qui suit :

Écran avec des objets de peinture rouge et vert

Animation

Les utilisateurs aiment les éléments qui se déplacent dans leurs applications. Les animations sont un excellent moyen d’améliorer l’expérience utilisateur d’une application et de l’aider à se démarquer. Les meilleures animations sont celles que les utilisateurs ne remarquent pas parce qu’ils se sentent naturels. Android fournit les trois API suivantes pour les animations :

  • Afficher l’animation : il s’agit de l’API d’origine. Ces animations sont liées à une vue spécifique et peuvent effectuer des transformations simples sur le contenu de la vue. En raison de sa simplicité, cette API est toujours utile pour des éléments tels que les animations alpha, les rotations, etc.

  • Animation de propriété : les animations de propriété ont été introduites dans Android 3.0. Ils permettent à une application d’animer presque tout. Les animations de propriété peuvent être utilisées pour modifier n’importe quelle propriété d’un objet, même si cet objet n’est pas visible à l’écran.

  • Animation dessinable : cette ressource dessinable spéciale utilisée pour appliquer un effet d’animation très simple aux dispositions.

En général, l’animation de propriété est le système préféré à utiliser, car il est plus flexible et offre plus de fonctionnalités.

Afficher les animations

Les animations d’affichage sont limitées aux vues et peuvent uniquement effectuer des animations sur des valeurs telles que les points de début et de fin, la taille, la rotation et la transparence. Ces types d’animations sont généralement appelés animations tween. Les animations d’affichage peuvent être définies de deux façons : par programmation dans le code ou à l’aide de fichiers XML. Les fichiers XML sont la méthode recommandée pour déclarer des animations d’affichage, car ils sont plus lisibles et plus faciles à gérer.

Les fichiers XML d’animation sont stockés dans le /Resources/anim répertoire d’un projet Xamarin.Android. Ce fichier doit avoir l’un des éléments suivants comme élément racine :

  • alpha – Animation fondue ou fondu en fondu.

  • rotate – Animation de rotation.

  • scale – Animation de redimensionnement.

  • translate – Mouvement horizontal et/ou vertical.

  • set : conteneur qui peut contenir un ou plusieurs des autres éléments d’animation.

Par défaut, toutes les animations d’un fichier XML sont appliquées simultanément. Pour que les animations se produisent de manière séquentielle, définissez l’attribut android:startOffset sur l’un des éléments définis ci-dessus.

Il est possible d’affecter le taux de modification dans une animation à l’aide d’un interpolateur. Un interpolateur permet aux effets d’animation d’être accélérés, répétés ou tolérés. L’infrastructure Android fournit plusieurs interpolateurs hors de la boîte de dialogue, tels que (mais pas limités à) :

  • AccelerateInterpolator / DecelerateInterpolator : ces interpolateurs augmentent ou diminuent le taux de modification dans une animation.

  • BounceInterpolator – le changement rebondit à la fin.

  • LinearInterpolator : le taux de modifications est constant.

Le code XML suivant illustre un exemple de fichier d’animation qui combine certains de ces éléments :

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android=http://schemas.android.com/apk/res/android
     android:shareInterpolator="false">

    <scale android:interpolator="@android:anim/accelerate_decelerate_interpolator"
           android:fromXScale="1.0"
           android:toXScale="1.4"
           android:fromYScale="1.0"
           android:toYScale="0.6"
           android:pivotX="50%"
           android:pivotY="50%"
           android:fillEnabled="true"
           android:fillAfter="false"
           android:duration="700" />

    <set android:interpolator="@android:anim/accelerate_interpolator">
        <scale android:fromXScale="1.4"
               android:toXScale="0.0"
               android:fromYScale="0.6"
               android:toYScale="0.0"
               android:pivotX="50%"
               android:pivotY="50%"
               android:fillEnabled="true"
               android:fillBefore="false"
               android:fillAfter="true"
               android:startOffset="700"
               android:duration="400" />

        <rotate android:fromDegrees="0"
                android:toDegrees="-45"
                android:toYScale="0.0"
                android:pivotX="50%"
                android:pivotY="50%"
                android:fillEnabled="true"
                android:fillBefore="false"
                android:fillAfter="true"
                android:startOffset="700"
                android:duration="400" />
    </set>
</set>

Cette animation effectue toutes les animations simultanément. La première animation de mise à l’échelle étire l’image horizontalement et la réduit verticalement, puis l’image sera pivotée simultanément de 45 degrés dans le sens inverse des aiguilles d’une montre et de la réduction, disparaissant de l’écran.

L’animation peut être appliquée par programmation à un affichage en gonflant l’animation, puis en l’appliquant à un affichage. Android fournit la classe Android.Views.Animations.AnimationUtils d’assistance qui gonfle une ressource d’animation et retourne une instance de Android.Views.Animations.Animation. Cet objet est appliqué à une vue en appelant StartAnimation et en transmettant l’objet Animation . L’extrait de code suivant montre un exemple de ceci :

Animation myAnimation = AnimationUtils.LoadAnimation(Resource.Animation.MyAnimation);
ImageView myImage = FindViewById<ImageView>(Resource.Id.imageView1);
myImage.StartAnimation(myAnimation);

Maintenant que nous avons une compréhension fondamentale du fonctionnement des animations d’affichage, nous allons passer aux animations de propriété.

Animations de propriété

Les animateurs de propriétés sont une nouvelle API introduite dans Android 3.0. Ils fournissent une API plus extensible qui peut être utilisée pour animer n’importe quelle propriété sur n’importe quel objet.

Toutes les animations de propriété sont créées par les instances de la sous-classe Animator . Les applications n’utilisent pas directement cette classe, au lieu de cela, elles utilisent l’une des sous-classes suivantes :

  • ValueAnimator : cette classe est la classe la plus importante de l’API d’animation de propriété entière. Elle calcule les valeurs des propriétés qui doivent être modifiées. Il ViewAnimator ne met pas directement à jour ces valeurs ; au lieu de cela, il déclenche des événements qui peuvent être utilisés pour mettre à jour des objets animés.

  • ObjectAnimator : cette classe est une sous-classe de ValueAnimator . Il est destiné à simplifier le processus d’animation d’objets en acceptant un objet cible et une propriété à mettre à jour.

  • AnimationSet : cette classe est chargée d’orchestrer la façon dont les animations s’exécutent par rapport à l’autre. Les animations peuvent s’exécuter simultanément, séquentiellement ou avec un délai spécifié entre eux.

Les évaluateurs sont des classes spéciales utilisées par les animateurs pour calculer les nouvelles valeurs pendant une animation. Android fournit les évaluateurs suivants :

Si la propriété qui est animée n’est pas une couleur ou int n’est pas une floatcouleur, les applications peuvent créer leur propre évaluateur en implémentant l’interfaceITypeEvaluator. (L’implémentation d’évaluateurs personnalisés dépasse la portée de cette rubrique.)

Utilisation de ValueAnimator

Il existe deux parties à n’importe quelle animation : calculer des valeurs animées, puis définir ces valeurs sur des propriétés sur un objet. ValueAnimator calcule uniquement les valeurs, mais elle ne fonctionne pas directement sur les objets. Au lieu de cela, les objets seront mis à jour à l’intérieur des gestionnaires d’événements qui seront appelés pendant la durée de vie de l’animation. Cette conception permet de mettre à jour plusieurs propriétés à partir d’une valeur animée.

Vous obtenez une instance de l’appel de ValueAnimator l’une des méthodes de fabrique suivantes :

  • ValueAnimator.OfInt
  • ValueAnimator.OfFloat
  • ValueAnimator.OfObject

Une fois cela terminé, l’instance ValueAnimator doit avoir sa durée définie, puis elle peut être démarrée. L’exemple suivant montre comment animer une valeur comprise entre 0 et 1 sur l’étendue de 1 000 millisecondes :

ValueAnimator animator = ValueAnimator.OfInt(0, 100);
animator.SetDuration(1000);
animator.Start();

Mais lui-même, l’extrait de code ci-dessus n’est pas très utile : l’animateur s’exécute, mais il n’existe aucune cible pour la valeur mise à jour. La Animator classe déclenche l’événement Update lorsqu’il décide qu’il est nécessaire d’informer les écouteurs d’une nouvelle valeur. Les applications peuvent fournir un gestionnaire d’événements pour répondre à cet événement, comme indiqué dans l’extrait de code suivant :

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

animator.Update += (object sender, ValueAnimator.AnimatorUpdateEventArgs e) =>
{
    int newValue = (int) e.Animation.AnimatedValue;
    // Apply this new value to the object being animated.
    myObj.SomeIntegerValue = newValue;
};

Maintenant que nous avons une compréhension de ValueAnimator, permet d’en savoir plus sur le ObjectAnimator.

Utilisation de ObjectAnimator

ObjectAnimator est une sous-classe qui ViewAnimator combine le moteur de minutage et le calcul de valeur de la ValueAnimator logique requise pour connecter des gestionnaires d’événements. Les ValueAnimator applications requises pour connecter explicitement un gestionnaire ObjectAnimator d’événements – s’occuperont de cette étape pour nous.

L’API pour ObjectAnimator laquelle il est très similaire à l’API pour ViewAnimator, mais nécessite que vous fournissez l’objet et le nom de la propriété à mettre à jour. L’exemple suivant montre un exemple d’utilisation ObjectAnimator:

MyCustomObject myObj = new MyCustomObject();
myObj.SomeIntegerValue = -1;

ObjectAnimator animator = ObjectAnimator.OfFloat(myObj, "SomeIntegerValue", 0, 100);
animator.SetDuration(1000);
animator.Start();

Comme vous pouvez le voir à partir de l’extrait de code précédent, ObjectAnimator peut réduire et simplifier le code nécessaire pour animer un objet.

Animations dessinables

L’API d’animation finale est l’API d’animation dessinable. Les animations dessinables chargent une série de ressources dessinables l’une après l’autre et les affichent de manière séquentielle, comme un dessin animé.

Les ressources dessinables sont définies dans un fichier XML qui a un <animation-list> élément comme élément racine et une série d’éléments <item> qui définissent chaque image dans l’animation. Ce fichier XML est stocké dans le /Resource/drawable dossier de l’application. Le code XML suivant est un exemple d’animation dessinable :

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@drawable/asteroid01" android:duration="100" />
  <item android:drawable="@drawable/asteroid02" android:duration="100" />
  <item android:drawable="@drawable/asteroid03" android:duration="100" />
  <item android:drawable="@drawable/asteroid04" android:duration="100" />
  <item android:drawable="@drawable/asteroid05" android:duration="100" />
  <item android:drawable="@drawable/asteroid06" android:duration="100" />
</animation-list>

Cette animation s’exécute sur six images. L’attribut android:duration déclare la durée d’affichage de chaque image. L’extrait de code suivant illustre la création d’une animation dessinable et son démarrage lorsque l’utilisateur clique sur un bouton à l’écran :

AnimationDrawable _asteroidDrawable;

protected override void OnCreate(Bundle bundle)
{
    base.OnCreate(bundle);
    SetContentView(Resource.Layout.Main);

    _asteroidDrawable = (Android.Graphics.Drawables.AnimationDrawable)
    Resources.GetDrawable(Resource.Drawable.spinning_asteroid);

    ImageView asteroidImage = FindViewById<ImageView>(Resource.Id.imageView2);
    asteroidImage.SetImageDrawable((Android.Graphics.Drawables.Drawable) _asteroidDrawable);

    Button asteroidButton = FindViewById<Button>(Resource.Id.spinAsteroid);
    asteroidButton.Click += (sender, e) =>
    {
        _asteroidDrawable.Start();
    };
}

À ce stade, nous avons abordé les bases des API d’animation disponibles dans une application Android.

Résumé

Cet article a présenté de nombreux nouveaux concepts et API pour vous aider à ajouter des graphiques à une application Android. Tout d’abord, il a abordé les différentes API graphiques 2D et montré comment Android permet aux applications de dessiner directement sur l’écran à l’aide d’un objet Canvas. Nous avons également vu certaines techniques alternatives qui permettent aux graphiques d’être créés de manière déclarative à l’aide de fichiers XML. Ensuite, nous avons abordé les anciennes et nouvelles API pour la création d’animations dans Android.