SwiftUI 2.0 - TabView 选项卡栏颜色不遵循当前的配色方案(深色或浅色模式)

2023-11-29

我拼命尝试让我的标签栏颜色尊重当前的配色方案。 当应用程序启动时,颜色是正确的。但是,如果我切换深色和浅色模式,颜色不会切换回正确的颜色。始终应用灯光模式颜色。代码位于图像下方(针对演示进行了简化)。

Dark mode tab bar with correct colors

Light mode tab bar with correct colors

Dark mode tab bar with wring colors

颜色在中指定Assets.xcassets目录(任意/浅色/深色)。

enter image description here


import SwiftUI

struct TabBarColorTest: View {
    
    @Environment(\.colorScheme) var colorScheme
    
    init() {
        UITabBar.appearance().isTranslucent = true
        UITabBar.appearance().tintColor = UIColor(named: "TabBarTint")
        UITabBar.appearance().unselectedItemTintColor = UIColor(named: "TabBarUnselected")
        UITabBar.appearance().barTintColor = UIColor(named: "TabBar")
        UITabBar.appearance().backgroundColor = UIColor(named: "TabBar")
    }
    
    var body: some View {
        TabView {
            
            Text("Zero")
                .tabItem {
                    Label("Zero", systemImage: "0.square.fill")
                }
            
            Text("One")
                .tabItem {
                    Label("One", systemImage: "1.square.fill")
                }
        }
        .onChange(of: colorScheme, perform: { value in
            UITabBar.appearance().isTranslucent = true
            UITabBar.appearance().tintColor = UIColor(named: "TabBarTint")
            UITabBar.appearance().unselectedItemTintColor = UIColor(named: "TabBarUnselected")
            UITabBar.appearance().barTintColor = UIColor(named: "TabBar")
            UITabBar.appearance().backgroundColor = UIColor(named: "TabBar")
        })
    }
}

struct TabBarColorTest_Previews: PreviewProvider {
    static var previews: some View {
        TabBarColorTest()
    }
}

通过将选项卡项色调颜色作为 SwiftUI 修饰符并简化选项卡栏 UIKIt 配置的初始化,应该可以解决该问题。在 Xcode 12.4 上进行测试,以 iOS 14 作为最低目标。

struct ContentView: View {

  init() {
    UITabBar.appearance().barTintColor = .systemBackground
    UITabBar.appearance().unselectedItemTintColor = UIColor(named: "TabBarUnselected")
  }
  
  var body: some View {
    TabView {
      
      Text("Zero")
        .tabItem {
          Label("Zero", systemImage: "0.square.fill")
        }
      
      Text("One")
        .tabItem {
          Label("One", systemImage: "1.square.fill")
        }
    }
    .accentColor(Color("TabBarTint"))
  }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

SwiftUI 2.0 - TabView 选项卡栏颜色不遵循当前的配色方案(深色或浅色模式) 的相关文章

随机推荐