更改标签栏项目图像和文本颜色iOS

Question

这是我的标签栏:

下图显示正在运行的程序和选择的"NEWS"项:

很明显酒吧色调颜色正常,我想要!

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

此外,当选择一个项目(如上所示,新闻)时,项目颜色变为蓝色!我该如何防止这种情况发生？我希望它保持白色.

为什么文本在选中时会变为白色但在未选中时会变为白色？

我基本上希望项目颜色和文本颜色始终为白色.

我该如何实现这一目标？谢谢你的帮助.

是否需要每个项目的快速代码？

编辑:

Answer 1

来自UITabBarItem类docs:

默认情况下,将根据源图像中的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()

编辑:

Answer 2

斯威夫特3

我是通过创建自定义tabbar控制器并在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)

它对我有用!

Answer 3

迅速

对于图像:

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

对于文字:

UITabBarItem.appearance().setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.grayColor()], forState:.Normal)

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

Answer 4

Swift 4.2和Xcode 10

对我有用的解决方案:

1. 图像设置 - 从故事板设置条形图像和选定图像.要删除图像上的色调覆盖,请转到资产目录,选择图像并更改其渲染模式,如下所示:

这将阻止Tab栏组件设置其默认图像色调.

2. 文本 - 这里我创建了一个简单的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中的身份检查器中将此类设置为Tab栏控制器自定义类.

瞧!而已.

Answer 5

斯威夫特3

这对我有用(指set 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没有任何效果.

Answer 6

斯威夫特3

首先,确保已将"BOOLEAN"键"查看基于控制器的状态栏外观"添加到Info.plist,并将值设置为"NO".

Appdelegate.swift

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

1. 使用RGB颜色值更改标签栏本身的颜色:

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

或者其中一种默认UI颜色:

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

2. 更改选项卡项的文本颜色:

所选项目

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

非活动项目

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

3. 为了改变图像的颜色,我认为最简单的方法是分离图像,每个状态一个.

如果你不从头开始制作图标,在Photoshop中相对容易制作交替的黑白版本.

Adobe Photoshop(几乎任何版本都可以)

确保您的图标图像具有透明背景,图标本身为纯黑色(或关闭).

打开图像文件,将其保存在不同的文件名下(例如exampleFilename-Inverted.png)

在"图像"菜单的"调整"子菜单中:

点击"反转"

您现在的原始图标为负数.

在XCode中,将其中一个图像设置为故事板中选项卡栏属性下的"选定图像",并在"条形图"图像下指定"非活动"版本.

当当

Answer 7

我知道这里有很多答案，但我找不到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

Answer 8

Swift 4：在您的UITabBarController中通过以下代码对其进行更改

tabBar.unselectedItemTintColor = .black

Answer 9

尝试在AppDelegate.swift上添加它(在应用程序方法内部):

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
}

例:

我的英语太差了!对不起!:-)

Answer 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)
}