Different Animation Types In SwiftUI

Animation in SwiftUI has few possible types.

If you don’t specify any of them then it’s the default one. The default is the same as .easyInOut.

To see what we have let’s create a view that will be animated and will take the animation to apply.

struct AnimationView: View {
    @State private var width: CGFloat = 300
    var animation: Animation

    var body: some View {
        Rectangle()
            .foregroundColor(.blue)
            .frame(width: width, height: 50)
            .onAppear(perform: {
                withAnimation(animation.repeatForever()) {
                    width = 0
                }
            })
    }
}

It’ll animate specified animation forever and it’ll change the width.

Now, create view of these views and use possible animation to see the difference between them.

var body: some View {
    VStack {
        AnimationView(animation: .easeIn)
        AnimationView(animation: .easeOut)
        AnimationView(animation: .easeInOut)
        AnimationView(animation: .linear)
        AnimationView(animation: .default)
        AnimationView(animation: .spring())
        AnimationView(animation: .interactiveSpring())
    }
}

If you want to slow them down you can change duration.

Result: