SwiftUI Animate Image on Button

Question

Using SwiftUI, I'm trying to show an animated image and hide the text when the user clicks the button. Here is my code:

@State private var showingActivity = false

var body: some View {
    Button(action: {
        self.showingActivity.toggle()
    }) { 
        HStack {
            if self.showingActivity {
                Image(systemName: "arrow.2.circlepath")
                    .font(.system(size: 29))
                    .rotationEffect(.degrees(self.showingActivity ? 360.0 : 0.0))
                    .animation(Animation.linear(duration: 1.5).repeatForever(autoreverses: false))
            }
            else {
                Text("Continue")
            }
        }
    }
}

The Continue text appears and when clicked it disappears (as expected) and the image shows, but no animation. Any ideas what I might be doing wrong.

Thanks

Answer 1

or try this:

struct ImageView : View {

    @State private var showAction = false

    var body: some View {
        Image(systemName: "arrow.2.circlepath")
            .font(.system(size: 29))
            .rotationEffect(.degrees(self.showAction ? 360.0 : 0.0))
            .animation(self.showAction ? Animation.linear(duration: 1.5).repeatForever(autoreverses: false) : nil)
        .onAppear() {
            self.showAction = true
        }
    }
}

struct ContentView: View {
    @State private var showingActivity = false

    var body: some View {
        Button(action: {
            self.showingActivity.toggle()
        }) {
            HStack {
                if self.showingActivity {
                    ImageView()
                }
                else {
                    Text("Continue")
                }
            }
        }
    }
}