iOS-修改系统 TabbarItem 图片、文字颜色

2016-07-09 本文已影响6934人一位不愿透露姓名的王先生_

一、系统 Tabbar 默认颜色（如下图）：

TabbarItem默认渲染颜色.png

代码详见（如下）：

- (void)viewDidLoad {
    [super viewDidLoad];

    HQHomeController *vcHome = [[HQHomeController alloc] init];
    HQHomeNavigationController *navHome = [[HQHomeNavigationController alloc] initWithRootViewController:vcHome];
    vcHome.title = @"首页";
    vcHome.tabBarItem.image = [UIImage imageNamed:@"tabbar_home"];

    HQCourseController *vcCourse = [[HQCourseController alloc] init];
    HQCourseNavigationController *navCourse = [[HQCourseNavigationController alloc] initWithRootViewController:vcCourse];
    vcCourse.title = @"健康课程";
    vcCourse.tabBarItem.image = [UIImage imageNamed:@"tabbar_message_center_highlighted"];

    HQConsultController *vcConsult = [[HQConsultController alloc] init];
    HQConsultNavigationController *navConsult = [[HQConsultNavigationController alloc] initWithRootViewController:vcConsult];
    vcConsult.title = @"线上资讯";
    vcConsult.tabBarItem.image = [UIImage imageNamed:@"tabbar_discover"];

    HQProfileController *vcProfile = [[HQProfileController alloc] init];
    HQProfileNavigationController *navProfile = [[HQProfileNavigationController alloc] initWithRootViewController:vcProfile];
    vcProfile.title = @"个人中心";
    vcProfile.tabBarItem.image = [UIImage imageNamed:@"tabbar_profile"];

    self.viewControllers = @[navHome, navCourse, navConsult, navProfile];
}

设置 tabbarItem 图片（显示图片原始颜色，不让系统渲染成蓝色）如（如下图）：

没有被系统tabbar渲染的图片.png

代码详见（如下）：

    HQHomeController *vcHome = [[HQHomeController alloc] init];
    HQHomeNavigationController *navHome = [[HQHomeNavigationController alloc] initWithRootViewController:vcHome];
    vcHome.title = @"首页";
    vcHome.tabBarItem.image = [UIImage imageNamed:@"tabbar_home"];

    // 设置 tabbarItem 选中状态的图片(不被系统默认渲染,显示图像原始颜色)
    UIImage *imageHome = [UIImage imageNamed:@"tabbar_home_highlighted"];
    imageHome = [imageHome imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    [vcHome.tabBarItem setSelectedImage:imageHome];

设置 tabbarItem 文字（显示自定义文字颜色，不让系统渲染成蓝色）如（如下图）：

没有被系统tabbar渲染的文字.png

代码详见（如下）：

    HQHomeController *vcHome = [[HQHomeController alloc] init];
    HQHomeNavigationController *navHome = [[HQHomeNavigationController alloc] initWithRootViewController:vcHome];
    vcHome.title = @"首页";
    vcHome.tabBarItem.image = [UIImage imageNamed:@"tabbar_home"];
    
    // 设置 tabbarItem 选中状态的图片(不被系统默认渲染,显示图像原始颜色)
    UIImage *imageHome = [UIImage imageNamed:@"tabbar_home_highlighted"];
    imageHome = [imageHome imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    [vcHome.tabBarItem setSelectedImage:imageHome];
    
    // 设置 tabbarItem 选中状态下的文字颜色(不被系统默认渲染,显示文字自定义颜色)
    NSDictionary *dictHome = [NSDictionary dictionaryWithObject:[UIColor orangeColor] forKey:NSForegroundColorAttributeName];
    [vcHome.tabBarItem setTitleTextAttributes:dictHome forState:UIControlStateSelected];

简单的封装下（详见代码）：

抽取成一个方法

传入控制器、标题、正常状态下图片、选中状态下图片

直接调用这个方法就可以了

 /**
  * 抽取成一个方法
  * 传入控制器、标题、正常状态下图片、选中状态下图片
  * 直接调用这个方法就可以了
  */
 - (void)controller:(UIViewController *)controller Title:(NSString *)title tabBarItemImage:(NSString *)image tabBarItemSelectedImage:(NSString *)selectedImage
 {
     controller.title = title;
     controller.tabBarItem.image = [UIImage imageNamed:image];
     // 设置 tabbarItem 选中状态的图片(不被系统默认渲染,显示图像原始颜色)
     UIImage *imageHome = [UIImage imageNamed:selectedImage];
     imageHome = [imageHome imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
     [controller.tabBarItem setSelectedImage:imageHome];
     // 设置 tabbarItem 选中状态下的文字颜色(不被系统默认渲染,显示文字自定义颜色)
     NSDictionary *dictHome = [NSDictionary dictionaryWithObject:[UIColor orangeColor] forKey:NSForegroundColorAttributeName];
     [controller.tabBarItem setTitleTextAttributes:dictHome forState:UIControlStateSelected];
 }

回到刚才位置调用一下：

    HQHomeController *vcHome = [[HQHomeController alloc] init];
    HQHomeNavigationController *navHome = [[HQHomeNavigationController alloc] initWithRootViewController:vcHome];
    // 下面注释的代码用这一行就可以替代了
    [self controller:vcHome Title:@"首页" tabBarItemImage:@"tabbar_home" tabBarItemSelectedImage:@"tabbar_home_highlighted"];
    
//    vcHome.title = @"首页";
//    vcHome.tabBarItem.image = [UIImage imageNamed:@"tabbar_home"];
//    
//    // 设置 tabbarItem 选中状态的图片(不被系统默认渲染,显示图像原始颜色)
//    UIImage *imageHome = [UIImage imageNamed:@"tabbar_home_highlighted"];
//    imageHome = [imageHome imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
//    [vcHome.tabBarItem setSelectedImage:imageHome];
//    
//    // 设置 tabbarItem 选中状态下的文字颜色(不被系统默认渲染,显示文字自定义颜色)
//    NSDictionary *dictHome = [NSDictionary dictionaryWithObject:[UIColor orangeColor] forKey:NSForegroundColorAttributeName];
//    [vcHome.tabBarItem setTitleTextAttributes:dictHome forState:UIControlStateSelected];