Search code examples
iosswiftui-navigationlinkswiftui

NavigationView with ScrollView has unexpected velocity (or no animation) - Large Title + ScrollView - SwiftUI - iOS 14

There is an unexpected jump in the ScrollView when used in a NavigationView with large title.

The inconsistent behaviour can be seen below:

Incorect behaviour

The minimum code required to reproduce:

import SwiftUI

struct LeaderboardView: View {

    var body: some View {
        
        NavigationView(){
        
            ScrollView(){
                VStack(){
                        ForEach(0...50, id: \.self){ number in
                            Text("Number: \(number)").padding()
                        }
                    }.frame(maxWidth:.infinity)
                
            }.navigationBarTitle("Numbers")
            Spacer();
        }
        
    }
}

struct LeaderboardView_Previews: PreviewProvider {
    static var previews: some View {
       
            LeaderboardView()
        
    }
}

The weirder thing is that after I add vertical padding to the scroll view, the behaviour changes and it does not snap as fast as in the photo above, but it is still un-natural. This can also be reproduced in canvas while previewing.

The expected behaviour would be something like this:

activityApp

Even more on point would be the Settings page in WhatsApp.

I'm a beginner with Swift(UI). Is there a way to work around this? What am I missing?

Note: I am using XCode 12 beta 3

Solution

  • This issue has been solved with the Xcode Beta 4 and iOS 14 Beta 4 update. The NavigationView() with ScrollView() can be used with no problems.