让UI忙碌的安卓Lottie动画渲染库(一)

简介: 今天工作时突然在项目xml布局看到了一个完全不认识的控件,一开始以为是自定义View之类的:

前言

今天工作时突然在项目xml布局看到了一个完全不认识的控件,一开始以为是自定义View之类的:

<com.airbnb.lottie.LottieAnimationView
    android:id="@+id/lt_gift"
    android:layout_width="200dp"
    android:layout_height="200dp"
    app:lottie_autoPlay="true"
    app:lottie_fileName="lottie/gift.json"
    app:lottie_loop="true"
    app:lottie_repeatMode="restart"/>

但一看包所在名称,再一结合这个控件的显示效果与该布局中的命名,我以为是用来专门加载GIF动图的,但经过我在网上检索,查阅一些博客,访问Lottie的GitHub项目地址后,我才有了大致的印象,原来这个就是为我们开发者省心,让UI设计师忙碌的动画加载利器。

正篇

开场说过,本人对此库的认知也有限,本篇仅供参考用法,如有纰漏,望各位大佬能指正!

介绍

其实最好的介绍就是官方自我介绍,如下:


网络异常,图片无法展示
|


大致意思就是,首先它能多个系统开发上使用,如:安卓Android,苹果IOS,以及Windows、React Native、 Web上都可以使用。

而官方的自我介绍也很幽默:

Lottie是一个适用于Android和iOS的移动库,可以解析使用Bodymovin导出为json的AE(Adobe After Effects)动画,并在移动设备上以本机方式呈现它们!第一次,可以让设计师去创建和发布这些精美的动画,而不需要工程师煞费苦心地手动重新创建。他们说一张图片胜过1000个单词,所以这里有13000个单词。

总结而言,就是我们可以不用花费大量时间用代码调试动画,而是让UI设计去制作好成品,我们直接用就行。

如何放入项目中

首先,因为是新的库,我们需将包导入到我们build.gradle(app)中:

implementation 'com.airbnb.android:lottie:5.2.0'

网络异常,图片无法展示
|


接着就是文章开篇的代码,我们需要在XML布局的合适位置放入:

<com.airbnb.lottie.LottieAnimationView          使用Lottie
    android:id="@+id/lt_gift"                          id名
    android:layout_width="200dp"                   控件宽度
    android:layout_height="200dp"                  控件高度
    app:lottie_autoPlay="true"                        自动播放动画(default: false)
    app:lottie_fileName="lottie/gift.json"         目录下的json文件名(json文件可以直接放到assets目录下,比如“gift.json”,也可新建子目录,比如"lottie/gift.json")
    app:lottie_loop="true"                              循环播放(default:false)
    app:lottie_repeatMode="restart"                循环模式(default:restart)
   />            

总结

本节我们看了如何将Lottie放入我们的安卓项目中并在XML中写入,下节我们会继续看它在逻辑代码中的使用方法,感谢您的观看!

相关文章
|
7天前
|
Linux 编译器 Android开发
FFmpeg开发笔记(九)Linux交叉编译Android的x265库
在Linux环境下,本文指导如何交叉编译x265的so库以适应Android。首先,需安装cmake和下载android-ndk-r21e。接着,下载x265源码,修改crosscompile.cmake的编译器设置。配置x265源码,使用指定的NDK路径,并在配置界面修改相关选项。随后,修改编译规则,编译并安装x265,调整pc描述文件并更新PKG_CONFIG_PATH。最后,修改FFmpeg配置脚本启用x265支持,编译安装FFmpeg,将生成的so文件导入Android工程,调整gradle配置以确保顺利运行。
56 1
FFmpeg开发笔记(九)Linux交叉编译Android的x265库
|
7天前
|
Unix Linux Shell
FFmpeg开发笔记(八)Linux交叉编译Android的FFmpeg库
在Linux环境下交叉编译Android所需的FFmpeg so库,首先下载`android-ndk-r21e`,然后解压。接着,上传FFmpeg及相关库(如x264、freetype、lame)源码,修改相关sh文件,将`SYSTEM=windows-x86_64`改为`SYSTEM=linux-x86_64`并删除回车符。对x264的configure文件进行修改,然后编译x264。同样编译其他第三方库。设置环境变量`PKG_CONFIG_PATH`,最后在FFmpeg源码目录执行配置、编译和安装命令,生成的so文件复制到App工程指定目录。
51 9
FFmpeg开发笔记(八)Linux交叉编译Android的FFmpeg库
|
6天前
|
Android开发 算法 架构师
android的基础ui组件,这些知识点你会吗
android的基础ui组件,这些知识点你会吗
android的基础ui组件,这些知识点你会吗
|
6天前
|
Android开发 缓存 双11
android的基础ui组件,Android开发社招面试经验
android的基础ui组件,Android开发社招面试经验
android的基础ui组件,Android开发社招面试经验
|
7天前
|
Java Android开发 开发者
Android10 修改开发者选项中动画缩放默认值
Android10 修改开发者选项中动画缩放默认值
15 0
|
7天前
|
XML Java Android开发
android的三种动画
android的三种动画
15 0
|
5天前
Vue3+Vite+Pinia+Naive后台管理系统搭建之四:Naive UI 组件库的安装和使用
Vue3+Vite+Pinia+Naive后台管理系统搭建之四:Naive UI 组件库的安装和使用
10 1
|
5天前
|
数据库 Android开发
Android数据库框架-GreenDao入门,2024年最新flutter 页面跳转动画
Android数据库框架-GreenDao入门,2024年最新flutter 页面跳转动画
Android数据库框架-GreenDao入门,2024年最新flutter 页面跳转动画
|
6天前
|
监控 安全 API
orhanobut/logger - 强大的Android日志打印库
orhanobut/logger - 强大的Android日志打印库
19 1
|
7天前
|
前端开发 Java Android开发
Android UI底层绘制原理
Android UI底层绘制原理
15 0