SwiftUI -更改选项卡栏图标颜色

amrnrhlw  于 2022-12-17  发布在  Swift
关注(0)|答案(8)|浏览(254)

我无法在SwiftUI中更改标签栏颜色。我尝试了TabbedView、Image/Text和Stack,但没有效果。
使用.foregroundColor不起作用。

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

bihw5rsg1#

溶液1

使用renderingMode(.template)

struct MainView: View {

    var body: some View {
       TabView {
            LoginView().tabItem {
                VStack {
                    Text("Login")
                    Image("login").renderingMode(.template)
                }
            }

            HomeView().tabItem {
                VStack {
                    Text("Home")
                    Image("home").renderingMode(.template)
                }
            }
        }.accentColor(.orange)
    }
}

溶液2

创建tabItem类型
x一个一个一个一个x一个一个二个x

mrwjdhj3

mrwjdhj32#

使用accentColor

TabView(selection: $selection) {
            NavigationView {
                HomeView()
            }.navigationBarTitle("Home")
                .tabItem {
                    VStack {
                        if selection == 0 {
                            Image(systemName: "house.fill")
                        } else {
                            Image(systemName: "house")
                        }
                        Text("Home")
                    }
                }
            .tag(0)
            NavigationView {
                SettingsView()
            }.navigationBarTitle("Settings")
                .tabItem {
                    VStack {
                        Image(systemName: "gear")
                        Text("Settings")
                    }
                }
                .tag(1)
        }.accentColor(.purple)
swvgeqrz

swvgeqrz3#

你可以使用UITabBar.appearance()进行一些定制,直到Apple提供更新SwiftUITabView的更标准的方法为止

更改选项卡项(文本+图标)颜色

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

更改选项卡视图背景色

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

整个代码如下所示-

struct ContentView: View {

   init() {
       // UITabBar customization
   }

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

}

使用**.accentColor修饰符更改选定**选项卡项的颜色
在尝试了很多选择之后,这对我来说很有效。

wvyml7n5

wvyml7n54#

我认为您可以直接使用TabView的accentColor,它对我很有效:]

TabView {
...
}.accentColor(Color.red)
evrscar2

evrscar25#

我为Image做了一个扩展,它使用带有浅色的UIImage初始化:

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

nom7f22z6#

目前SwiftUI没有直接的方法。
我们必须使用UIKit方法,除非SwiftUI引入了任何新的解决方案。
请尝试以下代码:

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")
            }
        }
    }
}
f8rj6qna

f8rj6qna7#

如果您需要为SwiftUI界面的整个应用程序设置强调色,您只需在Assets.xcassets文件中定义AccentColor,如下图所示。TabBar图标无需任何额外代码即可获得该颜色。

ej83mcc0

ej83mcc08#

在iOS16上.accentColor(颜色)已弃用。您可以在TabView上使用.tint(颜色)。

TabView {
        Text("First Tab")
            .tabItem {
                Image(systemName: "1.circle")
                Text("First")
            }
 }.tint(Color.yellow)

相关问题