Creating a banner with a spring animation

A nice and configurable easing function is the spring, where the component bounces around the final value. We are going to implement a banner that is usually hidden, and when it appears, it moves from the top with a spring animation.

Getting ready

No external resources are needed, so let's just create a SwiftUI project in Xcode called BannerWithASpringAnimation.

How to do it…

This is a simple recipe, where we create a banner view that can be animated when we tap on a button:

1. Define a new view named BannerView. The code should be:

struct BannerView: View {
    let message: String
    var show: Bool
    
    var body: some View {
        Text(message)
         .font(.title)
         .frame(width:UIScreen.main.bounds.width - 20,
                   height: 100)
          .foregroundStyle(.white)
          .background(Color.green)
          .cornerRadius(10)
          .offset(y: show ?
                   -UIScreen.main.bounds.height...