ios – Views in SwiftUI array will not be being animated upon request

I am making this app that rolls random cube. I’ve a customized object that defines one cube object view. This object has two capabilities that begin and cease an animation on the view. When calling this repeatedly, they work, however the situation is that once I add the view to an array after which use ForEach to place them within the dad or mum view and name the animateDice() perform, the cube are nonetheless on display, however they don’t seem to be animated as they need to be.

Right here is the cube object:

struct DiceView : View, Identifiable {
let id = UUID()

let photographs: [UIImage] = [UIImage(named: "dice_1")!, UIImage(named: "dice_2")!, UIImage(named: "dice_3")!, UIImage(named: "dice_4")!, UIImage(named: "dice_5")!, UIImage(named: "dice_6")!]
    
    @State personal var currentImageIndex = 0
    @State personal var timer: Timer?

var physique : some View{
    VStack{
        Picture(uiImage: photographs[currentImageIndex])
            .font(.system(dimension: 30))
            .body(width: 40, top: 40, alignment: .middle)
    }
}

func animateDice(){
    timer = Timer.scheduledTimer(withTimeInterval: 0.06, repeats: true) { _ in
        currentImageIndex = (currentImageIndex + 1) % photographs.rely
    }
}

func stopAnimatingDice(){
    timer?.invalidate()
    timer = nil
}
}

The animation simply cycles via the entire cube photographs and is meant to cease randomly.

Right here is the code for my primary exercise (for lack of a greater time period):

struct ContentView: View {
@State var diceToRoll : String = "5"
@State var diceArray : [DiceView] = []

let uiNavAppearance = UINavigationBarAppearance()
let look: UITabBarAppearance = UITabBarAppearance()

var physique: some View {
    NavigationView{
        ZStack {
            VStack{
                HStack{
                    Spacer()
                    Textual content("Cube sort --->")
                        .padding(EdgeInsets(prime: 20, main: 0, backside: 0, trailing: 20))
                    Picture("dice_1")
                        .resizable()
                        .body(width: 35, top: 35)
                        .padding(EdgeInsets(prime: 20, main: -15, backside: 0, trailing: 20))
                        .foregroundColor(.crimson)
                        .onTapGesture {
                            // TODO: Change the cube sort
                        }
                }
                Spacer()
            }
            VStack{
                Textual content("Random Cube Curler")
                    .foregroundColor(.teal)
                    .font(.system(dimension: 35))
                    .daring()
                
                // TODO: Cube get loaded right here
                LazyVGrid(columns: [GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible()), GridItem(.flexible())], spacing: 20){
                    if(Int(diceToRoll) ?? 0 != 0){
                        // The cube from the array are saved right here
                        ForEach(diceArray) { die in
                            die
                        }
                    }
                }
                .body(alignment: .middle)
                .padding(EdgeInsets(prime: 0, main: 25, backside: 30, trailing: 25))
                
                HStack{
                    TextField("Quantity of cube", textual content: $diceToRoll)
                        .textFieldStyle(.roundedBorder)
                        .padding(EdgeInsets(prime: 0, main: 20, backside: 0, trailing: 10))
                        .keyboardType(.numberPad)
                        .onChange(of: diceToRoll){ _ in
                            if(Int(diceToRoll) ?? 0 != 0){
                                storeDice()
                            }
                        }
                    
                    Button("Roll Cube"){
                        rollDice()
                    }
                    .padding(EdgeInsets(prime: 0, main: 0, backside: 0, trailing: 20))
                    .buttonStyle(.borderedProminent)
                    .tint(.teal)
                }
            }
        }
        .navigationTitle("Random Cube Curler")
        .navigationBarTitleDisplayMode(.inline)
    }
}


// That is used so as to add the cube views to an array for use within the 'ForEach' object
personal func storeDice(){
    diceArray = []
    
    for _ in 1...Int(diceToRoll)!{
        diceArray.append(DiceView())
    }
}

personal func rollDice(){
    // MARK: NOT WORKING - Begin the animation for each cube
    for i in 0...diceArray.rely - 1{
        diceArray[i].animateDice()
    }
}
}

So, within the storeDice() perform, the cube are set to the array. I simply wish to level out that this works accurately because the cube are current within the array ans are correctly positioned on-screen with the ForEach object. The rollDice() is the place the issue lies: When calling the animateDice() perform on every particular person view in thee array, one way or the other the UI isn’t re-rendered with the modified attributes of the cube array. I nonetheless need to have the ability to use this array as a result of I wish to alter every cube individually as they’re producing random numbers.