• Lottie开源库实现Android动画效果


    Lottie简介

        Lottie是一个支持Android、iOS、React Native,并由Adobe After Effects制作aep格式的动画,然后经由bodymovin插件转化渲染为json格式可被移动端本地识别解析的Airbnb开源库。Lootie实时呈现After Effects动画效果,让应用程序可以像使用静态图片一样轻松地使用动画。

        Lottie支持API14及以上。

     

    动画效果呈现

    这些动画不是简单的移动、缩放、旋转就搞得定的,思考之后大概有以下实现思路:

    • 使用 Gif,这种方式当然可行,但是使用 Gif 占用空间较大,而且需要为各种屏幕尺寸、分辨率做适配,因为 Android 没有提供原生 Gif 的 api 支持,所以这种方案还会遇到兼容性问题;
    • 使用帧动画,这种方式还不如使用 Gif,一般来说使用帧动画占用空间比 Gif 还要大的多,而且一样要做多屏幕分辨率的适配,不过不会遇到兼容性问题;
    • 使用视频,这种方式当然可以,但是一般来说宣传片才用的上视频,一般的动画远不需要用视频才能实现的,未免有些大材小用了,而且占用空间依然很大。
    • Android 5.x 之后提供了对 SVG 的支持,通过 VectorDrawable、AnimatedVectorDrawable 的结合可以实现一些稍微复杂的动画,兼容性是一个问题,不过整个实现流程非常麻烦,每次全新实现一个动画都得重头来过,最最关键的是,如果一个公司下的 App,iOS 也要实现一套一样的动画,资源的占用就显得过大了。

    而 Airbnb 开源的这个项目完美的解决以上难题,我们来看下整个流程是什么样的。

        假设我们要做一个引导页面的欢迎动画,这个一般设计师会用 Adobe 旗下的 After Effects (简称 AE)来做个动画出来,设计师用 AE 做个动画比工程师用代码去实现一个动画要快的多的多,调整起来也很方便,之后 AE 上有一款插件叫做Bodymovin,这个插件也比较屌,可以直接根据 AE 上的动画文件导出 json 文件,这个 json 文件描述了该动画的一些关键点的坐标以及运动轨迹,之后我们在项目中引用 Lottie 开源库,在布局文件中简单的加上下面这一段就完美的实现了。

    <com.airbnb.lottie.LottieAnimationView
    
        android:id="@+id/animation_view"
    
        android:layout_width="wrap_content"
    
        android:layout_height="wrap_content"
    
        app:lottie_fileName="hello-world.json"
    
        app:lottie_loop="true"
    
        app:lottie_autoPlay="true" />

    或者代码中这样使用:

    LottieAnimationView animationView = findViewById(R.id.animation_view);
    
    animationView.setAnimation("hello-world.json");
    
    animationView.loop(true);

    值得一提的是,我们的 hello-world.json 文件只需要放在 app/src/main/assets 目录下就 ok 了。

        当然,还有更多的用法,比如给动画添加事件,比如描述动画的 json 文件可以远程更新下载到本地,这样就可以不动声色的定期更新你的动画了。这些功能有兴趣可以查阅下方的参考文献。

        有了这个库,我们可以充分发挥我们的想象力,很简单方便的就实现了一套很酷炫的动画,最重要的是,这个库是跨平台的,支持 Android、iOS 以及 ReactNative,共用一套 json 动画描述文件。

    参考文章:

     

    这个项目碉堡了

    After Effect svg 动画– 神奇的bodymovin 插件

    Lottie Android 初探

    Lottie- Android动画实现更简单

    Lottie- Android动画实现更简单

  • 相关阅读:
    python中类方法、类实例方法、静态方法的使用与区别
    在python里如何动态添加类的动态属性呢?
    PYTHON基础
    EXCEL 写入
    thread 多线程
    Python 常用函数
    列表减列表
    04_Linux搭建Jdk和tomcat环境
    自动生成和安装requirements.txt依赖
    python+selenium面试题
  • 原文地址:https://www.cnblogs.com/mgzc-1508873480/p/8038324.html
Copyright © 2020-2023  润新知