使用Lottie做加载动画

栏目: IOS · 发布时间: 5年前

内容简介:最主要的两个类是创建一个创建一个
  1. 多平台统一,包括使用和动画效果
  2. 不用导入图片,只需要一个json文件(大小只有几kb到几十kb),有效减小应用安装包体积
  3. 程序员几乎不用写动画代码,也能达到炫酷的动画效果

最主要的两个类是 AnimationViewAnimationAnimationView 是执行动画的View, Animation 即所执行的动画。例如加载动画:

创建一个 AnimationView

let animationView: AnimationView = {
    let animationView = AnimationView()
    animationView.size = CGSize(width: 170, height: 170)
    return animationView
}()
复制代码

创建一个 Animation 实例,并将它赋值给 animationView 的animation属性

let animation = Animation.named("animationName")

animationView.animation = animation
复制代码

其中 animationNamejson 文件名,可以在这里下载,也可以自己制作。

下面就可以在需要的地方执行动画了

animationView.play(fromProgress: 0, toProgress: 1, loopMode: .loop, completion: nil)
复制代码

动画可以终止或暂停

animationView.stop()


animationView.pause()

复制代码

最后,这里是一个使用Lottie做的 loadingView库 。可以在LottieFiles官网下载动画的json文件导入项目。

使用pod安装

pod 'LottieLoadingView'
复制代码

导入

import LottieLoadingView
复制代码
// 设置动画
AQLoadingView.shared.animationName = "935-loading"
// 开始加载
AQLoadingView.startLoading()
// 处理任务    
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 5) {
    // 结束加载
    AQLoadingView.endLoading()
}

复制代码

使用Lottie做加载动画

先给出Lottie的链接: Lottie-iOS

使用Lottie做动画的好处:

  1. 多平台统一,包括使用和动画效果
  2. 不用导入图片,只需要一个json文件(大小只有几kb到几十kb),有效减小应用安装包体积
  3. 程序员几乎不用写动画代码,也能达到炫酷的动画效果

最主要的两个类是 AnimationViewAnimationAnimationView 是执行动画的View, Animation 即所执行的动画。例如加载动画:

创建一个 AnimationView

let animationView: AnimationView = {
    let animationView = AnimationView()
    animationView.size = CGSize(width: 170, height: 170)
    return animationView
}()
复制代码

创建一个 Animation 实例,并将它赋值给 animationView 的animation属性

let animation = Animation.named("animationName")

animationView.animation = animation
复制代码

其中 animationNamejson 文件名,可以在这里下载,也可以自己制作。

下面就可以在需要的地方执行动画了

animationView.play(fromProgress: 0, toProgress: 1, loopMode: .loop, completion: nil)
复制代码

动画可以终止或暂停

animationView.stop()


animationView.pause()

复制代码

最后,这里是一个使用Lottie做的 loadingView库 。可以在LottieFiles官网下载动画的json文件导入项目。

使用pod安装

pod 'LottieLoadingView'
复制代码

导入

import LottieLoadingView
复制代码
// 设置动画
AQLoadingView.shared.animationName = "935-loading"
// 开始加载
AQLoadingView.startLoading()
// 处理任务    
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + 5) {
    // 结束加载
    AQLoadingView.endLoading()
}

复制代码

效果图:

使用Lottie做加载动画

以上所述就是小编给大家介绍的《使用Lottie做加载动画》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

人月神话(40周年中文纪念版)

人月神话(40周年中文纪念版)

(美) 布鲁克斯(Brooks, F. P.) 著 / UML China翻译组,汪颖 译 / 清华大学出版社 / 2015-4-1 / 68.00元

在软件领域,很少能有像《人月神话》一样具有深远影响力和畅销不衰的著作。Brooks博士为人们管理复杂项目提供了最具洞察力的见解,既有很多发人深省的观点,又有大量软件工程的实践。本书内容来自Brooks博士在IBM公司SYSTEM/360家族和OS/360中的项目管理经验,该项目堪称软件开发项目管理的典范。该书英文原版一经面世,即引起业内人士的强烈反响,后又译为德、法、日、俄、中、韩等多种文字,全球......一起来看看 《人月神话(40周年中文纪念版)》 这本书的介绍吧!

随机密码生成器
随机密码生成器

多种字符组合密码

UNIX 时间戳转换
UNIX 时间戳转换

UNIX 时间戳转换

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具