iOS动画-Lottie

最近项目用动画的地方很多,自己又懒的去写,找到一个比较好的三方库进行分享。

首先cocoapods进行安装

swift版本就使用最新的就可以
pod 'lottie-ios'
OC版本需要添加版本号
pod 'lottie-ios' ,'~> 2.5.3'

Lottie 动画文件

在使用Lottie之前,你需要一个以JSON文件形式输出的动画数据库。如果你已经有了一个After Effects动画,用Bodymovin插件来创建JSON文件。

如果你不会使用After Effects呢?你可以雇一位设计师为你设计动画,或者你学会用After Effects。

还有一个就是去这里自己下载,这里有许多设计师设计的,找相同的进行更改:Lottie Files

以下是我的布局,一个UIView,两个Button:


布局.png

如何使用:

// 包含头文件
@import Lottie;
// 设置动画View
@property (strong,nonatomic) LOTAnimationView *animation;
// 关联UIView
@property (weak, nonatomic) IBOutlet UIView *animalView;

// 初始化动画
-(void)initAnimal
{
    self.animation = [LOTAnimationView animationNamed:@"servishero-loading"];
            
    self.animation.frame = CGRectMake(0, 0, self.animalView.frame.size.width, self.animalView.frame.size.height);
    
    [self.animalView addSubview:self.animation];
}

// 按钮点击开始动画
- (IBAction)startAnimal:(UIButton *)sender {
        
    NSLog(@"开始动画");
    self.animation.loopAnimation = YES; // 让动画一直执行
    [self.animation playWithCompletion:^(BOOL animationFinished) {
        // 动画停止后要做的事情
        NSLog(@"动画停止");
    }];
}

// 按钮点击暂停动画
- (IBAction)stopAnimal:(UIButton *)sender {
    
    NSLog(@"停止动画");
    [self.animation stop];
}

红色框里就是在网站上下载的其他设计师的文件,需要下载别的都可以进行替换


动画Json.png

因为OC版的三方库已经不再更新了,好多动画展示都有些问题,所以使用了Lottie的Swift版本,项目用OC调用Swift三方库

pod 'lottie-ios' ,'~> 4.2.0'

这里是LottieDemo,需要自行下载。
这里是OC调用Swift,需要自行下载。

有问题请指出~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容