title: SwiftUI Transitions of Conditional Child Views
body: <p>I'm trying to understand and experiment with swiftUI view transitions and could use some insight into why the following does not work the way I expect:</p>
  
  <pre><code>struct ContentView: View {
  @State private var showOverlay: Bool = false
  
  var body: some View {
      ZStack {
          VStack {
              Button(action: {
                  withAnimation(.easeInOut) {
                      self.showOverlay = true
                  }
              }) {
                  Text("Hello, World!")
              }
          }
          .zIndex(0)
          .animation(nil)
          .blur(radius: showOverlay ? 3 : 0)
  
          if showOverlay {
              HStack {
                  Button(action: {
                      withAnimation(.easeInOut) {
                          self.showOverlay = false
                      }
                  }) {
                      Text("Close")
                  }
                  .frame(width: 80, height: 80)
                  .background(Color.red)
                  .transition(.move(edge: .top))
  
                  Button(action: {
                      withAnimation(.easeInOut) {
                          self.showOverlay = false
                      }
                  }) {
                      Text("Close")
                  }
                  .frame(width: 80, height: 80)
                  .background(Color.red)
                  .transition(.move(edge: .bottom))
              }
              .zIndex(1.0)
          }
      }
  }
  </code></pre>
  
  <p>There is a conditional HStack of two buttons. 
  When the @State parameter <code>showOverlay</code> is changed it is done within a <code>withAnimation</code> block.
  The transitions on the individual buttons are not honored. </p>
  
  <p>If I remove the HStack, and put the zIndex(1) on each button, then the removal transition occurs, but not the insertion transition. </p>
  
  <p>I want both buttons to transition in their designated ways when their group is added to the view. </p>
  
  <p>Questions:
  Why does wrapping in an HStack cause the inner transitions to be ignored?
  Why does the edge transition only work in 1 direction?</p>