title: SwiftUI Card Flip animation with two views, one of which is embedded within a Stack
body: <p>I'm trying to create a 'card flip' animation between two Views:</p>
  <ul>
  <li>View 'A' is a <code>CardView</code> within a <code>LazyVGrid</code></li>
  <li>View 'B' is a custom modal overlay view</li>
  </ul>
  <p>The <code>LazyVGrid</code> and View 'B' are together in a <code>ZStack</code></p>
  <p>Specifically, the <code>ContentView</code> is organized like so:</p>
  <pre><code>var body: some View {
      ZStack {
          NavigationView {
              ScrollView {
                  LazyVGrid(columns: columns, spacing: 10) {
                      ForEach(model.events, id: \.self) { event in
                          SmallCardView(event: event)
                              .opacity(!showModal || event != modifiableEvent ? 1.0 : 0.0)
                      }
                  }
              }
          }
          .brightness(self.showModal ? -0.1 : 0)
          .blur(radius: self.showModal ? 16 : 0)
          
          if self.showModal {
              AddEventView(
                  showModal: $showModal,
                  existingEvent: modifiableEvent,
              )
              .opacity(showModal ? 1.0 : 0.0)
              .padding(.horizontal, 16)
          }            
      }
  }
  </code></pre>
  <p>I came across <a href="https://stackoverflow.com/questions/60805244/swiftui-card-flip-with-two-views">this</a> SO post, and the answer seems super promising, however the answer doesn't take into account if one of the views is within a Stack / Grid, which is the case for me. So, my question is, how can I adapt the linked solution so that it works as expected if one of the views is indeed embedded within a Stack or a Grid.</p>
  <p><em>Edit</em>: Another thing to note is that the size and position of the Views are different</p>
  <p>I tried adding <code>.modifier(FlipEffect(flipped: $showModal, angle: animate3d ? 180 : 0, axis: (x: 0, y: 1)))</code> to both the <code>ZStack</code> and <code>SmallCardView</code>, however neither yielded the expected results.</p>
  <p>Thanks!</p>
  <p><em>Edit:</em> For clarity, I want to animate in a card flip style between these two views:</p>
  <p><a href="https://i.stack.imgur.com/95sq0.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/95sq0.jpg" alt="enter image description here" /></a></p>
  <p><a href="https://i.stack.imgur.com/3KCdf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3KCdf.png" alt="enter image description here" /></a></p>