鸿蒙Lottie动画-实现控制动画的播放、暂停、倍速播放、播放顺序

介绍

本示例展示了lottie对动画的操作功能。引入Lottie模块,实现控制动画的播放、暂停、倍速播放、播放顺序、播放到指定帧停止或从指定帧开始播放、侦听事件等功能,动画资源路径必须是json格式。

效果预览

使用说明:

  1. 进入页面默认开始2016动画,点击请选择进行选择动画资源;
  2. 上面部分播放暂停是对两个动画进行控制,下面部分播放暂停功能是对grunt动画控制;
  3. 点击销毁动画功能之后需要重新选择动画资源才可以进行其余功能操作。

工程目录

entry/src/main/ets/
|---common
|   |---data.json                           // 2016新年动画
|   |---grunt.json                          // grunt动画
|---pages
|   |---Lottie.ets                          // 首页
|---utils                                  
|   |---Logger.ts                           // 日志工具

具体实现

  • 页面中使用了Lottie对象控制动画的一系列操作,源码参考Lottie.ets:初始化动画:在canvas的onReady里使用loadAnimation加载动画,须提前声明Animator(‘__lottie_ets’)对象,并在Canvas完成布局后调用;Lottie动画操作:lottie.play播放动画,lottie.pause暂停播放,lottie.setDirection设置播放顺序

相关权限

不涉及。

约束与限制

  1. 本示例支持标准系统上运行,支持设备:RK3568;
  2. 本示例已适配API version 9版本SDK,版本号:3.2.11.9;
  3. 本示例需要使用DevEco Studio 3.1 Beta2 (Build Version: 3.1.0.400, built on April 7, 2023)及以上版本才可编译运行;
  4. 本示例需要使用animator.d.ts系统权限的系统接口。使用Full SDK时需要手动从镜像站点获取,并在DevEco Studio中替换,具体操作可参考替换指南。

下载

如需单独下载本工程,执行如下命令:

git init
git config core.sparsecheckout true
echo code/Solutions/Game/Lottie/ > .git/info/sparse-checkout
git remote add origin https://gitee.com/openharmony/applications_app_samples.git
git pull origin master

为了帮助大家更深入有效的学习到鸿蒙开发知识点,小编特意给大家准备了一份全套最新版的HarmonyOS NEXT学习资源,获取完整版方式请点击→《https.docs.qq.com

HarmonyOS教学视频:语法ArkTS、TypeScript、ArkUI等.....视频教程

鸿蒙生态应用开发白皮书V2.0PDF:

获取完整版白皮书方式请点击→《https.docs.qq.com

鸿蒙 (Harmony OS)开发学习手册

一、入门必看

  1. 应用开发导读(ArkTS)
  2. ……

二、HarmonyOS 概念

  1. 系统定义
  2. 技术架构
  3. 技术特性
  4. 系统安全
  5. ........

三、如何快速入门?《https.docs.qq.com

  1. 基本概念
  2. 构建第一个ArkTS应用
  3. ……

四、开发基础知识

  1. 应用基础知识
  2. 配置文件
  3. 应用数据管理
  4. 应用安全管理
  5. 应用隐私保护
  6. 三方应用调用管控机制
  7. 资源分类与访问
  8. 学习ArkTS语言
  9. ……

五、基于ArkTS 开发

  1. Ability开发
  2. UI开发
  3. 公共事件与通知
  4. 窗口管理
  5. 媒体
  6. 安全
  7. 网络与链接
  8. 电话服务
  9. 数据管理
  10. 后台任务(Background Task)管理
  11. 设备管理
  12. 设备使用信息统计
  13. DFX
  14. 国际化开发
  15. 折叠屏系列
  16. ……

更多了解更多鸿蒙开发的相关知识可以参考:《https.docs.qq.com

最近更新

  1. TCP协议是安全的吗?

    2024-04-02 08:58:03       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-04-02 08:58:03       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-04-02 08:58:03       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-04-02 08:58:03       18 阅读

热门阅读

  1. 阿里云效codeup如何执行github flow工作流

    2024-04-02 08:58:03       15 阅读
  2. 机器学习之局部异常因子算法(Local Outlier Factor)

    2024-04-02 08:58:03       12 阅读
  3. inout模块设计

    2024-04-02 08:58:03       13 阅读
  4. 【DevOps工具篇】 OpenLDAP服务器安装和配置方法

    2024-04-02 08:58:03       10 阅读
  5. PLC数据类型介绍

    2024-04-02 08:58:03       18 阅读
  6. Linux常用命令行介绍

    2024-04-02 08:58:03       15 阅读
  7. 【RV1126】瑞芯微RV1126开发板双网口问题

    2024-04-02 08:58:03       15 阅读
  8. 力扣爆刷第109天之CodeTop100五连刷31-35

    2024-04-02 08:58:03       13 阅读
  9. Vue+elementUI实现增删改查(前端静态页面)

    2024-04-02 08:58:03       14 阅读