[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 = 0;
   
    for (UIView *tabBarButton in self.subviews) {
        if ([tabBarButton isKindOfClass:NSClassFromString(@"UITabBarButton")]) {
            // 计算尺寸，预留一个“+”号空间
            CGFloat width = self.width / (self.items.count + 1);
            tabBarButton.width = width;
           
            // 计算位置
            if (index < (int)(self.items.count / 2)) {
                tabBarButton.x = width * index;
            } else {
                tabBarButton.x = width * (index + 1);
            }
           
            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 + 1);
    CGFloat height = self.height;
    CGFloat x = (self.items.count / 2) * width;
    CGFloat y = 0;
    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];
}