IOS15UITabBarController 的 tabBar 背景颜色变黑

tabBar.barTintColor不能在 iOS15β4中更改。

背景资料 。我们在应用商店里有一个应用程序,每年在新的 iOS 主版本发布之前,我们下载 iOS 测试版,并测试我们的应用程序来提前解决问题。

我们的问题。今年在测试 iOS15Beta 4时,我们发现 UITabBarController 的 tabBar 背景颜色变成了黑色,使得条目(图标和标题)难以阅读。在我们的代码中,我们有 self. tabBar.barTintColor = 。这行代码在 iOS15中不起作用。

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

37205 次浏览

我有同样的问题,并发现了同样的链接,在你的问题。我对选项卡栏使用了相同的方法。

这是我正在使用的代码,它完美地工作。

if #available(iOS 15.0, *) {
let appearance = UITabBarAppearance()
appearance.configureWithOpaqueBackground()
appearance.backgroundColor = customColor
   

self.tabController.tabBar.standardAppearance = appearance
self.tabController.tabBar.scrollEdgeAppearance = view.standardAppearance
}

IOS15 : 我们看到了这一点,这就是我在故事板中为了让它工作而做的改变: enter image description here

这稍微改变了 iOS14的外观,但是满足了我们的需要。

创建一个像这样的 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
}

类似于上面的答案,但是如果你使用自定义类,视图不被识别:

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

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

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
    

}

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
            

}
}
}

编辑: 当使用 这些设置时,导航条的色彩在早期设备上不起作用,对不起误导。恢复以下设置可使色彩在所有版本中都能正常工作。

我的设置(在 iOS13.5和 iOS15上,色彩搭配非常完美) :

enter image description here

UITabBarController 的内部子类

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

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

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

我的标签栏是透明的,而这个: 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
}

同样,如果您想要在 appcommittee 中设置外观,那么上面的 Rafat答案也可以很好地工作。

在 iOS15.0.1,Xcode 13上测试。

如果您不希望设置 scrollEdge仪表,可以将其作为标准仪表重写,并且所有设置都将同时显示在两种仪表中。

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

这是我的实现 Objective-C,用于 UITabBarUINavigationBar,它们几乎是一样的。

AppDelegate.mdidFinishLaunchingWithOptions中调用这个。

- (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];
}
}

对于 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
}

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

我对 iOS15的解决方案是继续使用 UIAppearance代理而不是更新的 UITabBarAppearance类。我只需要设置 backgroundColor除了 barTintColor。这至少与 iOS11向后兼容。

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


在更新到 XCode13和 iOS15之后,我还遇到了一些 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
}
     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
}
}

这是修复选择项和普通项的标题颜色的完美方法

  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