Explicit animations using only an .animation modifier don't work

Viewed 626

I am playing with SwiftUI and I noticed that code from this Apple tutorial doesn't work as it supposed to. I want to have an animation applied for a scaleEffect but not for a rotationEffect but doing this as it is done in a mentioned tutorial doesn't work - when the .animation(nil) is added, there is no animation at all. Is this a bug or I am doing something wrong?

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

    var body: some View {
        Button(action: {
            self.showDetail.toggle()
        }) {
            Image(systemName: "chevron.right.circle")
                .imageScale(.large)
                .rotationEffect(.degrees(showDetail ? 90 : 0))
                .animation(nil)
                .scaleEffect(showDetail ? 1.5 : 1)
                .padding()
                .animation(.easeInOut(duration: 2))
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
1 Answers

Just place the .animation before .rotationEffect and it will not be applied on the effect

Image(systemName: "chevron.right.circle")
                .imageScale(.large)
                .scaleEffect(showDetail ? 1.5 : 1)
                .padding()
                .animation(.easeInOut(duration: 2))
                .rotationEffect(.degrees(showDetail ? 90 : 0))
Related