詳解iOS自定義UITabBar與布局

#import "XMGTabBarController.h"

@interface XMGTabBarController ()
/** 中間的發(fā)布按鈕 */
@property (nonatomic, strong) UIButton *publishButton;

@end

@implementation XMGTabBarController

#pragma mark - 初始化
- (void)viewDidLoad {
 [super viewDidLoad];
 
 /**** 設置所有UITabBarItem的文字屬性 ****/
 UITabBarItem *item = [UITabBarItem appearance];
 // 普通狀態(tài)下的文字屬性
 NSMutableDictionary *normalAttrs = [NSMutableDictionary dictionary];
 normalAttrs[NSFontAttributeName] = [UIFont systemFontOfSize:14];
 normalAttrs[NSForegroundColorAttributeName] = [UIColor grayColor];
 [item setTitleTextAttributes:normalAttrs forState:UIControlStateNormal];
 // 選中狀態(tài)下的文字屬性
 NSMutableDictionary *selectedAttrs = [NSMutableDictionary dictionary];
 selectedAttrs[NSForegroundColorAttributeName] = [UIColor darkGrayColor];
 [item setTitleTextAttributes:normalAttrs forState:UIControlStateSelected];
 
 /**** 添加子控制器 ****/
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"精華" image:@"tabBar_essence_icon" selectedImage:@"tabBar_essence_click_icon"];
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"新帖" image:@"tabBar_new_icon" selectedImage:@"tabBar_new_click_icon"];
 
 // 中間用來占位的子控制器
 [self setupOneChildViewController:[[UIViewController alloc] init] title:nil image:nil selectedImage:nil];
 
 [self setupOneChildViewController:[[UIViewController alloc] init] title:@"關(guān)注" image:@"tabBar_friendTrends_icon" selectedImage:@"tabBar_friendTrends_click_icon"];
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"我" image:@"tabBar_me_icon" selectedImage:@"tabBar_me_click_icon"];
}

/**
 * 為什么要在viewWillAppear:方法中添加發(fā)布按鈕?
 * 當viewWillAppear:方法被調(diào)用的時候, tabBar內(nèi)部已經(jīng)添加了5個UITabBarButton
 * 就可以實現(xiàn)一個效果 : [發(fā)布按鈕]蓋在其他UITabBarButton上面
 */
- (void)viewWillAppear:(BOOL)animated
{
 [super viewWillAppear:animated];
 
 /**** 增加一個發(fā)布按鈕 ****/
 [self.tabBar addSubview:self.publishButton];
}
#pragma mark - 懶加載
/** 發(fā)布按鈕 */
- (UIButton *)publishButton
{
 if (!_publishButton) {
 _publishButton = [UIButton buttonWithType:UIButtonTypeCustom];
 _publishButton.backgroundColor = XMGRandomColor;
 [_publishButton setImage:[UIImage imageNamed:@"tabBar_publish_icon"] forState:UIControlStateNormal];
 [_publishButton setImage:[UIImage imageNamed:@"tabBar_publish_click_icon"] forState:UIControlStateHighlighted];
 _publishButton.frame = CGRectMake(0, 0, self.tabBar.frame.size.width / 5, self.tabBar.frame.size.height);
 _publishButton.center = CGPointMake(self.tabBar.frame.size.width * 0.5, self.tabBar.frame.size.height * 0.5);
 [_publishButton addTarget:self action:@selector(publishClick) forControlEvents:UIControlEventTouchUpInside];
 }
 return _publishButton;
}
#pragma mark - 監(jiān)聽
/**
 * 發(fā)布按鈕點擊
 */
- (void)publishClick
{
 XMGLogFunc
 XMGTestViewController *test = [[XMGTestViewController alloc] init];
 [self presentViewController:test animated:YES completion:nil];
}
@end

@interface XMGTabBarController ()
@end

@implementation XMGTabBarController
#pragma mark - 初始化
- (void)viewDidLoad {
 [super viewDidLoad];
 
 /**** 設置所有UITabBarItem的文字屬性 ****/
 //省略
 
 /**** 添加子控制器 ****/
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"精華" image:@"tabBar_essence_icon" selectedImage:@"tabBar_essence_click_icon"];
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"新帖" image:@"tabBar_new_icon" selectedImage:@"tabBar_new_click_icon"];
 [self setupOneChildViewController:[[UIViewController alloc] init] title:@"關(guān)注" image:@"tabBar_friendTrends_icon" selectedImage:@"tabBar_friendTrends_click_icon"];
 [self setupOneChildViewController:[[UITableViewController alloc] init] title:@"我" image:@"tabBar_me_icon" selectedImage:@"tabBar_me_click_icon"];
 
 /**** 更換TabBar ****/
 [self setValue:[[XMGTabBar alloc] init] forKeyPath:@"tabBar"];
}
@end

#import "XMGTabBar.h"

@interface XMGTabBar()
/** 中間的發(fā)布按鈕 */
@property (nonatomic, weak) UIButton *publishButton;
@end

@implementation XMGTabBar

#pragma mark - 懶加載
/** 發(fā)布按鈕 */
- (UIButton *)publishButton
{
 if (!_publishButton) {
 UIButton *publishButton = [UIButton buttonWithType:UIButtonTypeCustom];
 publishButton.backgroundColor = XMGRandomColor;
 [publishButton setImage:[UIImage imageNamed:@"tabBar_publish_icon"] forState:UIControlStateNormal];
 [publishButton setImage:[UIImage imageNamed:@"tabBar_publish_click_icon"] forState:UIControlStateHighlighted];
 [publishButton addTarget:self action:@selector(publishClick) forControlEvents:UIControlEventTouchUpInside];
 [self addSubview:publishButton];
 _publishButton = publishButton;
 }
 return _publishButton;
}

#pragma mark - 初始化
/**
 * 布局子控件
 */
- (void)layoutSubviews
{
 [super layoutSubviews];
 
 /**** 設置所有UITabBarButton的frame ****/
 // 按鈕的尺寸
 CGFloat buttonW = self.frame.size.width / 5;
 CGFloat buttonH = self.frame.size.height;
 CGFloat buttonY = 0;
 // 按鈕索引
 int buttonIndex = 0;
 
 for (UIView *subview in self.subviews) {
 // 過濾掉非UITabBarButton
// if (![@"UITabBarButton" isEqualToString:NSStringFromClass(subview.class)]) continue;
 if (subview.class != NSClassFromString(@"UITabBarButton")) continue;
 
 // 設置frame
 CGFloat buttonX = buttonIndex * buttonW;
 if (buttonIndex >= 2) { // 右邊的2個UITabBarButton
 buttonX += buttonW;
 }
 subview.frame = CGRectMake(buttonX, buttonY, buttonW, buttonH);
 
 // 增加索引
 buttonIndex++;
 }
 
 /**** 設置中間的發(fā)布按鈕的frame ****/
 self.publishButton.frame = CGRectMake(0, 0, buttonW, buttonH);
 self.publishButton.center = CGPointMake(self.frame.size.width * 0.5, self.frame.size.height * 0.5);
}

#pragma mark - 監(jiān)聽
- (void)publishClick
{
 XMGLogFunc
}
@end