在 SwiftUI 中选择时更改栏图标颜色

Change bar icon color when selected in SwiftUI

我想更改工具栏图标被选中时的颜色。未选择时,颜色为灰色,而选择要选择的颜色时:# FC4949 这是代码:

MainTabView

import SwiftUI

struct MainTabView: View {
@State var selectedTab: Tab = .home
@State var color: Color = .red

var body: some View {
    ZStack(alignment: .bottom) {
        
        Group {
            switch selectedTab {
            case .home:
                HomeView()
            case .corsi:
                CorsiView()
            case .carriera:
                CarrieraView()
            case .messaggi:
                MessaggiView()
            case .profilo:
                ProfileView()
            }
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        HStack {
            ForEach(tabItems) { item in Button {
                withAnimation(.spring(response: 0.3,
                                      dampingFraction: 0.7)){
                    selectedTab = item.tab
                    color = item.color
                }
            } label: {
                VStack(spacing: 0) {
                    Image(item.icon)
                        
                        
                        .frame(width: 44, height: 29)
                    
                        
                        //.lineLimit(1)
                }
                .frame(maxWidth: .infinity)
            }
            
       }
   }
        .padding(.horizontal, 8)
        .padding(.top, 30)
        .frame(height: 80, alignment: .top)
        
        .overlay(
            HStack {
                if selectedTab == .profilo { Spacer()}
                if selectedTab == .corsi { Spacer() }
                if selectedTab == .carriera {
                    Spacer()
                    Spacer()
                }
                if selectedTab == .messaggi {
                    Spacer()
                    Spacer()
                    Spacer()
                }
                Rectangle()
                    .fill(color)
                    .frame(width: 32, height: 4)
                    .cornerRadius(3)
                    .frame(width: 60)
                    .frame(maxHeight: .infinity, alignment: .bottom)
                if selectedTab == .messaggi { Spacer() }
                if selectedTab == .home { Spacer() }
                if selectedTab == .corsi {
                    Spacer()
                    Spacer()
                    Spacer()
                    
                }
                
                if selectedTab == .carriera {
                    Spacer()
                    Spacer() }
                
                
            }
                .padding(.horizontal, 14)
        )
        .ignoresSafeArea()

    }
    
}
}



struct MainTabView_Previews: PreviewProvider {
static var previews: some View {
    MainTabView()
   }
}

选项卡

  import SwiftUI

struct TabItem: Identifiable {
var id = UUID()
var text: String
var icon: String
var tab: Tab
var color: Color
}

var tabItems = [
TabItem(text: "Home", icon: "HomeIcon", tab: .home, color: .red),
TabItem(text: "Corsi", icon: "CorsiIcon", tab: .corsi, color: .red),
TabItem(text: "Carriera", icon: "CarrieraIcon", tab: .carriera, color: .red),
TabItem(text: "Messaggi", icon: "MessaggiIcon", tab: .messaggi, color: .red),
TabItem(text: "Profilo", icon: "ProfileIcon", tab: .profilo, color: .red)


 ]

 enum Tab: String {
case home
case corsi
case carriera
case messaggi
case profilo
 }

目前代码的结果是这样的

Currently the result of the code is this

我想要这个:

I would like this

有一个名为 accentcolor 的 属性 用于为您在 SwiftUI.You 中选择的选项卡提供颜色,只需将 属性 提供给您的 tabView.For 示例,如果您希望所选项目为粉红色,您可以这样使用它:-

TabView {
...
}.accentColor(.pink)

我通过添加

解决了这个问题
} label: {
    VStack(spacing: 0) {               
        Image(item.icon)
            .foregroundColor(selectedTab == item.tab ? Color(.red) : .gray)
    }
    .frame(maxWidth: .infinity)
}