title: Transition issue on overlay
body: <p>I have an overlay that displays when a toggle is turned to true. When it is displayed, it's supposed to have a transition from right to left of the view for a nice transition between the views. The issue is the animation animates from the top right corner and shoots down, in a diagonal motion.</p>
  <p>I'm assuming either the animation is incorrect or theres something throwing off the animation of the overlay.</p>
  <p>Thank you in advance for your help.</p>
  <pre><code>struct createUserAccount: View {
      let transition: AnyTransition = .asymmetric(insertion: .move(edge:.trailing), removal: .move(edge: .leading))
      //Stores form info as userInfo, stored in userModel
      @ObservedObject var userInformation = FormViewModel()
      @ObservedObject var keyboardResponder = KeyboardResponder()
      @State private var showFitnessForm = false
  
      @Environment (\.managedObjectContext) var moc //calls managed Object context (datacore)
      @Environment (\.dismiss) var dismiss
      @FetchRequest(sortDescriptors: []) var allUsers: FetchedResults &lt;User&gt;
      
      init(){
          UITableView.appearance().backgroundColor = .clear
      }
    
      var body: some View {
              ZStack{
                  Form{
                      Section(){
                          TextField(&quot;FirstName&quot;, text: $userInformation.firstname)
                          TextField(&quot;LastName&quot;, text: $userInformation.lastname)
                          TextField(&quot;Email&quot;, text: $userInformation.email)
                              if userInformation.emailPrompt != &quot;&quot; {
                                  Text(userInformation.emailPrompt)
                                      .font(.caption).italic().foregroundColor(.red)
                                  
                              }
                          SecureField(&quot;Passsword&quot;, text: $userInformation.password
                                      ).autocapitalization(.none)
                              if userInformation.passwordPrompt != &quot;&quot; {
                                  Text(userInformation.passwordPrompt)
                                      .font(.caption).italic().foregroundColor(.red)
                              }
                          }
                              .listRowBackground(Color.clear)
                              .padding()
                              .navigationBarTitle(Text(&quot;Lets Get Started&quot;))
                              .navigationBarTitleDisplayMode(.automatic)
                              .font(.system(size:18))
                              .listStyle(GroupedListStyle())
                             
                          }
                                  Button(&quot;Continue&quot;){
                                      let newUser = User(context: moc)
                                      newUser.id = UUID()
                                      newUser.firstName = userInformation.firstname
                                      newUser.lastName = userInformation.lastname
                                      newUser.email = userInformation.email
                                      newUser.password = userInformation.password
                                      showFitnessForm.toggle()
                                     // dismiss()
                                  }
                                      .frame(width: 150, height: 20)
                                      .foregroundColor(.white)
                                      .padding()
                                      .background(LinearGradient(gradient: Gradient(colors: [.orange, .pink]), startPoint: .leading, endPoint: .bottom))
                                      .font(.title3)
                                      .background(.clear)
                                      .cornerRadius(5)
                                      .offset(y:30)
                                      .opacity(userInformation.isSignUpComplete ? 1 : 0.5)
                                      .offset(y: keyboardResponder.currentHeight*2)
                                      .disabled(!userInformation.isSignUpComplete)
                                      .frame(height: 300)
          
                              HStack{
                                  Text(&quot;Already a User?&quot;).italic().font(.callout)
                                  NavigationLink(destination: userLogin() .navigationBarHidden(true)){
                                      Text(&quot;Login&quot;)
                                          .foregroundColor(.pink).font(.callout)
                                  }
                              }
                  .offset(y:80)
                  .offset(y: keyboardResponder.currentHeight*2)
                 
              }
          
              .overlay(
                  showFitnessForm ? FitnessForm(
                  userFirstName: $userInformation.firstname,
                  userLastName: $userInformation.lastname,
                  userEmailAddress: $userInformation.email,
                  userLoginPassword: $userInformation.password
                  ) .animation(Animation.easeInOut(duration: 1.0), value: offset)
                      .transition(transition)  : nil )
      }
  }
  </code></pre>