Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Why does the navigation title change from large to "scrolled" when popping a NavigationLink inside a NavigationStack on iOS 16?

I have run into some unexpected behavior when using a NavigationLink inside a NavigationStack. If I navigate from a view with a large navigation title to a view with an inline title, the title display mode does not automatically revert to large when navigating back to the original view – I have swipe down to "pull" the title back down to it's original position.

Example of the behavior

I would expect the out-of-the-box behavior to be the way it is in all of Apple's apps: large title animates smoothly into the "back" button in the NavigationLink destination view, then animates back to large size when popping the view.

I have isolated the issue to the .navigationBarTitleDisplayMode(.inline) modifier on the NavigationLink destination view, as commenting it out resolves the issue. This behavior is not present in the XCode (14 or 14.1) live preview, but it is present in the XCode simulator, running iOS 16 and 16.1 on both simulated and physical iPhones. I also confirmed the behavior in Swift Playgrounds version 4.2 on iPadOS 16.1

Here is some basic code that reproduces the issue, as seen above:

struct Test: View {
    var body: some View {
        NavigationStack {
            List {
                NavigationLink("Link") {
                    Text("Test")
                        .navigationTitle("Title")
                        .navigationBarTitleDisplayMode(.inline)

                }
            }
            .navigationTitle("Test View")
        }
    }
}

I'm curious if this behavior is just a simulator bug, or if it will show up in production apps. I would rather not fall back to NavigationView, if possible, since it has been deprecated; I want to try to future-proof my efforts as much as I can.

like image 742
jus10 Avatar asked Dec 22 '25 21:12

jus10


1 Answers

This is an issue when pushed sub-views have a dedicated .navigationBarTitleDisplayMode(.inline).

You can force the "large display mode" by setting .navigationBarTitleDisplayMode(.large) to your Test view inside the NavigationStack.

like image 113
Maschina Avatar answered Dec 24 '25 11:12

Maschina



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!