Search Bar is briefly visible when navigating with NavigationStack (SwiftUI)

Question

I have a .searchable modifier on a list where I navigate to with new NavigationStack. However when the view loads the search box is briefly visible which looks weird. Am I using the navigation stack incorrectly or is this some kind of bug?

Here is an animated gif where a slowed down the animations so it is easy to see it on the List 1.

and here is the code to replicate it.

import SwiftUI

struct ContentView: View {
    var body: some View {
        TabView {
            View1()
                .tabItem {
                    Label("View 1", systemImage: "1.circle")
                }
            
            View2()
                .tabItem {
                    Label("View 2", systemImage: "2.circle")
                }
        }
    }
}

struct View1: View {
    enum Page {
        case listView1
        case listView2
    }
    
    var body: some View {
        NavigationStack {
            List {
                NavigationLink(value: Page.listView1) {
                    Text("List View 1")
                }
                
                NavigationLink(value: Page.listView1) {
                    Text("List View 2")
                }
            }
            .navigationDestination(for: Page.self) { page in
                switch page {
                case .listView1:
                    ListView1()
                case .listView2:
                    ListView2()
                }
            }
            .navigationTitle("View1")
        }
    }
}


struct ListView1: View {
    @State private var search: String = ""
    
    var body: some View {
        List {
            ForEach(1..<20) { i in
                Text("List \(i)")
            }
        }
        .searchable(text: $search)
        .navigationTitle("List View 1")
    }
}

struct ListView2: View {
    var body: some View {
        List {
            ForEach(1..<20) { i in
                Text("List \(i)")
            }
        }
        .navigationTitle("List View 2")
    }
}

struct View2: View {
    var body: some View {
        Text("View 2")
    }
}

I'm not sure if it'll fix the problem but it's a bad idea to have a switch inside `navigationDestination`. It's better to have multiple navigationDestinations for each kind of value. — malhal, Nov 28 '22 at 15:41
@malhal Untofuntanetly, it doesn't fix the issue, but I'm wondering, for the case above, how should I use the navigationDestionation for different views? — Can Celik, Nov 28 '22 at 18:14
Seeing the same thing, now also with Xcode 14.2. Haven't found a solution yet. — koen, Dec 18 '22 at 18:12

score 0 · Answer 1 · answered Nov 28 '22 at 18:45

I believe it's NavigationStack bug, I can reproduce it, too. As workaround you can switch to legacy NavigationView:

NavigationView {
    List {
        NavigationLink(destination: { ListView1() }) {
            Text("List View 1")
        }
        
        NavigationLink(destination: { ListView2() }) {
            Text("List View 2")
        }
    }
    .navigationTitle("View1")
}

it works fine

Search Bar is briefly visible when navigating with NavigationStack (SwiftUI)

1 Answers1