产品:" tabBar 上要6个标签栏"
"iOS 官方设置,最多有5个.而且6个用户体验不太好"
"安卓那边可以,你跟进一下"
so,你需要自定义 tabBar
设置类似于微博的 tabBar
- 自定义 tabBarController ,定义4个VC,添加到 tabBarController 中
- (void)creatAddVC:(UIViewController *)vc title:(NSString *)title imgName:(NSString *)imgName{
vc.title = title;
vc.tabBarItem.image = [[UIImage imageNamed:imgName]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
NSString *selImgName = [NSString stringWithFormat:@"%@_sel",imgName];
vc.tabBarItem.selectedImage = [[UIImage imageNamed:selImgName]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal
];
UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:vc];
[self addChildViewController:nav];
}
- 自定义一个继承自 UITabBar 的 TabBar,通过KVC,将该自定义的 tabBar 设置为 tabBarController 的 tabBar
// 将代码放在 viewDidLoad中
UIViewController *vc4 = [UIViewController new];
vc4.view.backgroundColor = [UIColor purpleColor];
[self creatAddVC:vc4 title:@"我" imgName:@"me"];
HSTabBar *customTabBar = [HSTabBar new];
customTabBar.delegate = self;
// KVC
[self setValue:customTabBar forKeyPath:@"tabBar"];
- 在自定义的 tabBar 加入一个额外的加号按钮,并对 tabBarItem和加号按钮重新布局
// layoutsubViews中重新布局,并添加'+'按钮,
- (void)layoutSubviews{
[super layoutSubviews];
CGFloat width = self.frame.size.width / 5.0;
CGFloat height = self.frame.size.height;
int idx = 0;
for (UIView *subView in self.subviews) {
if (subView.class != NSClassFromString(@"UITabBarButton")) {
continue;
}
if (idx <2) {
subView.frame = CGRectMake(width * idx, 0, width, height);
}else if(idx >= 2){
subView.frame = CGRectMake(width * idx + width, 0, width, height);
}
idx++;
}
UIButton *addBtn = [UIButton new];
[addBtn setImage:[UIImage imageNamed:@"add"] forState:UIControlStateNormal];
[addBtn setImage:[UIImage imageNamed:@"add"] forState:UIControlStateHighlighted];
[addBtn addTarget:self action:@selector(addClick) forControlEvents:UIControlEventTouchUpInside];
[self addSubview:addBtn];
addBtn.frame = CGRectMake(width * 2, 0, width, height);
}
// 这里使用代理进行点击回调
- (void)addClick{
if ([self.delegate respondsToSelector:@selector(click2Add)]) {
[self.delegate click2Add];
}
}
含有6个标签的 tabBar
用上述的方法确实可以实现一些自定义 tabBar 的需求,但是受限与苹果方法的限制,这还不能显示标签,无法达到产品的需求.所以,上述办法不可用.这里介绍另一个简单的方法方法:
- 写一个自定义的tabBarController ,添加6个 VC
_vcArr = @[vc1 , vc2, vc3, vc4, vc5, vc6];
for (UIViewController *vc in _vcArr) {
UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:vc];
[self addChildViewController:nav];
}
self.selectedIndex = 0;
- 定一个继承自 UIView 的 tabBarView,将这个 tabBarView 添加到自定义的 tabBarController 上
SSBarView *barView = [[SSBarView alloc]initWithFrame:self.tabBar.bounds];
self.barView = barView;
[self.tabBar addSubview:barView];
barView.delegate = self;
- 在定义的 tabBarView 中,设置6个按钮,按照要求布局好
- (void)creatUI{
self.userInteractionEnabled = YES;
self.backgroundColor = [UIColor orangeColor];
NSArray *arr = @[@"我", @"是", @"中", @"国", @"人", @"民"];
CGFloat btnW = self.frame.size.width / arr.count;
CGFloat btnH = self.frame.size.height;
for (NSString *text in arr) {
NSUInteger idx = [arr indexOfObject:text];
UIButton *btn = [UIButton new];
[self addSubview:btn];
btn.frame = CGRectMake(btnW * idx, 0, btnW, btnH);
btn.tag = tagId + idx;
[btn setTitle:text forState:UIControlStateNormal];
[btn setTitle:text forState:UIControlStateSelected];
[btn addTarget:self action:@selector(clickBtn:) forControlEvents:UIControlEventTouchUpInside];
[self.btnArr addObject:btn];
}
}
- 通过代理或者 block 回调,在点击某个按钮的时候,tabBarController 切换不同的 selectedIndex
// BarView 的代理
- (void)click2GetIndex:(int)index{
self.selectedIndex = index;
}
具体的请参考:demo
