SwiftUI 2.0 — Цвета панели вкладок TabView не соответствуют текущей цветовой схеме (темный или светлый режим)

#swiftui #tabbar #tabview

#swiftui #панель вкладок #tabview

Вопрос:

Я отчаянно пытаюсь, чтобы цвета моей панели вкладок соответствовали текущей цветовой схеме. При запуске приложения цвета отображаются правильно. Но если я переключаю темный и светлый режимы, цвета не переключаются обратно на правильные. Всегда применяются цвета светлого режима. Код доступен под изображениями (упрощенный для демонстрации).

Панель вкладок в темном режиме с правильными цветами

Панель вкладок в светлом режиме с правильными цветами

Панель вкладок в темном режиме с изменяемыми цветами

Цвета указаны в Assets.xcassets каталоге (любые / Светлые / темные).

введите описание изображения здесь


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

Комментарии:

1. должны ли вы просто решить проблему с помощью цветов в Assets.xcassets? Я имею в виду, вы хотите, чтобы цвета понимали новую цветовую схему и вносили изменения, это единственный способ, которым вы хотите?

Ответ №1:

Проблема должна быть устранена путем использования оттенка цвета элемента tab в качестве модификатора 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"))
  }
}
 

Комментарии:

1. Спасибо! Удаление UITabBar.appearance().isTranslucent = true, UITabBar.appearance().tintColor = UIColor(с именем: «TabBarTint») и UITabBar.appearance().backgroundColor = UIColor(.skipperTabBar) устранило проблему!