Lottie 源码解析(一)

标签(空格分隔): json lottie


LottieCompostion

composition : 构成

原文注释:

/**
* After Effects/Bodymovin composition model. This is the serialized model from which the
* animation will be created.
* It can be used with a {@link com.airbnb.lottie.LottieAnimationView} or
* {@link com.airbnb.lottie.LottieDrawable}.
*/
这段意思大致是讲:
利用AE或者Bodymovin会构成一个模型,这段序列化的模型将被用于创建动画。它可以与LottieDrawableLottieAnimationView一起使用

Lottie的三大核心类,在这段注释上全都涉及到了,从语义上也能看出,这个类的核心功能是获得构建动画的数据,也就是用这个类完成对json解析数据的封装

构造方法

首先json数据有多处来源,可能是你工程自带asset文件中的资源,也可能来源于网络,还有同步与异步的解析方法,因此在构造时为了区分不同的来源,此处采用静态工厂设计模式应对不同的数据源。

  • 私有构造方法
  • 内部静态工厂类

    public static class Factory {
    private Factory() {
    }


同步解析

/**
* 从asset中解析
*/
static LottieComposition fromFileSync(Context context, String fileName) {
  InputStream stream;
  try {
    stream = context.getAssets().open(fileName);
  } catch (IOException e) {
    throw new IllegalStateException("Unable to find file " + fileName, e);
  }
  return fromInputStream(context.getResources(), stream);
}


/**
* json解析
*/
static LottieComposition fromJsonSync(Resources res, JSONObject json) {
  Rect bounds = null;
  float scale = res.getDisplayMetrics().density;
  int width = json.optInt("w", -1);
  int height = json.optInt("h", -1);

  if (width != -1 && height != -1) {
    int scaledWidth = (int) (width * scale);
    int scaledHeight = (int) (height * scale);
    bounds = new Rect(0, 0, scaledWidth, scaledHeight);
  }

  long startFrame = json.optLong("ip", 0);
  long endFrame = json.optLong("op", 0);
  int frameRate = json.optInt("fr", 0);
  LottieComposition composition =
  new LottieComposition(bounds, startFrame, endFrame, frameRate, scale);
  JSONArray assetsJson = json.optJSONArray("assets");
  parseImages(assetsJson, composition);
  parsePrecomps(assetsJson, composition);
  parseLayers(json, composition);
  return composition;
}

异步解析

 两个继承了AsyncTask的异步解析类,一个用来解析文件,一个用来解析json
  • JsonCompositionLoader ->CompositionLoader -> AsyncTask
  • FileCompositionLoader ->CompositionLoader -> AsyncTask

解析方式差不多,只不过更换成为了异步,实现了一个Cancellable接口,用于取消解析


成员变量

Composition_member_variable.png-60.1kB

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
以下是一个简单的 Android Lottie Tab 的示例代码: XML 布局文件: ``` <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.TabLayout android:id="@+id/tab_layout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabIndicatorColor="@color/colorAccent" app:tabSelectedTextColor="@color/colorAccent" app:tabTextColor="@android:color/darker_gray" /> ``` Java 代码: ``` TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout); // 添加 Tab tabLayout.addTab(tabLayout.newTab().setText("动画 1")); tabLayout.addTab(tabLayout.newTab().setText("动画 2")); tabLayout.addTab(tabLayout.newTab().setText("动画 3")); // 设置 TabLayout.OnTabSelectedListener tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() { @Override public void onTabSelected(TabLayout.Tab tab) { switch (tab.getPosition()) { case 0: // 显示动画 1 loadAnimation("animation_1.json"); break; case 1: // 显示动画 2 loadAnimation("animation_2.json"); break; case 2: // 显示动画 3 loadAnimation("animation_3.json"); break; } } @Override public void onTabUnselected(TabLayout.Tab tab) { } @Override public void onTabReselected(TabLayout.Tab tab) { } }); // 加载动画 private void loadAnimation(String fileName) { LottieAnimationView animationView = (LottieAnimationView) findViewById(R.id.animation_view); animationView.setAnimation(fileName); animationView.playAnimation(); } ``` 需要注意的是,上述示例中用到了 LottieAnimationView,需要在 build.gradle 文件中添加以下依赖: ``` dependencies { implementation 'com.airbnb.android:lottie:3.4.0' } ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值