Airbnb的开源项目Lottie简易实现动画
Lottie是Airbnb最近推出的开源项目,设计师只要使用AE把动画做出来,再使用Bodymovin插件就能把动画文件导出成json文件。这个json文件中包括动画的点的坐标,运行的轨迹等数据,在项目中引用这个开源库,使用这个json文件(或者URL)就可以实现动画,极快的完成了一个动画效果,要知道,简单的一个动画,用代码实现起来都需要花一定的时间。
跨平台使用
这个库是跨平台的,只要设计出一套json动画描述文件,就可以支持Android,iOS,ReactNative,iOS目前是支持iOS8及以上的,同时支持OC和Swift,下面讲iOS的用法。
支持使用Cocoapods和Carthage导入
pod 'lottie-ios'
pod install
github "airbnb/lottie-ios" "master"
carthage update
简单代码实现
加载json本地文件
LAAnimationView *animation = [LAAnimationView animationNamed:@"Lottie"];
[self.view addSubview:animation];
animation.loopAnimation = YES;
[animation playWithCompletion:^(BOOL animationFinished) {
}];
加载URL
LAAnimationView *animation = [[LAAnimationView alloc] initWithContentsOfURL:[NSURL URLWithString:URL]];
[self.view addSubview:animation];
增加转场动画
#pragma mark -- View Controller Transitioning
\\
- (id<UIViewControllerAnimatedTransitioning>)animationControllerForPresentedController:(UIViewController *)presented
presentingController:(UIViewController *)presenting
sourceController:(UIViewController *)source {
LAAnimationTransitionController *animationController = [[LAAnimationTransitionController alloc] initWithAnimationNamed:@"vcTransition1"
fromLayerNamed:@"outLayer"
toLayerNamed:@"inLayer"];
return animationController;
}
\\
- (id<UIViewControllerAnimatedTransitioning>)animationControllerForDismissedController:(UIViewController *)dismissed {
LAAnimationTransitionController *animationController = [[LAAnimationTransitionController alloc] initWithAnimationNamed:@"vcTransition2"
fromLayerNamed:@"outLayer"
toLayerNamed:@"inLayer"];
return animationController;
}
Swift实现
let animationView = LAAnimationView.animationNamed("hamburger")
self.view.addSubview(animationView!)
animationView?.play(completion: { (finished) in
// Do Something
})
相关文章
这个项目碉堡了
Airbnb/Lottie-iOS
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)