IOS之自定义tabBar

目前主流app架构(只是大多数)

image.png

一般tabar设置的内容

image.png

常见的创建方式

方式一：

• 此处只是列出默认图片，如果需要选中图片，可以在方法中自己再添加。
• 优点：可以拿到对应的子控制器，进行单独定制操作、

- (void)addAllChildViewController {
    UIViewController *homeVC = [[UIViewController alloc] init];
    homeVC.view.backgroundColor = [UIColor redColor];
    [self addChildViewController:homeVC title:@"首页" imageNamed:@"tabBar_home"];
    
    UIViewController *activityVC = [[UIViewController alloc] init];
    activityVC.view.backgroundColor = [UIColor yellowColor];
    [self addChildViewController:activityVC title:@"活动" imageNamed:@"tabBar_activity"];
    
    UIViewController *findVC = [[UIViewController alloc] init];
    findVC.view.backgroundColor = [UIColor blueColor];
    [self addChildViewController:findVC title:@"发现" imageNamed:@"tabBar_find"];
    
    UIViewController *mineVC = [[UIViewController alloc] init];
    mineVC.view.backgroundColor = [UIColor greenColor];
    [self addChildViewController:mineVC title:@"我的" imageNamed:@"tabBar_mine"];
}

// 添加某个 childViewController
- (void)addChildViewController:(UIViewController *)vc title:(NSString *)title imageNamed:(NSString *)imageNamed {
    UINavigationController *nav = [[UINavigationController alloc] initWithRootViewController:vc];
    nav.tabBarItem.title = title;
    nav.tabBarItem.image = [UIImage imageNamed:imageNamed];
    
    [self addChildViewController:nav];
}

方式二：

• 对viewControllers属性数组进行设置，通过一个NSObject，对一些属性进行赋值、
• 缺点：不能对单个的子控制器进行操作
• 自定义tabbar 需要单独重新布局
  image.png
  Demo地址

导航标题的设置影响UItabBar的标题

在开发中，经常遇到tabbar标题和导航标题一样了，怎么回事？
当self.navigationItem.title，self.tabBarItem.title没有赋值情况下,其值和self.title一致(这句话还得区分场景)。

• self.title 在init中设置
  代码会先走init，此时再设置self.tabBarItem.title，就可以保证导航标题和底部tabbar标题不一致。
  或者直接设置self.navigationItem.title也可以到达此效果

• self.title 是否在viewDidload中设置
  会先走self.tabBarItem.title，后调用viewDidload,这样就会再次覆盖掉底部的标题

有一定经验的程序猿，一定会使用系统自己的tabbar，这样即使遇到了系统升级，一些坑点的时候，会很好处理。

比如：自定义特殊tabbar在iPhoneX上的适配问题

使用系统tabbar.png
自定义tabbar.png

当然有些项目肯定有些需要自定义，而且一些特殊的app是有很酷炫的动画效果，这里罗列一个demo

image.png
Demo

参考文章：
https://www.jianshu.com/p/a3002314db32
https://www.jianshu.com/p/914f3a568ec9
https://my.oschina.net/u/2340880/blog/
https://blog.csdn.net/Xia0Liang/article/details/50373603