Problem was mainly how ForEach and NavigationLink where intertwined : https://stackoverflow.com/questions/66017531/swiftui-navigationlink-bug-swiftui-encountered-an-issue-when-pushing-anavigatio/67626758#67626758
Here is a code that works (even though some error messages I had no time to clear):
struct Item: Identifiable, Hashable {
var id = UUID()
var name: String
var color: Color
var image: String
}
struct ContentView: View {
@State var navigatedItem: String?
@State var isActivated = false
@ViewBuilder
private func selectedView(name: String) -> some View {
switch name {
case "Medical": MedicalView()
case "Illness": IllnessView()
case "Vaccune": VaccuneView()
case "Dewor": DeworView()
case "Allergie": AllergieView()
default: EmptyView()
}
}
var body: some View {
NavigationView {
ZStack(){
Color(.systemGray6).ignoresSafeArea()
VStack() {
ScrollView(.horizontal, showsIndicators: false) {
HStack(spacing: 5) {
ForEach(MockData.items, id:\.self) { item in
ZStack {
Button(action:{
navigatedItem = item.name
isActivated = true
print(item.name)
})
{
RoundedRectangle(cornerRadius: 10)
.foregroundStyle(item.color.self)
.frame(width: 70, height: 70)
}
Image(systemName: item.image)
.foregroundColor(.white)
.font(.system(size: 30))
.padding(20)
}
}
.background(){
NavigationLink(destination: selectedView(name: navigatedItem ?? "Medical"), isActive: $isActivated)
{ EmptyView() }
}
} //HStack
//opciones
} // cierre scrollview
.padding(.top, 20)
.padding(.leading)
Spacer()
} //cierre Vstack
} //cierre de Zstack
.navigationTitle("Caracteristicas")
.toolbar{
ToolbarItem(placement: .navigationBarLeading)
{
Button(action:{},
label: {
Image(systemName: "switch.2")})
}
ToolbarItem(placement: .navigationBarTrailing)
{
Button(action:{},
label: {Image(systemName: "person.circle")})
}
}//toolBar
.accentColor(.red)
}
}
}
struct MockData {
static var items = [
Item3(name: "Medical" ,color: .red, image:"heart"),
Item3(name: "Illness" ,color: .blue, image:"pill"), // Illness
Item3( name:"Vaccune" ,color: .orange, image: "syringe"),
Item3(name: "Dewor" ,color: .green, image: "microbe"),
Item3(name: "Allergie" ,color:.purple, image: "allergens")]
}
struct MedicalView: View {
var body: some View {
Text("Medical")
}
}
struct IllnessView: View {
var body: some View {
Text("Illness")
}
}
struct VaccuneView: View {
var body: some View {
Text("Vaccune")
}
}
struct DeworView: View {
var body: some View {
Text("Dewor")
}
}
struct AllergieView: View {
var body: some View {
Text("Allergie")
}
}
