全新的动画格式
高性能动画播放体验
SVGA 是一种同时兼容 iOS / Android / Web 多个平台的动画格式。
立即体验
为什么选 SVGA?
对码农友好
便捷的 SDK 使得 SVGA 可运行在不同平台上,集成步骤轻松简单。
对设计师友好
你可以使用 After Effects 或是 Animate CC (Flash) 进行动画设计,SVGA 可以支持其中的大部分效果,设计师使用导出工具即可生成动画文件。
性价比更高
动画文件体积更小,播放资源占用更优,动画还原效果更好。
集成指南
将播放器集成至 iOS / Android / Web
iOS
使用 CocoaPods 集成源码,将以下依赖
pod 'SVGAPlayer'
添加至 Podfile 文件。
使用代码或 IB 添加 SVGAPlayer 至 View 中,具体方法参见:https://github.com/yyued/SVGAPlayer-iOS
Android
使用 Gradle 集成源码,添加 JitPack.io 到 root build.gradle 中
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
添加以下依赖:
compile 'com.github.yyued:SVGAPlayer-Android:2.0.0'
根据需要修改版本号,要获取最新的版本请点入:
https://jitpack.io/#yyued/SVGAPlayer-Android/。
使用代码或 XML 添加 SVGAImageView 至 View 中,具体方法参见:https://github.com/yyued/SVGAPlayer-Android。
Web
直接在: https://github.com/yyued/SVGAPlayer-Web 下载 build/svga.min.js,
并添加至目标页面。
或使用 npm install svgaplayerweb —save 添加依赖,
并在需要使用的 js 中添加 require('svgaplayerweb') 添加 Div 容器,并加载动画,
具体方法参见: https://github.com/yyued/SVGAPlayer-Web。
设计师工具
在 After Effects 2017 或 Animate CC 2017 中导出 SVGA 文件
Windows
下载 windows 的专用安装器:
Converter for Animate CC | Converter for After Effects
解压下载的 zip 包
运行 install.exe -> Install Now 进行安装
打开 Animate CC 或 After Effects 将被转换文件保存
选择 菜单 > 窗口 > 扩展 > SVGAConverter
选择 输出路径 > 开始转换,稍等片刻后,svga 文件就会生成在您所输出的目录并开始播放
SVGAConverter_FL|SVGAConverter_AE
Mac
点击下载安装包:
Converter for Animate CC | Converter for After Effects
下载、安装并运行 Adobe 的插件安装程序 ZXP Installer
选择 菜单 > 文件 > 打开,选中下载好的安装包,根据引导完成安装
打开 Animate CC 或 After Effects 将被转换文件保存
选择 菜单 > 窗口 > 扩展 > SVGAConverter
选择 输出路径 > 开始转换,稍等片刻后,svga 文件就会生成在您所输出的目录并开始播放
文章来源:http://svga.io/index.html