web-dev-qa-db-fra.com

Remplacer dynamiquement l'image dans l'animation de Lottie au moment de l'exécution

J'ai une animation après les effets, super simple, d'un carré se déplaçant autour (forme AE). J'exporte l'animation comme une .json à l'aide de BodyMovin et ajoutez le fichier JSON en utilisant Lottie dans mon projet. Jusqu'ici tout va bien.

Le problème commence ici -> Pendant l'exécution, remplacez ce "carré" avec une image que j'ai aussi dans mon projet. Parce que cette image peut changer, je ne peux pas l'ajouter statiquement à mon animation AE, alors besoin de l'ajouter de manière dynamique pendant l'exécution. Il n'y a presque aucune information sur la façon de faire cela dans Android?

6
mavesonzini

Réussi à faire cela: Le problème était que mon animation après les effets avait une forme de vecteur et j'essayais de remplacer cela. Après avoir changé l'animation d'origine pour avoir une .png à la place, je pourrais remplacer l'image au moment de l'exécution. Travaillé juste bien.

// First I converted the png I wanted to see at runtime to a bitmap:

Bitmap bitmapImage = BitmapFactory.decodeResource(getResources(), R.drawable.imageBlah);

// I used the lambda: 

lottieAnimationView.setImageAssetDelegate( lottieImageAsset -> bitmapImage);

Cela a travaillé pour une image, maintenant je vais voir comment diriger plusieurs images au moment de l'exécution.

3
mavesonzini

LottieAnimationView prolonge un ImageView. En d'autres termes, le LottieAnimationView est également un ImageView.

Donc, vous pouvez définir une image sur LottieAnimationView de la même manière que vous définissez une image sur un ImageView

Par exemple:

if (isAnimated) {
    mLottieView.setAnimation("<json file name from asset folder>");
} else {
    mLottieView.setImageResource(R.drawable.square_image);
}

Ceci est juste un exemple sur la façon dont vous pouvez utiliser la même vue pour lire une animation (fichier JSON) VOTRE afficher simplement une image comme n'importe quel ImageView ..

4
W0rmH0le

Lottie a un XML attribut app:lottie_imageAssetsFolder, Qui peut également être défini à l'heure d'exécution: animationView.setImageAssetsFolder("images/");. Avec cet ensemble, on peut référencer des images dans le json. Ceci est documenté en ligne; Voir les commentaires ci-dessus Line # 599 et # 630 . Ceci est également expliqué dans la documentation (src/assets Peut-être pas une option, car il n'est pas écritable):

Parfois, vous n'avez pas les images groupées avec l'appareil. Vous pouvez le faire pour économiser de l'espace dans votre APK ou si vous avez téléchargé l'animation du réseau. Pour gérer ce cas, vous pouvez définir un ImageAssetDelegate sur votre LottieAnimationView ou LottieDrawable. Le délégué s'appellera à chaque fois que Lottie tente de rendre une image. Il passera le nom de l'image et vous demandera de renvoyer le bitmap. Si vous ne l'avez pas encore (s'il s'agit toujours de télécharger, par exemple), renvoyez simplement NULL et Lottie continuera à demander à chaque image jusqu'à ce que vous retourne une valeur non nulle.

animationView.setImageAssetDelegate(new ImageAssetDelegate() {
    @Override
    public Bitmap fetchBitmap(LottieImageAsset asset) {
        if (downloadedBitmap == null) {
            // We don't have it yet. Lottie will keep asking until we return a non-null bitmap.
           return null;
        }
        return downloadedBitmap;
    }
});
3
Martin Zeitler