Flip animation in SwiftUI

Question

Created Jan ’22

Replies 1

Boosts 0

Views 2.6k

Participants 2

Hello everyone,
I would like to a flip animation, so that when I press on the rectangle it will flip to other side (like in a cards game) How can I do that?
Thank you

Here's my code:

import SwiftUI

import PlaygroundSupport



struct ContentView: View {

    var body: some View {

        

            Group {

                Button {

                    

                } label: {

                    Rectangle()

                        .frame(width: 140, height: 170)

                        .foregroundColor(Color(.systemTeal))

                        .cornerRadius(20)

                }

            }

    }

}



PlaygroundPage.current.setLiveView(ContentView())

Boost

Answer 1

Jad-T OP

Jan ’22

I think that the solution is in your previous thread, anyway here is the solution:

struct ContentView: View {
    @State private var flip: Bool = false
    var body: some View {
        Group {
            Button {
                withAnimation {
                    flip.toggle()
                }
            } label: {
                Rectangle()
                    .frame(width: 140, height: 170)
                    .foregroundColor(Color(.systemTeal))
                    .cornerRadius(20)
                    .rotation3DEffect(.degrees(flip ? 180 : 0), axis: (x: 0, y: 1, z: 0))
            }
        }
    }
}

0