SwiftUI use a Binding to some enums

Question

When you press the empty square, you change it to different images. It's for a simple game I created.

Now what I want is to bind these values so that when I go to a different view and come back these images are still there and do not get reset to their original state. So when you have a xmark, you still have the xmark when you come back and so on.

How would I use a binding with these enums? I know how to use a binding with a boolean or a string but not an enum. Can someone point me into the right direction?

This is my code:

enum dader1 : String, Identifiable {
        case vierkantje
        case vinkje
        case vraagteken
        case kruisje
        var id: String {
            return self.rawValue }
    }
    
    enum dader2 : String, Identifiable {
        case vierkantje
        case vinkje
        case vraagteken
        case kruisje
        var id: String {
            return self.rawValue }
    }
    
    enum dader3 : String, Identifiable {
        case vierkantje
        case vinkje
        case vraagteken
        case kruisje
        var id: String {
            return self.rawValue }
    }
        
    @State var activeDader1 : dader1? = nil
    @State var activeDader2 : dader2? = nil
    @State var activeDader3 : dader3? = nil
    
    var body: some View {
        ZStack {
            Image("Achtergrond")
                .resizable()
                .ignoresSafeArea()
                
            
            
            VStack(alignment: .leading) {
               
                ScrollView {
                Text("Some Text")
                    .frame(width: 350)
                    .foregroundColor(.black)
                    .font(.headline)
                
                
                
                ZStack {
                    
                    Image("Resultaat")
                        .resizable()
                        .frame(width: 350, height: 250)
                    VStack {

             
                HStack(spacing: 55){
              
                    
                    
                    switch self.activeDader1 {
                    case .vierkantje:
                    Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader1 = .vinkje
                                Dader1 = false
                            }
                    case .vinkje:
                        Image(systemName: "checkmark.square" )
                            .foregroundColor(.blue)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader1 = .vraagteken
                                Dader1 = true
                            }
                    case .vraagteken:
                        Image(systemName: "questionmark.square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader1 = .kruisje
                                Dader1 = false
                            }
                    case .kruisje:
                        Image(systemName: "xmark.square" )
                            .foregroundColor(.red)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader1 = .vierkantje
                                Dader1 = false
                            }
                    case .none:
                        Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                                .onTapGesture {
                                    self.activeDader1 = .vinkje
                                    Dader1 = false
                                }
                    }
                    
                    
                    
                    switch self.activeDader2 {
                    case .vierkantje:
                    Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader2 = .vinkje
                                Dader2 = true
                            }
                    case .vinkje:
                        Image(systemName: "checkmark.square" )
                            .foregroundColor(.blue)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader2 = .vraagteken
                                Dader2 = false
                            }
                    case .vraagteken:
                        Image(systemName: "questionmark.square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader2 = .kruisje
                                Dader2 = false
                            }
                    case .kruisje:
                        Image(systemName: "xmark.square" )
                            .foregroundColor(.red)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader2 = .vierkantje
                                Dader2 = false
                            }
                    case .none:
                        Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                                .onTapGesture {
                                    self.activeDader2 = .vinkje
                                    Dader2 = true
                                }
                    }
                    
                    switch self.activeDader3 {
                    case .vierkantje:
                    Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader3 = .vinkje
                                Dader3 = false
                            }
                    case .vinkje:
                        Image(systemName: "checkmark.square" )
                            .foregroundColor(.blue)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader3 = .vraagteken
                                Dader3 = true
                            }
                    case .vraagteken:
                        Image(systemName: "questionmark.square" )
                            .foregroundColor(.gray)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader3 = .kruisje
                                Dader3 = false
                            }
                    case .kruisje:
                        Image(systemName: "xmark.square" )
                            .foregroundColor(.red)
                            .font(.title)
                            .onTapGesture {
                                self.activeDader3 = .vierkantje
                                Dader3 = false
                            }
                    case .none:
                        Image(systemName: "square" )
                            .foregroundColor(.gray)
                            .font(.title)
                                .onTapGesture {
                                    self.activeDader3 = .vinkje
                                    Dader11 = false
                                }
                    }
                }

Answer 1

The problem is you are using @State instead of @Binding. The State of the view resets on appear, but @bindings are stored across the views. You should use like this:

@Binding var activeDader1: dader1
@Binding var activeDader2: dader2
@Binding var activeDader3: dader3