@946898963 2022-10-08T09:36:00.000000Z 字数 2353 阅读 198

Lottie

Android控件跟框架

站在 Android 开发的角度，聊聊 Airbnb 的 Lottie！！！

Lottie 动画里有图片怎么办？设计师小姐姐也能帮你减少开发量！

1,
Lottie 官方提供了一个 App，可以用于加载一个 Lottie 的动画，在排查问题方面，非常有用，建议如果使用 Lottie 的话，最好安装把玩一下。Lottie.Apk 需要去 Google Play 上下载，不方便下载的可以在公众号回复 "lottieapk"，直接下载 Apk 文件。

链接:https://pan.baidu.com/s/1B4pDnhXDp1KoJyMXF9rahA 密码:73ak

既然是动画，肯定有性能的要求。可以借助 Lottie App，来看看动画执行的性能问题，直接看效果就好了。

性能，故障排除，免费动画资源

站在 Android 开发的角度，聊聊 Airbnb 的 Lottie！！！

Lottie 动画，在导出成 JSON 之后，其实动画执行的速度和时长，都是已经固定了的。所以如果想要修改这两个参数，除了麻烦设计师使用 After Effects 重新修改之后再导出之外，还可以使用 ValueAniamtor 配合 setProgress() 方法来实现。

// 自定义动画速度和时长
ValueAnimator animator = ValueAnimator.ofFloat(0f, 1f)
    .setDuration(500);
animator.addUpdateListener(animation -> {
    animationView.setProgress(animation.getAnimatedValue());
});
animator.start();

加载服务器上的.json文件，若有图片可以设置本地代理文件夹或者将图片资源放入 JSON

private void loadUrl(String url) {
        Request request = new Request.Builder().url(url).build();
        OkHttpClient client = new OkHttpClient();
        client.newCall(request).enqueue(new Callback() {
            @Override public void onFailure(Call call, IOException e) {}
            @Override public void onResponse(Call call, Response response) throws IOException {
                try {
                    JSONObject json = new JSONObject(response.body().string());
                    LottieComposition.Factory
                            .fromJson(getResources(), json, new OnCompositionLoadedListener() {
                                @Override
                                public void onCompositionLoaded(LottieComposition composition) {
                                    lottieAnimationView.setComposition(composition);
                                    lottieAnimationView.playAnimation();
                                }
                            });
                } catch (JSONException e) {
                    e.printStackTrace();
                }
            }
        });
}

加载SDCard字体

lottieAnimationView.setFontAssetDelegate(new FontAssetDelegate(){
    public Typeface fetchFont(String fontFamily) {
        Typeface customFont = Typeface.createFromFile(FONT_PATH + fontFamily);
        return customFont;
    }
});

缓存

/*
* Lottie内部有两个缓存map（强引用缓存，弱引用缓存），在动画文件加载完成后会根据设置的缓存策略缓存动画，方便下次使用。
*/
lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Strong);    //强缓存
lottieAnimationView.setAnimation(animation, LottieAnimationView.CacheStrategy.Weak);      //弱缓存

根据进度缓存，并为下次播放作准备

lottieAnimationView.setProgress(progress);        //设置当前进度
lottieAnimationView.buildDrawingCache();          //强制缓存绘制数据
Bitmap image = lottieAnimationView.getDrawingCache(); //获取当前绘制数据

所有Lottie动画默认使用LRU cache缓存模式，默认的缓存的key为加载动画时根据res/raw/ 或者 assets/创建，其他的API要求设置cache key,如果您并行激发同一动画的多个动画请求（例如RecyclerView中的条目），则后续请求将加入现有任务，因此它只会被解析一次（Lottie> = 2.6.0）.

Lottie使用文档

6，

代码变色

lottie提供了三个改变颜色的API，

addColorFilter();
addColorFilterToLayer();
addColorFilterToContent();

详情见Lottie使用 - Cache One

Lottie

内容目录