首页/新闻资讯/正文详情

如何5分钟上手svga-cj:HarmonyOS仓颉语言SVGA动画播放器快速入门教程

发布时间:2026/9/25 10:13:14 来源:云帆数科 栏目:资讯中心
如何5分钟上手svga-cj:HarmonyOS仓颉语言SVGA动画播放器快速入门教程
如何5分钟上手svga-cjHarmonyOS仓颉语言SVGA动画播放器快速入门教程【免费下载链接】svga-cjsvga格式动画展示库项目地址: https://gitcode.com/Cangjie-TPC/svga-cjsvga-cj是一款专为 HarmonyOS 打造的SVGA 动画播放器库使用仓颉语言Cangjie开发能够解析.svga格式动画并在移动端进行本地渲染支持播放、暂停、快进、跳帧、倍速等完整播放控制新手5分钟即可将动效集成到自己的 App 中 一、svga-cj 是什么能做什么svga-cj 是一个轻量级 SVGA 动画展示库当前 release 版本 v1.3.0核心特性包括特性说明 加载 SVGA 动画支持 rawfile 中的.svga资源本地解析渲染 播放控制播放、暂停、停止、反向播放⏩ 快进能力按帧或按百分比跳转stepToFrame/stepToPercentage 循环与倍速可设置循环次数setLoops与倍速setCurRate✏️ 动态内容替换通过setImage/setText替换动画中的图片与文本⚠️ 目前仅支持 2.0 版本的 svga 资源暂不支持带音频的动画。二、准备工作环境要求快速核对集成前先确认开发环境详见 README.md 的约束说明✅ DevEco Studio6.1.1 Release6.1.1.280 Cangjie Plugin 6.1.1 Beta1✅ 仓颉编译器cjc v1.1.3✅ 配置CANGJIE_STDX_PATH环境变量依赖三方库 stdx v1.1.3.1✅ 自动拉取依赖zlib4cj、protobuf4cj构建脚本见 pre_protobuf_install.mjs获取项目源码git clone https://gitcode.com/Cangjie-TPC/svga-cj三、最快配置方法4步把svga模块接入你的项目第 1 步拷贝模块。将仓库中的 svga/ 目录整体拷贝到你的应用项目根目录并在项目build-profile.json5的modules字段注册模块{ name: svga, srcPath: ./svga }第 2 步声明 npm 依赖。在entry/oh-package.json5的dependencies中添加cangjie-tpc/svga: file:../svga第 3 步配置仓颉包。在entry/src/main/cangjie/cjpm.toml中添加[dependencies.svga] path ${cangjie_tpc_svga}第 4 步导入即可使用。在业务代码中import svga.*与import svga.player.*库的对外入口定义在 svga_player.cj。四、SvgaPlayer 组件使用一段代码跑起动效参考示例工程入口 index.cj核心只有几行var controller: SvgaController SvgaController() public func build() { Column { SvgaPlayer(url: angel.svga, abilitycontext: globalcontext.getOrThrow(), controller: controller) }.width(300).aspectRatio(1) }SvgaPlayer组件接收urlrawfile 中的 svga 资源路径、abilitycontextUI 上下文和controller播放器控制器三个参数组件内部自动完成解析、画布自适应缩放与播放渲染逻辑见 renderer.cj解析器见 parser.cj。常用控制器 API 清单场景调用方法加载并自动播放controller.load(source)暂停 / 停止pauseAnimation()/stopAnimation(clears)从第 N 帧 / 百分比跳转stepToFrame(frame)/stepToPercentage(pct)播放范围startAnimationWithRange(range)循环次数 / 倍速setLoops(3)/setCurRate(2.0)完成与进度回调onFinished { }/onPercentage { }循环、自动释放等默认参数通过SvgaPlayerProps构造SvgaController完整接口文档请查阅 feature_api.md。五、目录导航快速定位源码与文档 API 文档doc/feature_api.md 示例代码entry/src/main/cangjie/含 main_ability.cj 上下文初始化 播放器核心svga/src/main/cangjie/player/svga_controller.cj、state_controller.cj 版本记录CHANGELOG.md 构建配置cjpm.toml按以上步骤你只需要 4 次配置 1 段代码就能在 HarmonyOS 应用中流畅播放 SVGA 动画快去试试吧 ✨【免费下载链接】svga-cjsvga格式动画展示库项目地址: https://gitcode.com/Cangjie-TPC/svga-cj创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

相关推荐

程序员都在用的AI网站:TaoToken统一Key接入Cline与CC Switch配置指南
程序员都在用的AI网站:TaoToken统一Key接入Cline与CC Switch配置指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 10:13:14

树莓派5 Docker安装配置与优化实战指南
树莓派5 Docker安装配置与优化实战指南

1. 为什么要在树莓派5上折腾Docker树莓派5这块板子出来之后,我第一时间把手头那台跑了三年多的树莓派4换了下来。原因很简单:树莓派4的USB 3.0和千兆网卡共享带宽,跑几个容器之后IO就顶不住了,而树莓派5把PCIe通道单独拉出来&… · 2026/9/25 10:13:08

Atlas 300V实战:从ATC转换到YOLO推理部署全流程指南
Atlas 300V实战:从ATC转换到YOLO推理部署全流程指南

1. Atlas 300V到底是个什么卡?先把这个“是不是运算加速卡”的问题说清楚1.1 从一张“陌生卡”说起前阵子项目组进了几张新卡,标签上印着“Atlas 300V 24G”。同事第一反应问我:这不是运算加速卡吗?是不是跟GPU一样,插… · 2026/9/25 10:13:08

WorkBuddy Enterprise 企业级 Agent 平台:从 CodeBuddy 到团队协作的落地实践
WorkBuddy Enterprise 企业级 Agent 平台:从 CodeBuddy 到团队协作的落地实践

1. 从「超级个体」到「超级团队」:这个平台到底在解决什么问题第一次看到「WorkBuddy Enterprise」这个名字,我脑子里蹦出来的第一个念头是:腾讯这是要把 CodeBuddy 那套单兵作战的能力,往组织级别去推了。过去一年我一直在用 Cod… · 2026/9/25 10:40:08

代码随想录/hello-algo学习笔记——二叉树
代码随想录/hello-algo学习笔记——二叉树

二叉树的基本概念 二叉树是一种非线性的数据结构,由每个节点一分为二引出两个子节点(类似高中生物学到的祖先后代的结构图,但二叉树是一个节点只能有两个子节点)。 基本单元:结点。每个节点包含值和两个引用&#xff0… · 2026/9/25 10:39:56

A2A供需匹配为什么不能只靠向量相似度
A2A供需匹配为什么不能只靠向量相似度

更新说明(2026年9月23日):本文是历史技术方案记录。当前 MapleBridge 用于采购询价、邀请买家已有的供应商联系人与报价比较,不提供供应商搜索、工厂核验或自动撮合。B2B 供需匹配为什么不能只靠向量相似度 最近在做一个 B2B 供需… · 2026/9/25 10:39:56

大模型网关密钥自动分配:MCP协议+CLI驱动的智能调度方案
大模型网关密钥自动分配:MCP协议+CLI驱动的智能调度方案

1. 项目概述:为什么需要一个“自动分配密钥”的大模型网关调用中枢? 你有没有遇到过这样的场景:团队里五个人同时在调试同一个大模型应用,每人手里攥着一份从不同渠道申请来的API密钥——有人用的是Qwen的Key,有人配的… · 2026/9/25 10:39:50

JetBrains Mono 编程字体配置全指南:解决中文、连字与跨平台问题
JetBrains Mono 编程字体配置全指南:解决中文、连字与跨平台问题

1. 为什么 JetBrains Mono 是程序员真正需要的“呼吸感”字体JetBrains Mono 不是又一个标榜“等宽”的编程字体,它是 JetBrains 团队花了整整两年时间,盯着成千上万行真实代码、反复调整每一个字形轮廓、甚至为0和O的区分度单独设计视觉权重后&#xff… · 2026/9/25 10:39:50

IDURAR 开源 ERP/CRM 系统技术指南:基于 MERN 技术栈的功能架构、数据模型与部署实践
IDURAR 开源 ERP/CRM 系统技术指南:基于 MERN 技术栈的功能架构、数据模型与部署实践

后端前端企业应用CRM 【免费下载链接】idurar-erp-crm Free Open Source ERP CRM Software Accounting Invoicing | Node.Js React 项目地址: https://gitcode.com/gh_mirrors/id/idurar-erp-crm 点击查看 免费下载 导读 本文以 IDURAR(idurar-erp-crm… · 2026/9/25 10:39:43

数值优化(Numerical Optimization)学习系列-03-共轭梯度方法(Conjugate Gradient)
数值优化(Numerical Optimization)学习系列-03-共轭梯度方法(Conjugate Gradient)

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:31

创维E900V22D刷机全攻略:S905L3SB芯片兼容性解析与救砖实战
创维E900V22D刷机全攻略:S905L3SB芯片兼容性解析与救砖实战

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:31

MQTT协议原理与Broker服务器搭建实战:从Mosquitto到EMQX
MQTT协议原理与Broker服务器搭建实战:从Mosquitto到EMQX

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views … · 2026/9/25 1:00:37

了解更多?预约专属演示

我们的顾问将为您一对一讲解产品与方案

企业微信二维码