前端动画实现的常见方法

最新推荐文章于 2024-06-07 16:01:04 发布

想要飞翔的小猪

最新推荐文章于 2024-06-07 16:01:04 发布

阅读量258

点赞数 1

分类专栏： css3 uni-app

本文链接：https://blog.csdn.net/dwb123456123456/article/details/116519663

版权

本文介绍了三种前端动画实现方法：SVGA，Lottie的JSON动画和CSS3动画。SVGA是一种跨平台的开源动画格式，简化了动画开发流程；Lottie提供了低开发成本和高还原度的动画解决方案，但对某些AE属性支持有限；CSS3动画适合简单的动画，但复杂的动画性能不佳。

摘要由CSDN通过智能技术生成

SVGA

地址：http://svga.io/intro.html
SVGA 是一种跨平台的开源动画格式，同时兼容 iOS / Android / Web。SVGA 除了使用简单，性能卓越，同时让动画开发分工明确，各自专注各自的领域，大大减少动画交互的沟通成本，提升开发效率。动画设计师专注动画设计，通过工具输出 svga 动画文件，提供给开发工程师在集成 svga player 之后直接使用。动画开发从未如此简单！

SVGA 除了使用简单，性能卓越，同时让动画开发分工明确，各自专注各自的领域，大大减少动画交互的沟通成本，提升开发效率。

动画设计师专注动画设计，通过工具输出 svga 动画文件，提供给开发工程师在集成 SVGAPlayer 之后直接使用
简单案例

iOS
使用 CocoaPods 集成源码，将以下依赖：

pod 'SVGAPlayer'

添加至 Podfile 文件。

使用代码或 IB 添加 SVGAPlayer 至 View 中，具体方法参见：
https://github.com/svga/SVGAPlayer-iOS

Android
使用 Gradle 集成源码，添加 JitPack.io 到 root build.gradle 中

allprojects {
   
  repositories {
   
    ...
    maven {
    url 'https://jitpack.io' }
  }
}
添加以下依赖:

compile 'com.github.svga:SVGAPlayer-Android:2.0.0'
根据需要修改版本号，要获取最新的版本请点入：
https://jitpack.io/#sv