iOS tabbar动画-CYLTabBarController

源代码 · 2024-10-1 23:11:17

GitHub 源码: CYLTabBarController
Star: 6.1k

【中国特色 TabBar】一行代码实现 Lottie 动画 TabBar，支持中心带 + 号的 TabBar 样式，自带红点角标，支持动态革新。【iOS13 & Dark Mode & iPhone XS MAX supported】。

前言

起首：不光仅是一行代码！
官方声称的 "一行代码实现 Lottie 动画 TabBar" 着实有虚晃一枪的怀疑，让你听起来误以为用一行代码就可以实现淘宝「闲鱼」那种既带 ➕ 号按钮又带 Lottie 动画的 TabBar 了。着实折腾下来照旧要写个几百行代码的。正确的形貌应该是：集成 CYLTabBarController 之后，再导入所需的 JSON 文件（该文件用于形貌 TabBar 的 Lottie 动画），并添加一行代码，即可让 TabBar 实现 Lottie 动画。
因此，所谓的 "一行代码实现 Lottie 动画”，着实就是设置方法里面再加一个 key 值为 CYLTabBarLottieURL 的属性，它的值是一个 NSURL 链接，指向你项目中形貌 Lottie 动画的 JSON 文件。你照旧必要本身提前准备好 Lottie 的 JSON 文件的，以是说，所谓的一行代码就是，当涉及到 Lottie 动画时，你给体系传一个带 Lottie 动画的 URL 文件（既然“一行代码”是这个意思的话，我是不是可以说一行代码实现一个全套 Google 搜刮引擎功能呢？打开一个 google.com 的 HTML 5 页面不就实现了嘛）。
别的，一望见 CYLTabBarController 这个框架是国人写的，而且 README 文档是中文的，真的是喜极而泣?，让我误以为花个 5 分钟便可以从入门到醒目，终极折腾了好几天，下载了好几个 Demo 才算弄明白。
鉴于官方 README.md 文档的“暗昧不清”，与配套 Demo 写法上也存在很大的收支，照旧让一开始初入相识该框架的同砚造成了很大的困扰。
接下来，我会通过实现一个模仿「闲鱼」TabBar 动画的 Demo 来让各人重新相识它。
开始利用

准备：新建 Xcode 项目

在 Xcode 11 情况下新建一个 Single View App 项目，打开这个新的项目，可以看到体系除了会自动天生 AppDelegate 文件外，还会自动天生一个名为 SceneDelegate 的类文件。

⚠️ SceneDelegate 是 iOS 13 下的新特性，检察 WWDC 2019: Optimizing App Launch 可以知道这到底是啥，但是 CYLTabBarController 还未适配该特性（截止 1.28.3 版本），基于 SceneDelegate 集成该框架应用会瓦解！以是我们要先把 SceneDelegate 特性删除才行。
步调：

起首打开 Info.plist 文件，找到下面这两个属性并删除。

删除 SceneDelegate 类文件，着实可删可不删，但既然我们用不到就删了吧。
修改 AppDelegate.h 文件，加上 UIWindow 属性。

#import <UIKit/UIKit.h>@interface AppDelegate : UIResponder <UIApplicationDelegate>@property (strong, nonatomic) UIWindow * window;@end

修改 AppDelegate.m 文件，设置 UIWindow 设置主窗口，并删除多余的 <UISceneSession> 署理协议。

#import "AppDelegate.h"#import "ViewController.h"@interface AppDelegate ()@end@implementation AppDelegate- (BOOL)application

UIApplication *)application didFinishLaunchingWithOptions

NSDictionary *)launchOptions { self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; // 设置根视图控制器 ViewController *controller = [[ViewController alloc] init]; // 窗口根视图控制器 self.window.rootViewController = controller; self.window.backgroundColor = [UIColor whiteColor]; [self.window makeKeyAndVisible]; return YES;}// 下面多余的代码请删除@end运行项目，无报错则继承往下。
第一步：利用 CocoaPods 导入 CYLTabBarController

可以很本心的说，README.md 文档中在第一步利用 CocoaPods 导入 CYLTabBarController 一章算是形貌地最详尽的了，它居然还教你怎样安装 CocoaPods，堪比 CocoaPods 情况搭建教程了。
但是，有一点必要提示的是，安装 CocoaPods 请勿利用 sudo gem install cocoapods 这个下令，如果运行该下令提示存在权限题目：
# 错误示例$ sudo gem install cocoapodsPassword:Fetching cocoapods-1.8.4.gemFetching cocoapods-core-1.8.4.gemSuccessfully installed cocoapods-core-1.8.4ERROR: While executing gem ... (Gem::FilePermissionError) You don't have write permissions for the /usr/bin directory.# Mac OS 体系升级之后，体系把 /usr/bin 目次的写入权限禁用了，因此我们必要指定安装到别的目次下。# 正确示例，必要安装 cocoapods 到指定目次下$ sudo gem install cocoapods -n /usr/local/binSuccessfully installed cocoapods-1.8.4Parsing documentation for cocoapods-1.8.4Installing ri documentation for cocoapods-1.8.4Done installing documentation for cocoapods after 2 seconds1 gem installed别的，Podfile 示例文件如下：
# Uncomment the next line to define a global platform for your projectplatform :ios, '9.0'target 'CYLTabBarControllerDemo' do # Comment the next line if you don't want to use dynamic frameworks # use_frameworks! # Pods for CYLTabBarControllerDemo pod 'CYLTabBarController', '~> 1.28.3' # 默认不依赖Lottie pod 'CYLTabBarController/Lottie', '~> 1.28.1' # 依赖Lottie库 pod 'ChameleonFramework' # 颜色框架 pod 'YYKit' # 会用到几个辅助方法end第二步：新建 AppDelegate 分类文件，初始化并设置 CYLTabBarController

如果你检察 CYLTabBarController 框架的 README.md 文档，作者会让你把许多设置方法写在 AppDelegate 这个类中。
但现实应用场景中，有许多设置方法都要写在这个文件里面，比如日志框架的设置、推送关照框架、第三方付出回调设置...另有一大堆工具类设置。
以是我风俗上会把差异的设置文件单独写在各自的分类（Category）中。
具体缘故原由可以去看看《Effective Objective-C 2.0 编写高质量 iOS 与 OS X 代码的 52 个有效方法》一书中的第 24 条发起。
因此，我们必要新建一个 AppDelegate 分类文件，然后把全部与初始化 CYLTabBarController 框架相干的代码都写在 AppDelegate+CYLTabBar 文件里面，保持代码整洁，方便修改。

新建一个 AppDelegate 分类文件。
点击 Xcode 导航栏 — File — New — File...— 选择 iOS Source 列表下的「Objective-C File」，新建文件范例和文件名如下：
在 Assets.xcassets 资产库中导入你所必要的图片文件。
在分类中新建一个方法，用于设置主窗口：

#import "AppDelegate.h"NS_ASSUME_NONNULL_BEGIN/// 这是 AppDelegate 的分类，用于设置 CYLTabBarController@interface AppDelegate (CYLTabBar)/// 设置主窗口- (void)hql_configureForTabBarController;@endNS_ASSUME_NONNULL_END然后我们在 .m 文件中实现它，设置 CYLTabBarController 的两个数组：控制器数组和设置 tabBar 外观样式的属性数组：
@implementation AppDelegate (CYLTabBar)#pragma mark - Public- (void)hql_configureForTabBarController { // 设置主窗口，并设置根视图控制器 self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; self.window.backgroundColor = [UIColor whiteColor]; [self.window makeKeyAndVisible]; // 初始化 CYLTabBarController 对象 CYLTabBarController *tabBarController = [CYLTabBarController tabBarControllerWithViewControllers:[self viewControllers] tabBarItemsAttributes:[self tabBarItemsAttributes]]; // 设置服从委托协议 tabBarController.delegate = self; // 将 CYLTabBarController 设置为 window 的 RootViewController self.window.rootViewController = tabBarController;}#pragma mark - Private/// 控制器数组- (NSArray *)viewControllers { // 首页 HomeViewController *homeVC = [[HomeViewController alloc] init]; homeVC.navigationItem.title = @"首页"; CYLBaseNavigationController *homeNC = [[CYLBaseNavigationController alloc] initWithRootViewController:homeVC]; [homeNC cyl_setHideNavigationBarSeparator:YES]; // 同城 MyCityViewController *myCityVC = [[MyCityViewController alloc] init]; myCityVC.navigationItem.title = @"同城"; CYLBaseNavigationController *myCityNC = [[CYLBaseNavigationController alloc] initWithRootViewController:myCityVC]; [myCityNC cyl_setHideNavigationBarSeparator:YES]; // 消息 MessageViewController *messageVC = [[MessageViewController alloc] init]; messageVC.navigationItem.title = @"消息"; CYLBaseNavigationController *messageNC = [[CYLBaseNavigationController alloc] initWithRootViewController:messageVC]; [messageNC cyl_setHideNavigationBarSeparator:YES]; // 我的 AccountViewController *accountVC = [[AccountViewController alloc] init]; accountVC.navigationItem.title = @"我的"; CYLBaseNavigationController *accountNC = [[CYLBaseNavigationController alloc] initWithRootViewController:accountVC]; [accountNC cyl_setHideNavigationBarSeparator:YES]; NSArray *viewControllersArray = @[homeNC, myCityNC, messageNC, accountNC]; return viewControllersArray;}/// tabBar 属性数组- (NSArray *)tabBarItemsAttributes { NSDictionary *homeTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"首页", CYLTabBarItemImage: @"home_normal", CYLTabBarItemSelectedImage: @"home_highlight", }; NSDictionary *myCityTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"同城", CYLTabBarItemImage: @"mycity_normal", CYLTabBarItemSelectedImage: @"mycity_highlight", }; NSDictionary *messageTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"消息", CYLTabBarItemImage: @"message_normal", CYLTabBarItemSelectedImage: @"message_highlight", }; NSDictionary *accountTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"我的", CYLTabBarItemImage: @"account_normal", CYLTabBarItemSelectedImage: @"account_highlight", }; NSArray *tabBarItemsAttributes = @[ homeTabBarItemsAttributes, myCityTabBarItemsAttributes, messageTabBarItemsAttributes, accountTabBarItemsAttributes ]; return tabBarItemsAttributes;}@end

末了，我们回到 AppDelegate.m 文件，导入上一步新建的分类头文件 :

#import "AppDelegate+CYLTabBar.h"

然后一行代码调用设置主窗口的方法：

#import "AppDelegate.h"#import "AppDelegate+CYLTabBar.h" // 导入的分类文件@implementation AppDelegate- (BOOL)application

UIApplication *)application didFinishLaunchingWithOptions

NSDictionary *)launchOptions { // 调用分类文件中的设置主窗口方法： [self hql_configureForTabBarController]; return YES;}@end

至此，常见的带 4 个 TabBarItem 的应用框架就搭建好啦：

小结：将 CYLTabBarController 实例化为窗口的根视图控制器即可。
第三步：添加不规则加号按钮

创建一个继承自 CYLPlusButton 的子类对象 CYLPlusButtonSubclass。
CYLPlusButtonSubclass.h 声明服从 <CYLPlusButtonSubclassing> 协议

#import "CYLPlusButton.h"NS_ASSUME_NONNULL_BEGIN@interface CYLPlusButtonSubclass : CYLPlusButton <CYLPlusButtonSubclassing>@endNS_ASSUME_NONNULL_ENDCYLPlusButtonSubclass.m 中实现创建按钮的方法和服从的协议方法

#import "CYLPlusButtonSubclass.h"@implementation CYLPlusButtonSubclass#pragma mark - Lifecycle- (instancetype)initWithFrame

CGRect)frame { if (self = [super initWithFrame:frame]) { self.titleLabel.textAlignment = NSTextAlignmentCenter; self.adjustsImageWhenHighlighted = NO; } return self;}//上下布局的 button- (void)layoutSubviews { [super layoutSubviews]; // 控件巨细,间距巨细 // 注意：肯定要根据项目中的图片去调解下面的0.7和0.9，Demo之以是这么设置，由于demo中的 plusButton 的 icon 不是正方形。 CGFloat const imageViewEdgeWidth = self.bounds.size.width * 0.7; CGFloat const imageViewEdgeHeight = imageViewEdgeWidth; CGFloat const centerOfView = self.bounds.size.width * 0.5; CGFloat const labelLineHeight = self.titleLabel.font.lineHeight; CGFloat const verticalMargin = (self.bounds.size.height - labelLineHeight - imageViewEdgeHeight) * 0.5; // imageView 和 titleLabel 中心的 Y 值 CGFloat const centerOfImageView = verticalMargin + imageViewEdgeHeight * 0.5; CGFloat const centerOfTitleLabel = imageViewEdgeHeight + verticalMargin * 2 + labelLineHeight * 0.5 - 1; //imageView position 位置 self.imageView.bounds = CGRectMake(0, 0, imageViewEdgeWidth, imageViewEdgeHeight); self.imageView.center = CGPointMake(centerOfView, centerOfImageView); //title position 位置 self.titleLabel.bounds = CGRectMake(0, 0, self.bounds.size.width, labelLineHeight); self.titleLabel.center = CGPointMake(centerOfView, centerOfTitleLabel);}#pragma mark - IBActions- (void)clickPublish { // 如果按钮的作用是触发点击变乱，则调用此方法}#pragma mark - CYLPlusButtonSubclassing+ (id)plusButton { CYLPlusButtonSubclass *button = [CYLPlusButtonSubclass buttonWithType:UIButtonTypeCustom]; // 图片尺寸：56*56、67*66、49*48（凸出 15） UIImage *normalButtonImage = [UIImage imageNamed

"post_normal"]; UIImage *hlightButtonImage = [UIImage imageNamed

"post_highlight"]; [button setImage:normalButtonImage forState:UIControlStateNormal]; [button setImage:hlightButtonImage forState:UIControlStateHighlighted]; [button setImage:hlightButtonImage forState:UIControlStateSelected]; // 设置配景图片// UIImage *normalButtonBackImage = [UIImage imageNamed

"tabBar_post_back"];// [button setBackgroundImage:normalButtonBackImage forState:UIControlStateNormal];// [button setBackgroundImage:normalButtonBackImage forState:UIControlStateSelected]; // 按钮图片间隔上边距增长 5，即向下偏移，按钮图片间隔下边距淘汰 5，即向下偏移。 //button.imageEdgeInsets = UIEdgeInsetsMake(5, 0, -5, 0); [button setTitle

"发布" forState:UIControlStateNormal]; [button setTitleColor:[UIColor grayColor] forState:UIControlStateNormal]; button.titleLabel.font = [UIFont systemFontOfSize:10 weight:UIFontWeightBold]; [button sizeToFit]; // or set frame in this way `button.frame = CGRectMake(0.0, 0.0, 250, 100);` //自界说宽度 button.frame = CGRectMake(0.0, 0.0, 59, 59); // button.backgroundColor = [UIColor redColor]; // if you use `+plusChildViewController` , do not addTarget to plusButton. // [button addTarget:button action

selector(clickPublish) forControlEvents:UIControlEventTouchUpInside]; return button;}// 用来自界说加号按钮的位置，如果不实现默认居中。+ (NSUInteger)indexOfPlusButtonInTabBar { return 2;}// 实现该方法后，能让 PlusButton 的点击结果与跟点击其他 TabBar 按钮结果一样，跳转到该方法指定的 UIViewController+ (UIViewController *)plusChildViewController { UIViewController *v = [[UIViewController alloc] init]; return v;}// 该方法是为了调解 PlusButton 中心点Y轴方向的位置，发起在按钮超出了 tabbar 的边界时实现该方法。// 返回值是自界说按钮中心点 Y 轴方向的坐标除以 tabbar 的高度，小于 0.5 表现 PlusButton 偏上，大于 0.5 则表现偏下。// PlusButtonCenterY = multiplierOfTabBarHeight * tabBarHeight + constantOfPlusButtonCenterYOffset;+ (CGFloat)multiplierOfTabBarHeight

CGFloat)tabBarHeight { return 0.3;}// constantOfPlusButtonCenterYOffset 大于 0 会向下偏移，小于 0 会向上偏移。+ (CGFloat)constantOfPlusButtonCenterYOffsetForTabBarHeight

CGFloat)tabBarHeight { return (CYL_IS_IPHONE_X ? - 6 : 4);}@end在 AppDelegate+CYLTabBar.m 中注册该按钮

在初始化 CYLTabBarController 对象步调之前注册按钮：
- (void)hql_configureForTabBarController { // 设置主窗口，并设置根视图控制器 self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; self.window.backgroundColor = [UIColor whiteColor]; [self.window makeKeyAndVisible]; // ??? 注册加号按钮 [CYLPlusButtonSubclass registerPlusButton]; // 初始化 CYLTabBarController 对象 CYLTabBarController *tabBarController = [CYLTabBarController tabBarControllerWithViewControllers:[self viewControllers] tabBarItemsAttributes:[self tabBarItemsAttributes]]; // 设置服从委托协议 tabBarController.delegate = self; self.window.rootViewController = tabBarController;}自此，加号按钮也添加完成啦。

第四步：设置自界说 TabBar 样式

自界说 TabBar 字体、配景、阴影。
在 AppDelegate+CYLTabBar.m 文件中新增一个方法，用于设置 TabBar 样式：
/// 自界说 TabBar 字体、配景、阴影- (void)customizeTabBarInterface { // 设置笔墨属性 if (@available(iOS 10.0, *)) { [self cyl_tabBarController].tabBar.unselectedItemTintColor = [UIColor cyl_systemGrayColor]; [self cyl_tabBarController].tabBar.tintColor = [UIColor cyl_labelColor]; } else { UITabBarItem *tabBar = [UITabBarItem appearance]; // 平常状态下的笔墨属性 [tabBar setTitleTextAttributes

{NSForegroundColorAttributeName: [UIColor cyl_systemGrayColor]} forState:UIControlStateNormal]; // 选中状态下的笔墨属性 [tabBar setTitleTextAttributes

{NSForegroundColorAttributeName: [UIColor cyl_labelColor]} forState:UIControlStateSelected]; } // 设置 TabBar 配景颜色：白色 // ?[UIImage imageWithColor] 表现根据指定颜色天生图片，该方法来自 <YYKit> 框架 [[UITabBar appearance] setBackgroundImage:[UIImage imageWithColor:[UIColor whiteColor]]]; // 去除 TabBar 自带的顶部阴影 [[self cyl_tabBarController] hideTabBarShadowImageView]; // 设置 TabBar 阴影，无效 // [[UITabBar appearance] setShadowImage:[UIImage imageNamed

"tabBar_background_shadow"]]; // 设置 TabBar 阴影 CYLTabBarController *tabBarController = [self cyl_tabBarController]; tabBarController.tabBar.layer.shadowColor = [UIColor blackColor].CGColor; tabBarController.tabBar.layer.shadowRadius = 15.0; tabBarController.tabBar.layer.shadowOpacity = 0.2; tabBarController.tabBar.layer.shadowOffset = CGSizeMake(0, 3); tabBarController.tabBar.layer.masksToBounds = NO; tabBarController.tabBar.clipsToBounds = NO;}然后在该文件的设置方法中调用：
- (void)hql_configureForTabBarController { // 设置主窗口，并设置根视图控制器 self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; self.window.backgroundColor = [UIColor whiteColor]; [self.window makeKeyAndVisible]; // 注册加号按钮 [CYLPlusButtonSubclass registerPlusButton]; // 初始化 CYLTabBarController 对象 CYLTabBarController *tabBarController = [CYLTabBarController tabBarControllerWithViewControllers:[self viewControllers] tabBarItemsAttributes:[self tabBarItemsAttributes]]; // 设置服从委托协议 tabBarController.delegate = self; self.window.rootViewController = tabBarController; // ??? 自界说 TabBar 字体、配景、阴影 [self customizeTabBarInterface];}别的，不规则加号按钮的配景图片必要在 CYLPlusButtonSubclass.m 文件的 + (id)plusButton 中设置：
// 设置配景图片UIImage *normalButtonBackImage = [UIImage imageNamed

"tabBar_post_back"];[button setBackgroundImage:normalButtonBackImage forState:UIControlStateNormal];[button setBackgroundImage:normalButtonBackImage forState:UIControlStateSelected];下面是自界说后的 TabBar 样式示例：
第五步：添加点击旋转动画

当点击 TabBarItem 时，为它设置旋转动画，必要让 AppDelegate 服从 <CYLTabBarControllerDelegate, UITabBarControllerDelegate> 委托协议，以监听点击触发变乱：
// ??? 声明服从委托协议@interface AppDelegate () <CYLTabBarControllerDelegate, UITabBarControllerDelegate>@end@implementation AppDelegate (CYLTabBar)- (void)hql_configureForTabBarController { // 省略... // 初始化 CYLTabBarController 对象 CYLTabBarController *tabBarController = [CYLTabBarController tabBarControllerWithViewControllers:[self viewControllers] tabBarItemsAttributes:[self tabBarItemsAttributes]]; // ??? 设置让 AppDelegate 服从委托协议 tabBarController.delegate = self; self.window.rootViewController = tabBarController;}接下来是让 AppDelegate 实现委托协议方法，点击 TabBarItem 时触发旋转动画，点不规则加号按钮时触发放大动画：
- (BOOL)tabBarController

UITabBarController *)tabBarController shouldSelectViewController

UIViewController *)viewController { // 确保 PlusButton 的选中状态 [[self cyl_tabBarController] updateSelectionStatusIfNeededForTabBarController:tabBarController shouldSelectViewController:viewController]; return YES;}- (void)tabBarController

UITabBarController *)tabBarController didSelectControl:(UIControl *)control { UIView *animationView; NSLog(@"?\n 类名与方法名：%@，\n 第 %@ 行，\n description : %@，\n tabBarChildViewControllerIndex: %@， tabBarItemVisibleIndex : %@", @(__PRETTY_FUNCTION__), @(__LINE__), control, @(control.cyl_tabBarChildViewControllerIndex), @(control.cyl_tabBarItemVisibleIndex)); // 纵然 PlusButton 也添加了点击变乱，点击 PlusButton 后也会触发该署理方法。 if ([control cyl_isPlusButton]) { UIButton *button = CYLExternPlusButton; animationView = button.imageView; // 为加号按钮添加「缩放动画」 [self addScaleAnimationOnView:animationView repeatCount:1]; } else if ([control isKindOfClass:NSClassFromString(@"UITabBarButton")]) { for (UIView *subView in control.subviews) { if ([subView isKindOfClass:NSClassFromString(@"UITabBarSwappableImageView")]) { animationView = subView; // 为其他按钮添加「旋转动画」 [self addRotateAnimationOnView:animationView]; } } }}/// 缩放动画- (void)addScaleAnimationOnView:(UIView *)animationView repeatCount:(float)repeatCount { //必要实现的帧动画，这里根据需求自界说 CAKeyframeAnimation *animation = [CAKeyframeAnimation animation]; animation.keyPath = @"transform.scale"; animation.values = @[@1.0,@1.3,@0.9,@1.15,@0.95,@1.02,@1.0]; animation.duration = 0.5; animation.repeatCount = repeatCount; animation.calculationMode = kCAAnimationCubic; [animationView.layer addAnimation:animation forKey:nil];}/// 旋转动画- (void)addRotateAnimationOnView:(UIView *)animationView { [UIView animateWithDuration:0.32 delay:0 options:UIViewAnimationOptionCurveEaseIn animations:^{ animationView.layer.transform = CATransform3DMakeRotation(M_PI, 0, 1, 0); } completion:nil]; dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.2 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{ [UIView animateWithDuration:0.70 delay:0 usingSpringWithDamping:1 initialSpringVelocity:0.2 options:UIViewAnimationOptionCurveEaseOut animations:^{ animationView.layer.transform = CATransform3DMakeRotation(2 * M_PI, 0, 1, 0); } completion:nil]; });}实现结果：
第六步：添加 Lottie 动画

参考：https://github.com/ChenYilong/CYLTabBarController/issues/341
起首，为方便演示，我们从官方 Demo 中获取 Lottie 动画的 JSON 文件和相干资源文件。
然后，修改设置 tabBar 属性数组的方法 - (NSArray *)tabBarItemsAttributes，把 Lottie 文件的 URL 路径加上：
/* * tabBar 属性数组，带 Loggie 动画 * 参考：<https://github.com/ChenYilong/CYLTabBarController/issues/341> * * 与上面的设置相比，必要再多设置两个属性： * CYLTabBarLottieURL: 传入 lottie 动画 JSON 文件地点路径 * CYLTabBarLottieSize: LottieView 巨细，选填 * */- (NSArray *)tabBarItemsAttributes { NSDictionary *homeTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"首页", CYLTabBarLottieURL : [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource

"tab_home_animate" ofType:@"json"]], CYLTabBarLottieSize: [NSValue valueWithCGSize:CGSizeMake(33, 33)], }; NSDictionary *myCityTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"同城", CYLTabBarLottieURL : [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"tab_search_animate" ofType:@"json"]], CYLTabBarLottieSize: [NSValue valueWithCGSize:CGSizeMake(33, 33)], }; NSDictionary *messageTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"消息", CYLTabBarLottieURL : [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"tab_message_animate" ofType:@"json"]], CYLTabBarLottieSize: [NSValue valueWithCGSize:CGSizeMake(33, 33)], }; NSDictionary *accountTabBarItemsAttributes = @{ CYLTabBarItemTitle: @"我的", CYLTabBarLottieURL : [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"tab_me_animate" ofType:@"json"]], CYLTabBarLottieSize: [NSValue valueWithCGSize:CGSizeMake(33, 33)], }; NSArray *tabBarItemsAttributes = @[ homeTabBarItemsAttributes, myCityTabBarItemsAttributes, messageTabBarItemsAttributes, accountTabBarItemsAttributes ]; return tabBarItemsAttributes;}自此，我们通过 CYLTabBarController 框架实现了一个仿「闲鱼」TabBar 动画的应用。
Demo：HQLTableViewDemo
原文链接：https://www.jianshu.com/p/50735aa8a9f2

iOS tabbar动画-CYLTabBarController

所属分类: 问答交流

新帖推荐: 30日

推荐作品