SWIFTUI - How to change the value of a random variable in an array?

Question

I am trying to build a simple whack-a-mole game with SwiftUI. What I want to do in the code below is for every time the second timer counts down, one of the member of the resimler array, which consists of resim1..resim9 changes to have the value "mavis" which is the name of the image in the library.

When I print(resimler) I can see from the output that a random element in that array have the value "mavis", no problem there. But the related image() in the body does not show the image in the simulator.

For example: ["", "mavis", "", "", "", "", "", "", ""]

I see that log in the outcome but Image(resim2) does not show the image.

How can I get it to show the image?

Thanks!

struct level1: View {

@State var resim1 = ""
@State var resim2 = ""
@State var resim3 = ""
@State var resim4 = ""
@State var resim5 = ""
@State var resim6 = ""
@State var resim7 = ""
@State var resim8 = ""
@State var resim9 = ""

 @State var timecounter = 5
 var timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()

func findMavis() {

    var resimler =  [self.resim1 , self.resim2 , self.resim3 , self.resim4 , self.resim5 , self.resim6 , self.resim7 , self.resim8 , self.resim9 ]

    let randomResim = Int(arc4random_uniform(UInt32(resimler.count - 1)))
    resimler[randomResim] = "mavis"
}
var body: some View {
VStack {

       Text("\(timecounter) seconds remaining").padding(.bottom, 50).onReceive(timer) { input in self.timecounter -= 1

              // the functions in this area will work every second
                     self.findMavis()

          // the functions after this will work after the timer stops
        if self.timecounter == 0 {
            self.timer.upstream.connect().cancel()



            }
        }
  HStack {
    Image(resim1).resizable()
            .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {

                if self.resim1 == "mavis" {
                    self.scoreUp() }
        }
            Image(resim2).resizable()
            .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
            if self.resim2 == "mavis" {
                                   self.scoreUp() }
        }
        Image(resim3).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim3 == "mavis" {
                                   self.scoreUp() }
        }
    }
  HStack {
    Image(resim4).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim4 == "mavis" {
                                   self.scoreUp() }
        }
        Image(resim5).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim5 == "mavis" {
                                   self.scoreUp() }
        }
        Image(resim6).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim6 == "mavis" {
                                   self.scoreUp() }
           }
    }
   HStack {
          Image(resim7).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim7 == "mavis" {
                                   self.scoreUp() }
        }
        Image(resim8).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim8 == "mavis" {
                                   self.scoreUp() }
        }
        Image(resim9).resizable()
        .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {
             if self.resim9 == "mavis" {
                                   self.scoreUp() }
        }
    }


 }
 }
 }

Answer 1

maybe you should read a beginner Swift Tutorial, how to assign variables...

by this:

var resimler =  [self.resim1 , self.resim2 , self.resim3 , self.resim4 , self.resim5 , self.resim6 , self.resim7 , self.resim8 , self.resim9 ]

    let randomResim = Int(arc4random_uniform(UInt32(resimler.count - 1)))
    resimler[randomResim] = "mavis" // this line is your error

you do not change your self.resim1-9 - Variables bei this line where i pointed the error to.

You can change the array to a @State Variable and change the values directly in the array and use theses values in Image like so : Image(resilmer[0]) and so on....

try this: (although i do not know what you want to do....but the code is "working" and no to spaghetti-like

struct ContentView: View {

    @State var timecounter = 5
    @State var score = 0

    var timer = Timer.publish(every: 1, on: .main, in: .common).autoconnect()

    func scoreUp() {
        score = score + 1
    }

    @State var resimler : [String] = ["","","","","","","","",""]

    func findMavis() {

        let randomResim = Int(arc4random_uniform(UInt32(resimler.count - 1)))
        self.resimler[randomResim] = "circle.fill"
    }
    var body: some View {
        VStack {
            Text("Score: \(score)")
                .font(Font.largeTitle)
            Text("\(timecounter) seconds remaining").padding(.bottom, 50).onReceive(timer) { input in self.timecounter -= 1

                // the functions in this area will work every second
                self.findMavis()

                // the functions after this will work after the timer stops
                if self.timecounter == 0 {
                    self.timer.upstream.connect().cancel()

                }
            }
            ForEach (0..<9) {index in
                Image(systemName:self.resimler[index]).resizable()
                    .frame(width: 100.0, height: 100.0).cornerRadius(50).onTapGesture {

                        if self.resimler[index] == "circle.fill" {
                            self.scoreUp() }
                }
            }
        }
    }
}