【问题标题】：Changing tab bar item image and text color iOS更改标签栏项目图像和文本颜色 iOS
【发布时间】：2015-09-15 23:57:40
【问题描述】：

这是我的标签栏：

下图显示了正在运行的程序并选择了“NEWS”项：

很明显，条形颜色可以正常工作！

但是 tintColor 只影响图像而不影响文本。

此外，当一个项目被选中时（如上图所示，新闻），项目颜色变为蓝色！我该如何防止这种情况发生？我希望它保持白色。

为什么选中时文本变为白色，而未选中时文本变为白色？

我基本上希望项目颜色和文本颜色一直是白色的。

我如何实现这一目标？感谢您的帮助。

是否需要为每个单独的项目提供 swift 代码？

编辑：

【问题讨论】：

您可以为所有图标创建白色和灰色的图像，并且您可以随时更改。
选中时图像变为蓝色，未选中时文本变为白色。我不知道为什么......这是我的问题

标签： ios swift uitabbar uitabbaritem

【解决方案1】：

来自 UITabBarItem 类文档：

默认情况下，实际未选中和选中的图像是从源图像中的 alpha 值自动创建。到防止系统着色，提供图像 UIImageRenderingModeAlwaysOriginal。

线索不是你是否使用UIImageRenderingModeAlwaysOriginal，重要的是什么时候使用它。

要防止未选中项目的灰色，您只需要防止未选中图像的系统着色。以下是如何做到这一点：

var firstViewController:UIViewController = UIViewController()
// The following statement is what you need
var customTabBarItem:UITabBarItem = UITabBarItem(title: nil, image: UIImage(named: "YOUR_IMAGE_NAME")?.imageWithRenderingMode(UIImageRenderingMode.AlwaysOriginal), selectedImage: UIImage(named: "YOUR_IMAGE_NAME"))
firstViewController.tabBarItem = customTabBarItem

如您所见，我要求 iOS 仅将图像的原始颜色（白色、黄色、红色等）应用于 UNSELECTED 状态，并将图像保留为 SELECTED 状态。

此外，您可能需要为选项卡栏添加一种色调，以便为 SELECTED 状态应用不同的颜色（而不是默认的 iOS 蓝色）。根据上面的屏幕截图，您正在为所选状态应用白色：

self.tabBar.tintColor = UIColor.whiteColor()

编辑：

【讨论】：

是否需要创建一个对应Tab Bar的类来输入这段代码？
@GregoryPeck in AppDelegate 或创建您自己的 TabBarClass 但不要忘记通过 Interface Builder 分配它
如您所见，我在上面设置了 tintColor。另外，我已将渲染设置为原始图像，请参阅编辑。
我在哪里把代码firstViewController.tabBarItem = customTabBarItem
抱歉所有问题，但我不确定如何创建标签栏类。即TabBarClass: ??, ??，我似乎无法将它与我的标签栏连接起来。是我必须连接的标签栏还是标签栏控制器？

【解决方案2】：

斯威夫特 3

我通过创建一个自定义标签栏控制器并在 viewDidLoad 方法中添加了这段代码来做到这一点。

    if let count = self.tabBar.items?.count {
        for i in 0...(count-1) {
            let imageNameForSelectedState   = arrayOfImageNameForSelectedState[i]
            let imageNameForUnselectedState = arrayOfImageNameForUnselectedState[i]

            self.tabBar.items?[i].selectedImage = UIImage(named: imageNameForSelectedState)?.withRenderingMode(.alwaysOriginal)
            self.tabBar.items?[i].image = UIImage(named: imageNameForUnselectedState)?.withRenderingMode(.alwaysOriginal)
        }
    }

    let selectedColor   = UIColor(red: 246.0/255.0, green: 155.0/255.0, blue: 13.0/255.0, alpha: 1.0)
    let unselectedColor = UIColor(red: 16.0/255.0, green: 224.0/255.0, blue: 223.0/255.0, alpha: 1.0)

    UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: unselectedColor], for: .normal)
    UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: selectedColor], for: .selected)

它对我有用！

【讨论】：

在 Swift 4 中，“NSForegroundColorAttributeName”已重命名为“NSAttributedStringKey.foregroundColor”。
... 而在 Swift4.2 中，“NSAttributedStringKey”已重命名为“NSAttributedString.Key”。

【解决方案3】：

斯威夫特

图片：

custom.tabBarItem = UITabBarItem(title: "Home", image: UIImage(named: "tab_icon_normal"), selectedImage: UIImage(named: "tab_icon_selected"))

对于文本：

UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.gray], for: .normal)
    
UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.red], for: .selected)

【讨论】：

【解决方案4】：

Swift 4.2 和 Xcode 10

对我有用的解决方案：

图像设置 - 来自情节提要设置 Bar Item Image 和 Selected Image。要移除图像上的色调覆盖，请转到资产目录，选择图像并更改其渲染模式，如下所示：

这将阻止标签栏组件设置其默认图像色调。

Text - 这里我创建了一个简单的 UITabBarController 子类，并在其 viewDidLoad 方法中自定义了默认和选定的文本颜色，如下所示：

class HomeTabBarController: UITabBarController {
    override func viewDidLoad() {
        super.viewDidLoad()

        let appearance = UITabBarItem.appearance(whenContainedInInstancesOf: [HomeTabBarController.self])
        appearance.setTitleTextAttributes([NSAttributedStringKey.foregroundColor: .black], for: .normal)
        appearance.setTitleTextAttributes([NSAttributedStringKey.foregroundColor: .red], for: .selected)
    }
}

只需在 IB 的身份检查器中将此类设置为您的标签栏控制器自定义类。

瞧！而已。

iOS 13 更新：

将此添加到您的 iOS 13 设置中：

if #available(iOS 13, *) {
    let appearance = UITabBarAppearance()
    appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: .red]
    tabBar.standardAppearance = appearance
}

【讨论】：

如果您想使用检查器执行此操作，这应该是公认的答案！非常感谢这解决了我的问题
谢谢，您的 iOS 13 更新对我很有帮助。我有一个奇怪的错误，在最初创建选项卡时所选项目的文本颜色是正确的，但是在选项卡被隐藏并重新出现后（例如，呈现全屏模式然后将其关闭），更改选项卡会将所选项目的文本颜色重置为色调颜色。添加 iOS 13 设置修复了它。

【解决方案5】：

Swift 4：在您的 UITabBarController 中通过此代码更改它

tabBar.unselectedItemTintColor = .black

【讨论】：

【解决方案6】：

斯威夫特 3

这对我有用（指设置 tabBarItems 图像颜色）：

UITabBar.appearance().tintColor = ThemeColor.Blue

if let items = tabBarController.tabBar.items {
        let tabBarImages = getTabBarImages() // tabBarImages: [UIImage]
        for i in 0..<items.count {
            let tabBarItem = items[i]
            let tabBarImage = tabBarImages[i]
            tabBarItem.image = tabBarImage.withRenderingMode(.alwaysOriginal)
            tabBarItem.selectedImage = tabBarImage
        }
    }

我注意到，如果您将图像设置为渲染模式 = .alwaysOriginal，则 UITabBar.tintColor 没有任何效果。

【讨论】：

【解决方案7】：

斯威夫特 3

首先，确保您已将布尔键“查看基于控制器的状态栏外观”添加到 Info.plist，并将值设置为“否”。

Appdelegate.swift

在 "launchOptions:[UIApplicationLaunchOptionsKey: Any]?) 之后的某处插入代码 -> Bool {"

使用 RGB 颜色值更改标签栏本身的颜色：

UITabBar.appearance().barTintColor = UIColor(red: 0.145, green: 0.592, blue: 0.804, alpha: 1.00)

或默认 UI 颜色之一：

UITabBar.appearance().barTintColor = UIColor.white)

更改选项卡项的文本颜色：

选中的项目

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.white], for: .selected)

非活动项目

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.black], for: .normal)

要改变图像的颜色，我相信最简单的方法是分开图像，每个状态一个。

如果您不从头开始制作图标，则在 Photoshop 中交替制作黑白版本相对容易。

Adobe Photoshop（几乎任何版本都可以）

确保您的图标图像具有透明背景，并且图标本身是纯黑色（或关闭）。

打开图片文件，用不同的文件名保存（例如exampleFilename-Inverted.png）

在“图像”菜单的“调整”子菜单中：

点击“反转”

您现在有了原始图标的负片。

在 XCode 中，在情节提要的 Tab Bar Properties 下将其中一张图像设置为“Selected Image”，并在“Bar Item”图像下指定“inactive”版本。

塔达?

【讨论】：

对于您的第三点，您可以在不使用 Photoshop 的情况下将其更改为：UITabBar.appearance().tintColor = UIColor.black
@ChaudhryTalha，tintcolor 适用于标签栏图标的选定状态。但是对于未选中状态图标颜色（

【解决方案8】：

我知道这里有很多答案，但我找不到 Swift 4.2/Swift 5.1

的简单有效的复制/粘贴答案

tabBarController?.tabBar.tintColor = UIColor.red
tabBarController?.tabBar.unselectedItemTintColor = UIColor.green

或者像这样使用UITabBar.appearances() 而不是tabBarController?.tabBar：

UITabBar.appearances().tintColor = UIColor.red
UITabBar.appearances().unselectedItemTintColor = UIColor.green

图片必须是UIImageRenderingModeAlwaysTemplate

【讨论】：

【解决方案9】：

尝试将其添加到 AppDelegate.swift（在 application 方法内）：

UITabBar.appearance().tintColor = UIColor(red: 0/255.0, green: 0/255.0, blue: 0/255.0, alpha: 1.0)

// For WHITE color: 
UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)

例子：

func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
    // Tab bar icon selected color
    UITabBar.appearance().tintColor = UIColor(red: 0/255.0, green: 0/255.0, blue: 0/255.0, alpha: 1.0)
    // For WHITE color: UITabBar.appearance().tintColor = UIColor(red: 255/255.0, green: 255/255.0, blue: 255/255.0, alpha: 1.0)
    return true
}

例子：

我的英文太差了！对不起！ :-)

【讨论】：

【解决方案10】：

在 Swift 5 ios 13.2 中，TabBar 样式发生了变化，下面的代码 100% 工作，经过测试。

在您的 UITabBarController 类中添加以下代码。

override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        let appearance = UITabBarAppearance()
        appearance.backgroundColor = .white

        setTabBarItemColors(appearance.stackedLayoutAppearance)
        setTabBarItemColors(appearance.inlineLayoutAppearance)
        setTabBarItemColors(appearance.compactInlineLayoutAppearance)

        setTabBarItemBadgeAppearance(appearance.stackedLayoutAppearance)
        setTabBarItemBadgeAppearance(appearance.inlineLayoutAppearance)
        setTabBarItemBadgeAppearance(appearance.compactInlineLayoutAppearance)

        tabBar.standardAppearance = appearance
 }

@available(iOS 13.0, *)
private func setTabBarItemColors(_ itemAppearance: UITabBarItemAppearance) {
    itemAppearance.normal.iconColor = .lightGray
    itemAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.gray]

    itemAppearance.selected.iconColor = .white
    itemAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.orange]
}

@available(iOS 13.0, *)
private func setTabBarItemBadgeAppearance(_ itemAppearance: UITabBarItemAppearance) {
    //Adjust the badge position as well as set its color
    itemAppearance.normal.badgeBackgroundColor = .orange
    itemAppearance.normal.badgeTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white]
    itemAppearance.normal.badgePositionAdjustment = UIOffset(horizontal: 1, vertical: -1)
}

【讨论】：

我采用了你的方式，但它不适用于 iOS 15。我无法更改徽章颜色或属性。你解决了吗？

【解决方案11】：

Swift 3.0

我创建了tabbar类文件并写了如下代码

在viewDidLoad:

self.tabBar.barTintColor = UIColor.white
self.tabBar.isTranslucent = true

let selectedColor   = UIColor.red
let unselectedColor = UIColor.cyan

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: unselectedColor,NSFontAttributeName: UIFont(name: "Gotham-Book", size: 10)!], for: .normal)
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: selectedColor,NSFontAttributeName: UIFont(name: "Gotham-Book", size: 10)!], for: .selected)

if let items = self.tabBar.items {
    for item in items {
        if let image = item.image {
            item.image = image.withRenderingMode( .alwaysOriginal )
            item.selectedImage = UIImage(named: "(Imagename)-a")?.withRenderingMode(.alwaysOriginal)
        }
    }
}

viewDidLoad之后：

   override func tabBar(_ tabBar: UITabBar, didSelect item: UITabBarItem) {

   if(item.title! == "title")
   {
    item.selectedImage = UIImage(named: "(Imagname)-a")?.withRenderingMode(.alwaysOriginal)

    }
    if(item.title! == "title")
    {
        item.selectedImage = UIImage(named: "(Imagname)-a")?.withRenderingMode(.alwaysOriginal)

    }
    if(item.title! == "title")
    {
        item.selectedImage = UIImage(named: "(Imagname)-a")?.withRenderingMode(.alwaysOriginal)

    }
    if(item.title! == "title")
    {
        item.selectedImage = UIImage(named: "(Imagname)-a")?.withRenderingMode(.alwaysOriginal)

    }
    if(item.title! == "title")
    {
        item.selectedImage = UIImage(named: "(Imagname)-a")?.withRenderingMode(.alwaysOriginal)

    }

}

在视图加载方法中，您必须设置所选图像，其他图像使用 RenderingMode 显示，在标签栏委托方法中，您根据标题设置所选图像

【讨论】：

【解决方案12】：

对于 Swift 4.0，现在改为：

tabBarItem.setTitleTextAttributes([NSAttributedStringKey.foregroundColor: UIColor.gray], for: .normal)
tabBarItem.setTitleTextAttributes([NSAttributedStringKey.foregroundColor: UIColor.blue], for: .selected)

如果您的要求只是更改文本颜色，则不必对 UITabBarItem 进行子类化。只需将上面的代码放在视图控制器的viewDidLoad 函数中即可。

对于全局设置，将 tabBarItem 更改为 UITabBarItem.appearance()。

【讨论】：

【解决方案13】：

在 Swift 4.2 中：

UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.white], for: .normal)
UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.red], for: .selected)

【讨论】：

我把它放到AppDelegate中，在func应用下效果很好！

【解决方案14】：

你可以设置 UIBarItem 的 tintColor ：

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.magentaColor()], forState:.Normal)
UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.redColor()], forState:.Selected)

【讨论】：

【解决方案15】：

你也可以这样做：

override func viewWillLayoutSubviews() {  
  if let items = self.tabBar.items {
    for item in 0..<items.count {
      items[item].image = items[item].image?.withRenderingMode(.alwaysOriginal)
            items[item].selectedImage = items[item].selectedImage?.withRenderingMode(.alwaysTemplate)
    }

可选：

 UITabBar.appearance().tintColor = UIColor.red

希望对你有帮助。

【讨论】：

【解决方案16】：

年份：2020 iOS 13.3

将以下代码复制到 AppDelegate.swift -> func didFinishLaunchingWithOptions

//Set Tab bar text/item fonts and size
let fontAttributes = [NSAttributedString.Key.font: UIFont(name: "YourFontName", size: 12.0)!]
UITabBarItem.appearance().setTitleTextAttributes(fontAttributes, for: .normal)
//Set Tab bar text/item color
UITabBar.appearance().tintColor = UIColor.init(named: "YourColorName")

【讨论】：

【解决方案17】：

如果您想在按下时更改Tab Bar Item 的图像，此代码适用于Swift 4。复制粘贴到项目中第一个命中的viewDidLoad方法

   let arrayOfImageNameForSelectedState:[String] = ["Image1Color", "Image2Color","Image3Color"]
   let arrayOfImageNameForUnselectedState: [String] = ["Image1NoColor","Image2NoColor","Image3NoColor"]


    print(self.tabBarController?.tabBar.items?.count)

    if let count = self.tabBarController?.tabBar.items?.count {
        for i in 0...(count-1) {
            let imageNameForSelectedState   = arrayOfImageNameForSelectedState[i]
            print(imageNameForSelectedState)
            let imageNameForUnselectedState = arrayOfImageNameForUnselectedState[i]
            print(imageNameForUnselectedState)
            self.tabBarController?.tabBar.items?[i].selectedImage = UIImage(named: imageNameForSelectedState)?.withRenderingMode(.alwaysOriginal)
            self.tabBarController?.tabBar.items?[i].image = UIImage(named: imageNameForUnselectedState)?.withRenderingMode(.alwaysOriginal)
        }
    }

【讨论】：

【解决方案18】：

来自here。

每个标签栏项目都有一个标题、选定的图像、未选定的图像和一个标记值。

使用图像色调 (selectedImageTintColor) 字段来指定选择该选项卡时条形项的色调颜色。默认情况下，该颜色为蓝色。

【讨论】：

链接失效（404）

【解决方案19】：

斯威夫特 5：

let homeTab = UITabBarItem(title: "Home", image: UIImage(named: "YOUR_IMAGE_NAME_FROM_ASSETS")?.withRenderingMode(UIImage.RenderingMode.alwaysOriginal), tag: 1)

【讨论】：

【解决方案20】：

斯威夫特 5.3

let vc = UIViewController()
vc.tabBarItem.title = "sample"
vc.tabBarItem.image = UIImage(imageLiteralResourceName: "image.png").withRenderingMode(.alwaysOriginal)
vc.tabBarItem.selectedImage = UIImage(imageLiteralResourceName: "image.png").withRenderingMode(.alwaysOriginal)
        
// for text displayed below the tabBar item
UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.black], for: .selected)

【讨论】：

【解决方案21】：

如果你想支持 iOS 13 及以上版本，请试试这段代码，因为设置 UItabBar 的方式与 iOS 13 完全不同。

        if #available(iOS 13, *) {
            let appearance = UITabBarAppearance()
            
//            appearance.backgroundColor = .white
            appearance.shadowImage = UIImage()
            appearance.shadowColor = .white
            
            appearance.stackedLayoutAppearance.normal.iconColor = .gray
            appearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.gray]
//            appearance.stackedLayoutAppearance.normal.badgeBackgroundColor = .yellow
            
            appearance.stackedLayoutAppearance.selected.iconColor = .systemPink
            appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.systemPink]
            
            // set padding between tabbar item title and image
            appearance.stackedLayoutAppearance.selected.titlePositionAdjustment = UIOffset(horizontal: 0, vertical: 4)
            appearance.stackedLayoutAppearance.normal.titlePositionAdjustment = UIOffset(horizontal: 0, vertical: 4)
            
            self.tabBar.standardAppearance = appearance
        } else {
            // set padding between tabbar item title and image
            UITabBarItem.appearance().titlePositionAdjustment = UIOffset(horizontal: 0, vertical: 4)
            UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.gray], for: .normal)
            UITabBarItem.appearance().setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.systemPink], for: .selected)
        }

【讨论】：

【解决方案22】：

只需在项目中添加一个新的 UITabBarController 引用。接下来在这个控制器中创建一个 UITabBar 的引用：

@IBOutlet weak var appTabBar: UITabBar!

在其 viewDidLoad() 中，只需在下面添加 标题文本颜色：

    appTabBar.tintColor = UIColor.scandidThemeColor()

图片

    tabBarItem = UITabBarItem(title: "FirstTab", image: UIImage(named: "firstImage"), selectedImage: UIImage(named: "firstSelectedImage"))

【讨论】：

【解决方案23】：

子类化你的 TabbarViewController 并在 ViewDidLoad 中放置这段代码：

 [UITabBarItem.appearance setTitleTextAttributes:@{NSForegroundColorAttributeName : [UIColor darkGreyColorBT]} forState:UIControlStateNormal];
    [UITabBarItem.appearance setTitleTextAttributes:@{NSForegroundColorAttributeName : [UIColor nightyDarkColorBT]} forState:UIControlStateSelected];

    self.tabBar.items[0].image  = [[UIImage imageNamed:@"ic-pack off@3x.png"]  imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.tabBar.items[0].selectedImage  = [[UIImage imageNamed:@"ic-pack@3x.png"]  imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.tabBar.items[1].image = [[UIImage imageNamed:@"ic-sleeptracker off@3x.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.tabBar.items[1].selectedImage  = [[UIImage imageNamed:@"ic-sleeptracker@3x.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.tabBar.items[2].image = [[UIImage imageNamed:@"ic-profile off@3x.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    self.tabBar.items[2].selectedImage  = [[UIImage imageNamed:@"ic-profile@3x.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];

这是我拥有的最简单的工作解决方案

【讨论】：

【解决方案24】：

从 Xcode 13.0 开始，您也可以选择在 UI 上设置此颜色：选择标签栏，然后在 Inspector 中自定义 Standard 和 Scroll to Edge Appearance，在此项目下方，您将找到 Stacked 和 Inline 自定义选项。如果您选择自定义，那么您将拥有“标题颜色”设置。您必须全部设置 (4)。

【讨论】：