LG

Liste des interpolations avec leur courbe : Android Animation Interpolators Archive du 2014 le 29/05/2023

Il existe :

• AccelerateDecelerateInterpolator,
• AccelerateInterpolator,
• AnticipateInterpolator,
• AnticipateOvershootInterpolator,
• BounceInterpolator,
• CycleInterpolator,
• DecelerateInterpolator,
• LinearInterpolator,
• OvershootInterpolator,
• PathInterpolator.

Pour faire des animations, il est possible d'utiliser des classes Animation et des Animator.

Différence entre les deux, en mettant en avant Animator.

+ Plus récent.

+ Composant graphique utilisable pendant l'animation.

+ Permet de synchroniser plusieurs animations sur plusieurs composants graphiques.

+ L'implémentation des listener se fait sur la base d'une classe abstraite et non d'une interface ce qui évite de devoir définir tous les événements.

+ Permet d'enchainer des animations complexes dans la ressource XML.

+ Peuvent s'utiliser pour créer des animated-vector.

- Ne peut s'appliquer qu'à un seul composant graphique à la fois. Sinon, il faut multiplier les instances Animator.

- Nécessite plus de ressource.

- Ne permet pas de déplacer d'un pourcentage de la taille du composant depuis la ressource XML. Nécessite Java.

- Nécessite plus de ligne de code.

- Ne peut pas être créé depuis du code Java (sauf animation très simple). Nécessite d'avoir une ressource XML.

- Animation difficilement personnalisable en Java.

Globalement, Animator est mieux.

What is the difference between an Animator and an Animation? Archive du 29/01/2025 le 29/05/2023

Les ressources XML se mettent dans le dossier res/anim.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
  android:duration="500"
  android:interpolator="@android:anim/accelerate_interpolator"
  >
  <alpha
    android:fromAlpha="0"
    android:toAlpha="1" />
  <translate
    android:fromYDelta="+50%"
    android:toYDelta="0%" />
</set>

Animation animation = AnimationUtils.loadAnimation(context, R.anim.animation);
animation.setAnimationListener(new Animation.AnimationListener() {
  @Override
  public void onAnimationStart(Animation animation) {}
 
  @Override
  public void onAnimationEnd(Animation animation) {}
 
  @Override
  public void onAnimationRepeat(Animation animation) {}
});
 
Button button = myView.findViewById(R.id.button);
button.startAnimation(buttonIn);

Ici, animation est un AnimatorSet qui contient 2 animations (AlphaAnimation et TranslateAnimation).

• Plusieurs animations simples à la suite

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
  android:ordering="sequentially">
  <!-- wait -->
  <objectAnimator android:duration="2350">
    <propertyValuesHolder
      android:propertyName="alpha"
      android:valueFrom="0f"
      android:valueTo="0f"
      android:valueType="floatType" />
  </objectAnimator>
  <objectAnimator
    android:duration="750"
    android:interpolator="@android:anim/accelerate_interpolator">
    <propertyValuesHolder
      android:propertyName="translationY"
      android:valueFrom="250dp"
      android:valueTo="0dp" />
    <propertyValuesHolder
      android:propertyName="translationX"
      android:valueFrom="40dp"
      android:valueTo="0dp" />
    <propertyValuesHolder
      android:propertyName="alpha"
      android:valueFrom="0f"
      android:valueTo="1f"
      android:valueType="floatType" />
  </objectAnimator>
</set>

• Faire zoomer une image svg

Attention, il faut que les deux images svg soient compatibles (mêmes nombres de points).

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <objectAnimator
    android:duration="1000"
    android:interpolator="@android:anim/bounce_interpolator"
    android:propertyName="pathData"
    android:valueFrom="M 0 125 A 10 10 90 0 1 250 125 A 10 10 90 0 1 0 125 z"
    android:valueTo="M 40 125 A 10 10 90 0 1 210 125 A 10 10 90 0 1 40 125 z"
    android:valueType="pathType" />
</set>

• Image animée

L'animator.

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
  <objectAnimator
    android:duration="2000"
    android:propertyName="fillAlpha"
    android:startOffset="0"
    android:valueFrom="0.3f"
    android:valueTo="1.0f"
    android:valueType="floatType" />
</set>

L'image.

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:width="100dp"
  android:height="200dp"
  android:viewportWidth="180"
  android:viewportHeight="360">
 
  <path
    android:name="path"
    android:fillAlpha="0.3"
    android:fillColor="@color/md_theme_dark_onBackground"
    android:pathData="M 80 37.5 A 1 1 10 0 1 100 37.5 A 1 1 10 0 1 80 37.5 z" />
 
</vector>

L'image animée.

<?xml version="1.0" encoding="utf-8"?>
<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
  android:drawable="@drawable/image">
 
  <target
    android:name="path"
    android:animation="@animator/animator" />
</animated-vector>

• Minimaliste

Animator animator = AnimatorInflater.loadAnimator(context, R.animator.animator);
Button button = myView.findViewById(R.id.button);
animator.setTarget(button);

• Modifier une valeur d'un champ.

Il n'existe pas de méthode générique. Il faudra que l'animation XML soit parfaitement cohérente avec le code Java.

((ValueAnimator)((AnimatorSet) animator).getChildAnimations().get(0)).getValues()[0].setFloatValues(0.1f);

• Piloter plusieurs animations

AnimatorSet animatorSet = new AnimatorSet();
animatorSet.playTogether(anim1, anim2);
animatorSet.addListener(new AnimatorListenerAdapter() {
  @Override
  public void onAnimationEnd(Animator animation) {
    callback.run();
  }
});
animatorSet.start();

Attention, si une animation a un StartDelay et pas les autres, il faudra faire attention à l'ordre (lequel?) dans la méthode playTogether.

Note that an Animator with a startDelay will not actually start until that delay elapses, which means that if the first animator in the list supplied to this constructor has a startDelay, none of the other animators will start until that first animator's startDelay has elapsed.AnimatorSet Archive du 08/03/2023 le 29/05/2023

• SurfaceView / GLSurfaceView

Il n'est pas possible d'appliquer une animation d'apparition et de disparition sur les composants SurfaceView.

La solution est d'appliquer une surface au dessus de la SufaceView ayant comme couleur celle d'arrière-plan. Et donc, pour faire apparaitre progressivement la SurfaceView, il suffit de faire disparaitre progressivement la surface dessus.

AlphaAnimation over SurfaceView? Archive du 03/08/2011 le 23/08/2023