Swiftui fullscreencover animation

SwiftUI FullscreenCover Animation

In SwiftUI, the `FullscreenCover` view modifier allows you to present a fullscreen modal view over your app’s content. You can animate the presentation and dismissal of the `FullscreenCover` by using the built-in animation modifiers provided by SwiftUI.

Let’s see an example:

import SwiftUI

struct ContentView: View {
  @State private var isPresentingModal = false
  
  var body: some View {
    VStack {
      Button("Present Modal") {
        isPresentingModal = true
      }
    }
    .fullScreenCover(isPresented: $isPresentingModal) {
      ModalView()
        .animation(.spring()) // Add animation modifier to the modal view
    }
  }
}

struct ModalView: View {
  @Environment(\.presentationMode) private var presentationMode
  
  var body: some View {
    VStack {
      Text("Modal View")
        .font(.largeTitle)
        .padding()
      
      Button("Dismiss") {
        presentationMode.wrappedValue.dismiss()
      }
    }
    .background(Color.white)
    .edgesIgnoringSafeArea(.all)
    .transition(.move(edge: .bottom)) // Apply transition animation to the modal view
  }
}

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

In this example, we have a button that triggers the presentation of the modal view (`ModalView`) using the `fullScreenCover` modifier. The `.spring()` animation modifier is applied to the modal view to create a smooth animation when it is presented.

Inside the `ModalView`, we have a dismiss button that utilizes the `presentationMode` environment variable to dismiss the modal view. The modal view itself has a background color, ignores the safe area, and uses the `.move(edge: .bottom)` transition animation to slide in from the bottom.

You can customize the animation by using a different animation modifier or applying multiple animations to different aspects of the view hierarchy.