I would like to change the color of the toolbar icon when it is selected. When not selected the color is Gray, when instead the color to be is selected: # FC4949 This is the code:
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()
}
}
Tab
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
Currently the result of the code is this
I would like this:
2
Answers
I solved this by adding
There is a property named accentcolor which is used to provide color to your selected tab in SwiftUI.You just need to provide that property to your tabView.For example, if you want that selected item to be pink you may use it like that:-