[iOS微博项目 - 1.6] - 自定义TabBar

A.自定义TabBar

1.需求

控制TabBar内的item的文本颜色（普通状态、被选中状态要和图标一致）、背景（普通状态、被选中状态均为透明）

重新设置TabBar内的item位置，为下一步在TabBar中部添加“+”按钮做准备

github: https://github.com/hellovoidworld/HVWWeibo

 

系统默认样式：

• 选中时item字体颜色为蓝色

 

 

完成之后的样式：

 

 

2.思路

封装TabBar，继承UITabBar，重写有关TabBar内部控件的位置设置方法

使用KVC重设UITabBarController中的tabBar成员（因为UITabBarController中的tabBar是只读的，KVC能够直接修改_tabBar）

修改UITabBar的item属性，修改字体（普通、被选中状态）

 

3.实现探索

（1）修改item的字体颜色

设置UITabBar的代理，监听item选中事件，更改item的字体属性

 - (void)viewDidAppear:(BOOL)animated {
     NSMutableDictionary *attr = [NSMutableDictionary dictionary];
     attr[NSForegroundColorAttributeName] = [UIColor orangeColor];

     for (UITabBarItem *item in self.tabBar.items) {
         [item setTitleTextAttributes:attr forState:UIControlStateSelected];
     }
 }

 

 

#mark: 注意，TabBarItem相当于模型数据，TabBar才是view

 

（2）自定义一个集成UITabBar的类，用来封装定制tabBar

• 封装上述的改变TabBarButton文本颜色的代码
• 重写TabBarButton的位置尺寸，中间空出一个位置放置“+”按钮

 

 //
 //  HVWTabBar.m
 //  HVWWeibo
 //
 //  Created by hellovoidworld on 15/2/3.
 //  Copyright (c) 2015年 hellovoidworld. All rights reserved.
 //

 #import "HVWTabBar.h"

 @implementation HVWTabBar

 - (void)layoutSubviews {
     // 切记一定要调用父类的方法!!!
     [super layoutSubviews];

     // 设置文本属性
     [self initTextAttr];

     // 设置BarButton的位置
     [self initBarButtonPosition];

     // 添加"+"按钮
     [self addComposeButton];
 }

 /** 设置文本属性 */
 - (void) initTextAttr {
     NSMutableDictionary *attr = [NSMutableDictionary dictionary];
     attr[NSForegroundColorAttributeName] = [UIColor orangeColor];

     for (UITabBarItem *item in self.items) {
         // 设置字体颜色
         [item setTitleTextAttributes:attr forState:UIControlStateSelected];
     }
 }

 /** 设置BarButton的位置 */
 - (void) initBarButtonPosition {

     // 创建一个位置所以，用来定位
     int index = ;

     for (UIView *tabBarButton in self.subviews) {
         if ([tabBarButton isKindOfClass:NSClassFromString(@"UITabBarButton")]) {
             // 计算尺寸，预留一个“+”号空间
             CGFloat width = self.width / (self.items.count + );
             tabBarButton.width = width;

             // 计算位置
             if (index < (int)(self.items.count / )) {
                 tabBarButton.x = width * index;
             } else {
                 tabBarButton.x = width * (index + );
             }

             index++;
         }
     }
 }

 /** 添加"+"按钮 */
 - (void) addComposeButton {
     // 初始化按钮
     UIButton *plusButton = [UIButton buttonWithType:UIButtonTypeCustom];
     [plusButton setBackgroundImage:[UIImage imageWithNamed:@"tabbar_compose_button"] forState:UIControlStateNormal];
     [plusButton setBackgroundImage:[UIImage imageWithNamed:@"tabbar_compose_button_highlighted"] forState:UIControlStateHighlighted];
     [plusButton setImage:[UIImage imageWithNamed:@"tabbar_compose_icon_add"] forState:UIControlStateNormal];
     [plusButton setImage:[UIImage imageWithNamed:@"tabbar_compose_icon_add_highlighted"] forState:UIControlStateHighlighted];

     // 设置位置尺寸
     CGFloat width = self.width / (self.items.count + );
     CGFloat height = self.height;
     CGFloat x = (self.items.count / ) * width;
     CGFloat y = ;
     plusButton.frame = CGRectMake(x, y, width, height);

     // 添加到tabBar上
     [self addSubview:plusButton];
 }

 @end

 

 

 

（3）"+"按钮点击事件

• 弹出一个新的界面用来写新微博
• 新建一个目录“compose”专门负责发微博业务
• 创建一个集成UIViewController的HVWComposeViewController

 

 //
 //  HVWComposeViewController.m
 //  HVWWeibo
 //
 //  Created by hellovoidworld on 15/2/3.
 //  Copyright (c) 2015年 hellovoidworld. All rights reserved.
 //

 #import "HVWComposeViewController.h"

 @interface HVWComposeViewController ()

 @end

 @implementation HVWComposeViewController

 - (void)viewDidLoad {
     [super viewDidLoad];
     // Do any additional setup after loading the view.

     // 初始化一些功能按钮
     self.view.backgroundColor = [UIColor redColor];
     self.title = @"+号弹出控制器";

     self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"退出" style:UIBarButtonItemStylePlain target:self action:@selector(dismiss)];
 }

 - (void) dismiss {
     [self dismissViewControllerAnimated:YES completion:nil];

 }

 @end

 

 

点击“+”方法：

 //  HVWTabBarViewController.m
 #pragma mark - HVWTabBarDelegate
 /** “+”按钮点击代理方法 */
 - (void)tabBarDidComposeButtonClick:(HVWTabBar *)tabBar {
     HVWComposeViewController *composeView = [[HVWComposeViewController alloc] init];

     // tabBarController不是由navigationController弹出来的，没有navigationController
 //    [self.navigationController pushViewController:vc animated:YES];
 //    HVWLog(@"%@", self.navigationController); // null

     // 为了使用导航栏，使用NavigationController包装一下
     HVWNavigationViewController *nav = [[HVWNavigationViewController alloc] initWithRootViewController:composeView];
     // 使用modal方式弹出
     [self presentViewController:nav animated:YES completion:nil];
 }