iOS 15 UITabBarController的tabBar背景色变黑

Question

tabBar.barTintColor 15 beta 4 中无法更改 tabBar.barTintColor。

背景。 我们在 App Store 中有一个应用程序，每年在新的 iOS 主要版本发布之前，我们都会下载 iOS 测试版并测试我们的应用程序以预先解决问题。

我们的问题。 今年在 iOS 15 beta 4 中进行测试时，我们发现 UITabBarController 的 tabBar 背景颜色变为黑色，使项目（图标和标题）难以阅读。 在我们的代码中，我们有 self.tabBar.barTintColor =.white 并且这行代码在 iOS 15 中不起作用。

我们的尝试。 我在网上搜索并发现了一个类似但不完全相同的问题报告， https://developer.apple.com/forums/thread/682420 。 我尝试了standardAppearance但这不是解决方案，因为appearance我无法更改tabBar.tintColor 。

Answer 1

我遇到了同样的问题，并在您的问题中找到了相同的链接。 我对标签栏使用了相同的方法。

这是我正在使用的代码，它运行良好。

if #available(iOS 15.0, *) {
   let appearance = UITabBarAppearance()
   appearance.configureWithOpaqueBackground()
   appearance.backgroundColor = customColor
   
   self.tabController.tabBar.standardAppearance = appearance
   self.tabController.tabBar.scrollEdgeAppearance = view.standardAppearance
}

Answer 2

与上面的答案类似，但如果您使用自定义类，则修复了无法识别视图的问题：

if #available(iOS 15.0, *) {
    let appearance = UITabBarAppearance()
    appearance.configureWithOpaqueBackground()
    appearance.backgroundColor = .white
    tabBar.standardAppearance = appearance
    tabBar.scrollEdgeAppearance = tabBar.standardAppearance
}

Answer 3

像这样创建一个UITabBarAppearance以保持与以前的 iOS 版本相同的视觉行为：

@available(iOS 15.0, *)
private func updateTabBarAppearance() {
    let tabBarAppearance: UITabBarAppearance = UITabBarAppearance()
    tabBarAppearance.configureWithOpaqueBackground()
    
    let barTintColor: UIColor = .white
    tabBarAppearance.backgroundColor = barTintColor
    
    updateTabBarItemAppearance(appearance: tabBarAppearance.compactInlineLayoutAppearance)
    updateTabBarItemAppearance(appearance: tabBarAppearance.inlineLayoutAppearance)
    updateTabBarItemAppearance(appearance: tabBarAppearance.stackedLayoutAppearance)
    
    self.tabBar.standardAppearance = tabBarAppearance
    self.tabBar.scrollEdgeAppearance = tabBarAppearance
}

@available(iOS 13.0, *)
private func updateTabBarItemAppearance(appearance: UITabBarItemAppearance) {
    let tintColor: UIColor = .red
    let unselectedItemTintColor: UIColor = .green
    
    appearance.selected.iconColor = tintColor
    appearance.normal.iconColor = unselectedItemTintColor
}

Answer 4

我尝试了以上正确的答案。 我想在这些解决方案中添加更多属性。 我的要求是更改标签栏的背景颜色、更改选定图像和标题颜色、更改未选定图像和标题颜色。 我能够使用以下代码在iOS 15 中实现它。

if #available(iOS 15.0, *){
    let appearance = UITabBarAppearance()
    appearance.configureWithDefaultBackground()
    appearance.backgroundColor = UIColor.appDarkColorLightShade
    
    appearance.compactInlineLayoutAppearance.normal.iconColor = .lightText
    appearance.compactInlineLayoutAppearance.normal.titleTextAttributes = [.foregroundColor : UIColor.lightText]
    
    appearance.inlineLayoutAppearance.normal.iconColor = .lightText
    appearance.inlineLayoutAppearance.normal.titleTextAttributes = [.foregroundColor : UIColor.lightText]
    
    appearance.stackedLayoutAppearance.normal.iconColor = .lightText
    appearance.stackedLayoutAppearance.normal.titleTextAttributes = [.foregroundColor : UIColor.lightText]
    
    self.tabBarController?.tabBar.standardAppearance = appearance
    self.tabBarController?.tabBar.scrollEdgeAppearance = self.tabBarController?.tabBar.standardAppearance
    self.tabBarController?.tabBar.tintColor = .white
    
}else{
    self.tabBarController?.tabBar.barTintColor = .appDarkColorLightShade
    self.tabBarController?.tabBar.unselectedItemTintColor = .lightText
    self.tabBarController?.tabBar.tintColor = .white
    
}

Answer 5

iOS 15 ：我们看到了这一点。 这是我在我们的故事板中更改以使其工作的内容：

这稍微改变了 iOS 14 中的外观，但它可以满足我们的需求。

Answer 6

Xcode 13.0 - iOS 15.0

我的目标是在视图控制器更改时动态更新导航栏色调颜色。 我先设置这些设置。 然后在需要时使用我想使用的 UIColor 调用此函数。

称呼：

setNavigationBarAppearance(color: .green)

延期：

// MARK: Navigation Bar Appearance Function
extension MainViewController {
    func setNavigationBarAppearance(color: UIColor) {
        if #available(iOS 15.0, *){
            let appearance = UINavigationBarAppearance()
            appearance.configureWithDefaultBackground()
            appearance.backgroundColor = color // The background color.
            
            self.navigationController?.navigationBar.standardAppearance = appearance
            self.navigationController?.navigationBar.scrollEdgeAppearance = self.navigationController?.navigationBar.standardAppearance
            
        } else { // Background color support for older versions
            self.navigationController?.navigationBar.barTintColor = color
            
        }
    }
}

编辑：使用这些设置时，导航栏色调颜色在早期设备上不起作用，对于错误信息，抱歉。 恢复下面的设置会使色调颜色在所有版本中都按预期工作。

我的设置（色调完美，在 iOS 13.5 和 iOS 15 上）：

Answer 7

对我来说这很简单，你不需要访问UINavigationController实例。 只需从AppDelegate:didFinishLaunchingWithOptions调用它

if #available(iOS 15.0, *) {
    let appearance = UITabBarAppearance()
    appearance.configureWithOpaqueBackground()
    UITabBar.appearance().standardAppearance = appearance
    UITabBar.appearance().scrollEdgeAppearance = appearance
}

Answer 8

     func setupAppearance() {
            // Update based on your font requirements
            let font = UIFont.systemFont(ofSize: 12, weight: .bold)
            let tabBarAppearance = UITabBarAppearance()
            let tabBarItemAppearance = UITabBarItemAppearance()
            
            tabBarItemAppearance.normal.titleTextAttributes = [NSAttributedString.Key.font: font, NSAttributedString.Key.foregroundColor: UIColor.gray]
            tabBarItemAppearance.selected.titleTextAttributes = [NSAttributedString.Key.font: font, NSAttributedString.Key.foregroundColor: UIColor.black]

            /* Note: To reset background and shadow properties to display opaque colors can use - tabBarAppearance.configureWithOpaqueBackground() */
            tabBarAppearance.backgroundColor = .white
            tabBarAppearance.stackedLayoutAppearance = tabBarItemAppearance
            
            tabBar.standardAppearance = tabBarAppearance
        if #available(iOS 15.0, *) {
            tabBar.scrollEdgeAppearance = tabBarAppearance
        }
    }

Answer 9

  if #available(iOS 15.0, *) {
    navigationController?.view.backgroundColor = UIColor.colorName
  }

Answer 10

我的标签栏是透明的。 而这个： tabBar.scrollEdgeAppearance = tabBar.standardAppearance对我不起作用。

我不得不用tabBar.scrollEdgeAppearance = appearance替换它。 我认为导航栏也是如此。

所以最终的修复看起来像：

   if #available(iOS 15.0, *) {
        let appearance = UITabBarAppearance()
        appearance.configureWithOpaqueBackground()
        appearance.backgroundColor = .white //or whatever your color is
        
        tabBar.scrollEdgeAppearance = appearance
        tabBar.standardAppearance = appearance
    }

如果您想在 appdelegate 中设置外观，上述Rafat touqir Rafsun的回答也可以正常工作。

在 iOS 15.0.1、Xcode 13 上测试。

Answer 11

如果您不想设置 scrollEdgeAppearance，您可以将其覆盖为 standardAppearance，您的所有设置都将同时出现。

if #available(iOS 15.0, *) {
   tabBar.scrollEdgeAppearance = tabBar.standardAppearance
}

Answer 12

这是我对UITabBar和UINavigationBar实现，Objective-C。 它们几乎相同。

在AppDelegate.m的didFinishLaunchingWithOptions中调用它。

- (void)setupAppearance {
  if (@available(iOS 15, *)) {
    UIColor *color = [UIColor whiteColor]; // #F5F5F5 for white smoke. 
    UITabBarAppearance *tabBarAppearance = [UITabBarAppearance new];
    tabBarAppearance.backgroundColor = color;
    [[UITabBar appearance] setStandardAppearance:tabBarAppearance];
    [[UITabBar appearance] setScrollEdgeAppearance:tabBarAppearance];
    
    UINavigationBarAppearance *navBarAppearance = [UINavigationBarAppearance new];
    navBarAppearance.backgroundColor = color;
    [[UINavigationBar appearance] setStandardAppearance:navBarAppearance];
    [[UINavigationBar appearance] setScrollEdgeAppearance:navBarAppearance];
  }
}

Answer 13

对于 Swift，我使用下面的代码来保持我的应用程序具有与以前相同的外观。 我的标签栏为图标和标题选择了粉红色。 并具有默认的灰色调颜色。

使用configureWithDefaultBackground而不是configureWithOpaqueBackground因为我想要标签栏的一点透明度。

目前，它运行良好，请继续寻找最新的变化。

       if #available(iOS 15, *) {
            let appearance = UITabBarAppearance()
            appearance.configureWithDefaultBackground()
            appearance.stackedLayoutAppearance.normal.iconColor = .systemGray
            appearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.systemGray]
            
            appearance.stackedLayoutAppearance.selected.iconColor = .systemPink
            appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.systemPink]
            // appearance.backgroundColor = .systemBackground
            
            self.tabBar.standardAppearance = appearance
            self.tabBar.scrollEdgeAppearance = appearance
        }
        
        if #available(iOS 13, *) {
            let appearance = UITabBarAppearance()
            appearance.shadowImage = UIImage()
            appearance.shadowColor = .white
            
            appearance.stackedLayoutAppearance.normal.iconColor = .systemGray
            appearance.stackedLayoutAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.systemGray]
//            appearance.stackedLayoutAppearance.normal.badgeBackgroundColor = .yellow
            
            appearance.stackedLayoutAppearance.selected.iconColor = .systemPink
            appearance.stackedLayoutAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.systemPink]

            self.tabBar.standardAppearance = appearance
        }

Answer 14

如果这里建议的解决方案都不适用于某人，您可以尝试一个简单的替代方案 - 在AppDelegate为UINavigationBar内的所有UIView分配backgroundColor ：

UIView.appearance(whenContainedInInstancesOf: [UINavigationBar.self])
      .backgroundColor = .red // The background color navigation bar you want

Answer 15

我的应用程序在表格视图下方有一个不透明的标签栏。 在 iOS 14.x 及更早版本中，在UIAppearance代理上设置barTintColor就足够了，但在 iOS 15.0 中，当表格视图没有到达屏幕底部时，标签栏背景是黑色的。

我的 iOS 15 解决方案是继续使用UIAppearance代理而不是较新的UITabBarAppearance类。 除了barTintColor之外，我只需要设置backgroundColor 。 这至少向后兼容 iOS 11。

let tabBarAppearance = UITabBar.appearance()
tabBarAppearance.isTranslucent = false
tabBarAppearance.barTintColor = barColor
tabBarAppearance.backgroundColor = barColor

Answer 16

更新到 XCode 13 和 iOS 15 后，我还遇到了一些 Tab Bar 问题，包括不同状态的栏背景颜色和项目文本颜色。 我修复它的方式：

if #available(iOS 15, *) {
   let tabBarAppearance = UITabBarAppearance()
   tabBarAppearance.backgroundColor = backgroundColor
   tabBarAppearance.stackedLayoutAppearance.selected.titleTextAttributes = [.foregroundColor: selectedItemTextColor]
   tabBarAppearance.stackedLayoutAppearance.normal.titleTextAttributes = [.foregroundColor: unselectedItemTextColor]
   tabBar.standardAppearance = tabBarAppearance
   tabBar.scrollEdgeAppearance = tabBarAppearance
} else {
   UITabBarItem.appearance().setTitleTextAttributes([.foregroundColor: selectedItemTextColor], for: .selected)
   UITabBarItem.appearance().setTitleTextAttributes([.foregroundColor: unselectedItemTextColor], for: .normal)
   tabBar.barTintColor = backgroundColor
 }

Answer 17

这是修复 select 和普通项目的标签栏项目标题颜色的完美方法

  let tabBarAppearance = UITabBarAppearance()
let tabBarItemAppearance = UITabBarItemAppearance()

tabBarItemAppearance.normal.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.red]
tabBarItemAppearance.selected.titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.blue]

tabBarAppearance.stackedLayoutAppearance = tabBarItemAppearance

tabBar.standardAppearance = tabBarAppearance
tabBar.scrollEdgeAppearance = tabBarAppearance

Answer 18

UITabBarController 的内部子类

if #available(iOS 15.0, *) {
            let appearance = UITabBarAppearance()
            appearance.configureWithOpaqueBackground()
            appearance.backgroundColor = .white
            tabBar.standardAppearance =  appearance
            tabBar.scrollEdgeAppearance = tabBar.standardAppearance
        }