全新的動畫格式
高性能動畫播放體驗
SVGA 是一種同時兼容 iOS / Android / Web 多個平臺的動畫格式慧域。
為什么選 SVGA弛车?
對碼農友好
便捷的 SDK 使得 SVGA 可運行在不同平臺上慨绳,集成步驟輕松簡單慎皱。
對設計師友好
你可以使用 After Effects 或是 Animate CC (Flash) 進行動畫設計行施,SVGA 可以支持其中的大部分效果延刘,設計師使用導出工具即可生成動畫文件。
性價比更高
動畫文件體積更小极谊,播放資源占用更優(yōu)诡右,動畫還原效果更好。
集成指南
將播放器集成至 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'
根據(jù)需要修改版本號猜煮,要獲取最新的版本請點入:
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
選擇 菜單 > 文件 > 打開,選中下載好的安裝包嗅绰,根據(jù)引導完成安裝
打開 Animate CC 或 After Effects 將被轉換文件保存
選擇 菜單 > 窗口 > 擴展 > SVGAConverter
選擇 輸出路徑 > 開始轉換舍肠,稍等片刻后,svga 文件就會生成在您所輸出的目錄并開始播放