web-dev-qa-db-fra.com

SwiftUI - Changer la couleur de l'icône TabBar

Je ne peux pas changer la couleur de la barre d'onglets dans SwiftUI. Je l'essaye avec la vue à onglets, avec l'image/texte et avec une pile. Rien ne fonctionne pour moi.

l'utilisation de .foregroundColor ne fonctionne pas.

TabbedView(selection: $selection){
 TextView()
  .tag(0)
  .tabItemLabel(
 VStack {
  Image("Calendar")
   .foregroundColor(.red)
  Text("Appointments")
   .foregroundColor(.red)
  }
 ).foregroundColor(.red)
}.foregroundColor(.red)
swiftviewcolorstabbarswiftui
8
Max

J'ai fait une extension pour Image qui s'initialise avec un UIImage avec une couleur de teinte:

extension Image {
    init(_ named: String, tintColor: UIColor) {
        let uiImage = UIImage(named: named) ?? UIImage()
        let tintedImage = uiImage.withTintColor(tintColor,
                                                renderingMode: .alwaysTemplate)
        self = Image(uiImage: tintedImage)
    }
}
2
Niels Hoogendoorn

Actuellement, SwiftUI n'a pas de méthode directe pour cela.

Nous devons utiliser la méthode UIKit pour cela à moins que SwiftUI n'introduise une nouvelle solution.

essayez ci-dessous le code:

struct ContentView: View {

    init() {
        UITabBar.appearance().backgroundColor = UIColor.purple
    }

    var body: some View {
        return TabbedView {
            Text("This is tab 1")
                .tag(0)
                .tabItem {
                    Text("tab1")
            }
            Text("This is tab 2")
                .tag(1)
                .tabItem {
                    Text("tab1")
            }
            Text("This is tab 3")
                .tag(2)
                .tabItem {
                    Text("tab1")
            }
        }
    }
}
1
Ketan Odedra

Vous pouvez utiliser ITabBar.appearance () pour effectuer une certaine personnalisation jusqu'à ce que Apple propose une méthode plus standard de mise à jour de SwiftUI TabView

Changer la couleur de TabItem (texte + icône)

init() {
  UITabBar.appearance().unselectedItemTintColor = UIColor.white
}

Changer la couleur d'arrière-plan de TabView

init() {
  UITabBar.appearance().backgroundColor = UIColor.red
  UITabBar.appearance().backgroundImage = UIImage()
}

Le code global ressemble à ceci -

struct ContentView: View {

   init() {
       // UITabBar customization
   }

  var body: some View {
     TabView(selection: $selection) {
         FirstTabView()
              .tabItem {
                  VStack {
                     Image(systemName: "map")
                     Text("Near Me")
                  }
              }
     }
  }

}

Utilisez le modificateur . AccentColor pour changer la couleur de sélectionné tabItem

Après avoir essayé de nombreuses options, cela a fonctionné pour moi ..

0
Ankit