title: SwiftUI animation/transition within scrollview behaving strange
body: <p>I have a ScrollView in SwiftUI with multiple elements, some of them expands on tap.</p>
  <pre><code>struct ExpandingView: View {
  
      @State var showContent = false
  
      var body: some View {
          VStack {
              HStack {
                  Button(action: {withAnimation {
                          self.showContent.toggle()
                      }
                  }) {
                      Image(systemName: &quot;chevron.right.circle&quot;)
                  }
                  Text(&quot;TITLE&quot;)
                      .padding(.leading, 10)
                  Spacer()
              }
              if showContent {
                  Text(&quot;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras volutpat dapibus ante eget laoreet. Aenean lacus elit, auctor ut nisl id, fermentum pretium mi. Quisque lacus nisl, suscipit hendrerit est sed, congue dictum augue. Suspendisse semper viverra accumsan. Maecenas commodo turpis convallis nisl bibendum pharetra.&quot;)
                      .transition(AnyTransition.move(edge: .top).combined(with: .opacity))
              }
          }
      }
  }
  
  struct Test: View {
  
      var body: some View {
          ScrollView {
              ExpandingView()
              ExpandingView()
              ExpandingView()
              Text(&quot;Some static text&quot;)
          }
      }
  }
  </code></pre>
  <p>If you try to open one of the expanding texts, you will see that the transition is not smooth, it kind of like jumps and then the transition starts.</p>
  <p><img src="https://media.giphy.com/media/cjhClEVwgsEQpkBGAv/giphy.gif" alt="Issue1" /></p>
  <p>So here is what I've tried:</p>
  <ul>
  <li>If I remove the scrollview and put this to VStack for example it is working fine, but that is not an option because I have much more elements which will not fit on the screen.</li>
  <li>I've tried to set an animation for the scrollview because I read that it solves this kind of problem, like this:</li>
  </ul>
  <pre><code>ScrollView {
              ExpandingView()
              ExpandingView()
              ExpandingView()
              Text(&quot;Some static text&quot;)
          }.animation(.spring())
  </code></pre>
  <p>It works fine in terms of the opening transition, it even looks better with the spring effect, but the spring animation for the whole scrollview plays when the view appears, which I don't want.</p>
  <p><img src="https://media.giphy.com/media/lTMG9mGD0X0qrksYtB/giphy.gif" alt="Issue2" /></p>
  <p>Again, if I change the ScrollView to a VStack, the animation does not play on appearing which is nice, but I have to use a scrollview. So the best solution for me would be to keep the animation for opening the texts, but somehow remove it when the view appears.</p>