一、Lottie介紹
lottie是一個(gè)可以解析使用【bodymovin】插件從Adobe After Effects中導(dǎo)出的格式為 json 的文件,并在 iOS匆绣、Android聋呢、macOS、React Native 中進(jìn)行解析使用的開源庫(kù)鲸睛。
在項(xiàng)目運(yùn)用該庫(kù)的目的只有一個(gè)那就是颠猴,讓我們移動(dòng)端展示出的UI更加絢麗关划。雖然一些動(dòng)態(tài)的動(dòng)畫效果我們移動(dòng)端開發(fā)自身也能畫出來,但是耗費(fèi)的時(shí)間和精力是十分巨大的翘瓮。而借用lottie去解析由UI設(shè)計(jì)師bodymovin導(dǎo)出的json文件贮折,就可以輕松的完成。
當(dāng)然也有一些不足:要求系統(tǒng)版本在iOS8 及以上资盅,目前只能支持播放動(dòng)畫调榄,復(fù)雜的交互動(dòng)畫(特別需求有model數(shù)據(jù)交互)還不能支持!
二律姨、YCTabBar
借力@東東隆東搶提醒振峻,gif效果圖做出來了
下載地址https://github.com/jianyu7819/YCLottieTabBar
主要代碼是自定制YCtabBar臼疫,基于UIView
在YCTabBar.h中設(shè)置代理
@class YCTabBar;
@protocol YCTabBarDetagate<NSObject>
@optional-(void)tabBar:(YCTabBar *)tabBar didselectedButtonFrom:(int )from to: (int )to;
@end
@interface YCTabBar : UIView
@property(nonatomic,weak)iddelegate;
-(void)addTabBarButtonWithItem:(UITabBarItem *)item;
@end
這邊我設(shè)置的代理主要監(jiān)聽跳轉(zhuǎn)那頁(yè)面下择份,可根據(jù)需求自定制
api:-(void)addTabBarButtonWithItem:(UITabBarItem *)item;主要傳導(dǎo)過來tabbarcontroller的item數(shù)據(jù)
在YCTabBar.m中
主要在-(void)addTabBarButtonWithItem:(UITabBarItem *)item;API的實(shí)現(xiàn)和layoutSubviews中相應(yīng)button和LOTAnimationView的frame布局烫堤。
-(void)addTabBarButtonWithItem:(UITabBarItem *)item{
//1荣赶、創(chuàng)建按鈕 創(chuàng)建LOTAnimationView
NSString *jsonStr;
NSInteger TagNum;
if ([item.title isEqualToString:@"首頁(yè)"]){
TagNum = 100;
jsonStr = @"data01.json";
}else if ([item.title isEqualToString:@"動(dòng)態(tài)"]){
TagNum = 101;
jsonStr = @"data02.json";
}else if ([item.title isEqualToString:@"購(gòu)物車"]){
TagNum = 102;
jsonStr = @"data03.json";
}else{
TagNum = 103;
jsonStr = @"data04.json";
}
LOTAnimationView *aniView = [LOTAnimationView animationNamed:jsonStr];
aniView.tag = TagNum;
if (aniView.tag == 100) {
_selectedview = aniView;
}
[self addSubview:aniView];
YCTabBarButton *button=[[YCTabBarButton alloc]init];
[self addSubview:button];
//添加按鈕到數(shù)組中
[self.viewsArr addObject:aniView];
[self.tabBarButtons addObject:button];
//2、設(shè)置數(shù)據(jù)
button.item=item;
//3鸽斟、監(jiān)聽按鈕點(diǎn)擊
[button addTarget:self action:@selector(buttonClick:) forControlEvents:UIControlEventTouchDown];
//4拔创、默認(rèn)選中第零個(gè)
if(self.tabBarButtons.count==1){[_selectedview play];[self buttonClick:button];}
}
由于篇幅,想了解的更多富蓄,直接github下載剩燥,demo比較簡(jiǎn)單,邏輯也是比較清晰的。
https://github.com/jianyu7819/YCLottieTabBar歡迎大家C鸷臁侣滩!
個(gè)人工作學(xué)習(xí)積累,分享~~