title: This SwiftUI animation should only fade out. Why does it move to the right?
body: <p>I'm having a hard time understanding why this happens. I reduced the problem to its minimum expression.</p>
  <p>I have a single <code>Text</code> view, that when removed, should just fade out. The <code>.transition(.opacity)</code> has been added for clarity only. It should not be needed as it is the default. The result, however, is that in addition to the fade-out, the text view slides to the right.</p>
  <p>By playing with the text length, I realised that during the transition, its left margin wants to be aligned with the left margin of the <strong>CHANGE</strong> button. But why?!</p>
  <p>On the contrary, when added back, it works fine and there is no movement. Just a nice fade-in effect.</p>
  <p>The problem not only occurs with iOS, but macOS too. Using Xcode 11 beta 2.</p>
  <p><a href="https://i.stack.imgur.com/EHOu9.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/EHOu9.gif" alt="enter image description here" /></a></p>
  <pre class="lang-swift prettyprint-override"><code>import SwiftUI
  
  struct ContentView : View {
      @State private var showText = true
      
      var body: some View {
          VStack {
              Spacer()
              
              if showText {
                  Text(&quot;I should always be centered!&quot;)
                      .font(.largeTitle)
                      .transition(.opacity)
              }
              
              Spacer()
              
              Button {
                  withAnimation(.basic(duration: 1.5)) {
                      self.showText.toggle() 
                  }
              } label: {
                  Text(&quot;CHANGE&quot;)
                      .font(.title)
              }
              
              Spacer()
          }
      }
  }
  </code></pre>