未选择的UITabBar颜色?

use*_*090 55 uitabbar ios

我有一个UITabBar有5个项目.我想更改所有项目的未选择颜色.这些项未在UIViewController类中声明(我构建它们并链接Storyboard中的视图).

有这样的代码:[[UITabBar appearance] set***UN***SelectedImageTintColor:[UIColor whiteColor]];

Sve*_*ffe 96

据我所知,这在iOS 7下无效.特别是,选项卡栏的tintColor将定义所选选项卡的颜色,而不是未选定选项卡的颜色.如果要更改iOS 7中的默认值,您似乎必须实际使用不同的图标(以您希望的颜色用于未选择的选项卡)并设置文本的颜色.

此示例应将选定的选项卡着色为红色,并将其他选项卡设置为绿色.在TabBarController中运行此代码:

// set color of selected icons and text to red
self.tabBar.tintColor = [UIColor redColor];
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys: [UIColor redColor], NSForegroundColorAttributeName, nil] forState:UIControlStateSelected];


// set color of unselected text to green
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor greenColor], NSForegroundColorAttributeName, nil]
                                         forState:UIControlStateNormal];

// set selected and unselected icons
UITabBarItem *item0 = [self.tabBar.items objectAtIndex:0];

// this way, the icon gets rendered as it is (thus, it needs to be green in this example)
item0.image = [[UIImage imageNamed:@"unselected-icon.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

// this icon is used for selected tab and it will get tinted as defined in self.tabBar.tintColor
item0.selectedImage = [UIImage imageNamed:@"selected-icon.png"];
Run Code Online (Sandbox Code Playgroud)

如果仅在故事板中设置图标,则只能控制所选选项卡的颜色(tintColor).所有其他图标和相应的文本将以灰色绘制.

也许有人知道在iOS 7下采用颜色更简单的方法吗?

  • 注 - 不推荐使用'UITextAttributeTextColor':首先在iOS 7.0中弃用 - 使用NSForegroundColorAttributeName :) (5认同)
  • 这是改变图标颜色的唯一解决方案 (2认同)

vtc*_*nes 78

iOS 10及更高版本中,有3种可能的简单解决方案:

A.代码实例(Swift):

self.tabBar.unselectedItemTintColor = unselectedcolor
Run Code Online (Sandbox Code Playgroud)

B. IB的实例:

添加密钥路径:unselectedItemTintColor类型:Color

C.全球外观(斯威夫特):

UITabBar.appearance().unselectedItemTintColor = unselectedcolor
Run Code Online (Sandbox Code Playgroud)

  • 您的回答让我意识到,如果您使用故事板,我们也可以通过在属性检查器中添加"unselectedItemTintColor"键路径来使用"用户定义的运行时属性"来执行此操作.谢谢! (7认同)
  • 如果您还支持较低版本(<iOS 10)则不起作用 (2认同)

小智 71

扩展@Sven Tiffe对iOS 7的回答,您可以获取代码以自动着色故事板中添加的未选择的UITabBar图像.以下方法将节省您必须创建两组图标图像(即选择与未选择)并且必须以编程方式加载它们.添加类别方法imageWithColor :(请参阅 - 如何在iOS和WatchKit中将图像tintColor更改为)项目然后将以下内容放在您的自定义UITabBarController viewDidLoad方法中:

// set the selected colors
[self.tabBar setTintColor:[UIColor whiteColor]];
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys: [UIColor whiteColor], NSForegroundColorAttributeName, nil] forState:UIControlStateSelected];


UIColor * unselectedColor = [UIColor colorWithRed:184/255.0f green:224/255.0f blue:242/255.0f alpha:1.0f];

// set color of unselected text
[[UITabBarItem appearance] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:unselectedColor, NSForegroundColorAttributeName, nil]
                                         forState:UIControlStateNormal];

// generate a tinted unselected image based on image passed via the storyboard
for(UITabBarItem *item in self.tabBar.items) {
    // use the UIImage category code for the imageWithColor: method
    item.image = [[item.selectedImage imageWithColor:unselectedColor] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
}
Run Code Online (Sandbox Code Playgroud)

创建一个名为UIImage + Overlay的类别和UIImage + Overlay.m(从这个答案中提取 ):

@implementation UIImage(Overlay)

- (UIImage *)imageWithColor:(UIColor *)color1
{
        UIGraphicsBeginImageContextWithOptions(self.size, NO, self.scale);
        CGContextRef context = UIGraphicsGetCurrentContext();
        CGContextTranslateCTM(context, 0, self.size.height);
        CGContextScaleCTM(context, 1.0, -1.0);
        CGContextSetBlendMode(context, kCGBlendModeNormal);
        CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height);
        CGContextClipToMask(context, rect, self.CGImage);
        [color1 setFill];
        CGContextFillRect(context, rect);
        UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        return newImage;
}
@end
Run Code Online (Sandbox Code Playgroud)


joh*_*doe 22

所以我说我不能删除接受的答案(我试过),但显然,有很多评论的赞成,这对iOS 7不起作用.

请参阅下面的其他答案以及更多的赞成,或@Liam对此答案的评论中的链接.


仅适用于iOS 6

它应该像这样简单:

[[UITabBar appearance] setTintColor:[UIColor grayColor]]; // for unselected items that are gray
[[UITabBar appearance] setSelectedImageTintColor:[UIColor greenColor]]; // for selected items that are green
Run Code Online (Sandbox Code Playgroud)

  • 对于iOS 10.使用此`self.dashboardTabBar.unselectedItemTintColor = UIColor.black` (9认同)

Joe*_*ind 18

将user3719695的答案翻译成Swift,现在使用扩展:

的UIImage + Overlay.swift

extension UIImage {
  func imageWithColor(color1: UIColor) -> UIImage {
    UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
    color1.setFill()

    let context = UIGraphicsGetCurrentContext()
    CGContextTranslateCTM(context, 0, self.size.height)
    CGContextScaleCTM(context, 1.0, -1.0);
    CGContextSetBlendMode(context, CGBlendMode.Normal)

    let rect = CGRectMake(0, 0, self.size.width, self.size.height) as CGRect
    CGContextClipToMask(context, rect, self.CGImage)
    CGContextFillRect(context, rect)

    let newImage = UIGraphicsGetImageFromCurrentImageContext() as UIImage
    UIGraphicsEndImageContext()

    return newImage
  }
}
Run Code Online (Sandbox Code Playgroud)

customTabBar.swift

override func viewDidLoad() {
  super.viewDidLoad()
  for item in self.tabBar.items! {
    item.image = item.selectedImage?.imageWithColor(unselectedColor).imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal)
    //In case you wish to change the font color as well
    let attributes = [NSForegroundColorAttributeName: unselectedColor]
    item.setTitleTextAttributes(attributes, forState: UIControlState.Normal)
  }
}
Run Code Online (Sandbox Code Playgroud)


Abh*_*ain 18

iOS 10及更高版本的Swift版本 -

UITabBar.appearance().tintColor = UIColor.gray
UITabBar.appearance().unselectedItemTintColor = UIColor.gray
Run Code Online (Sandbox Code Playgroud)


小智 11

iOS 13 中有一个新的外观 API。要使用 Xcode 11.0 正确为选项卡栏项目的图标和文本着色,您可以像这样使用它:

  if #available(iOS 13.0, *)
     {
        let appearance = tabBar.standardAppearance
        appearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.black]
        appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.blue]
        appearance.stackedLayoutAppearance.normal.iconColor = UIColor.black
        appearance.stackedLayoutAppearance.selected.iconColor = UIColor.blue
        tabBar.standardAppearance = appearance
    } 
    else 
    {
        tabBar.unselectedItemTintColor = UIColor.black
        tabBar.tintColor = UIColor.blue
    }
Run Code Online (Sandbox Code Playgroud)


kga*_*dis 6

我不得不将代码移入,viewWillAppear因为viewDidLoad图像尚未设置.

Swift 4翻译

import Foundation
import UIKit

extension UIImage {
    func with(color: UIColor) -> UIImage {
        guard let cgImage = self.cgImage else {
            return self
        }
        UIGraphicsBeginImageContextWithOptions(size, false, scale)
        let context = UIGraphicsGetCurrentContext()!
        context.translateBy(x: 0, y: size.height)
        context.scaleBy(x: 1.0, y: -1.0)
        context.setBlendMode(.normal)
        let imageRect = CGRect(x: 0, y: 0, width: size.width, height: size.height)
        context.clip(to: imageRect, mask: cgImage)
        color.setFill()
        context.fill(imageRect)
        let newImage = UIGraphicsGetImageFromCurrentImageContext()!
        UIGraphicsEndImageContext();
        return newImage
    }
}

class MYTabBarController: UITabBarController {

    let unselectedColor = UIColor(red: 108/255.0, green: 110/255.0, blue: 114/255.0, alpha: 1.0)
    let selectedColor = UIColor.blue()

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)

        // Unselected state colors
        for item in self.tabBar.items! {
            item.image = item.selectedImage!.with(color: unselectedColor).withRenderingMode(.alwaysOriginal)
        }
        UITabBarItem.appearance().setTitleTextAttributes([.foregroundColor : unselectedColor], for: .normal)

        // Selected state colors
        tabBar.tintColor = selectedColor
        UITabBarItem.appearance().setTitleTextAttributes([.foregroundColor : selectedColor], for: .selected)
    }
}
Run Code Online (Sandbox Code Playgroud)