swiftUI bottomBar toolbar disappears when going back

user_1199408 0
Viewed 2034

I have these swiftUI views and trying to use the toolbar (bottomBar). When you launch the app it appears fine, but after going to View2 using he navigationLink and then go back to the main view the toolbar disappears. It happens when the NavigationLink being inside the list. If you don't use a list (put the navigation link inside a VStack or similar) it works as expected and the toolbar reappears when you go back to the initial view. Is there a way to fix this?enter image description here

import SwiftUI

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

struct ContentView: View {
    var body: some View {
        NavigationView{
            List{
                NavigationLink(destination: View2()) {
                    Text("go to View2")
                }
                
            }
            .toolbar(content: {
                ToolbarItem(placement: .bottomBar, content: {
                    Text("toolbar item 1")
                })
            })
        }
        .navigationViewStyle(StackNavigationViewStyle())
            
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
swiftui ios
3 Answers

Update: Fixed in Xcode 13.3 / iOS 15.4

This is known bug. Here is possible workaround - force refresh on View2 disappeared (tested with Xcode 12.1 / iOS 14.1)

struct ContentView: View {
    @State private var refresh = UUID()

    var body: some View {
        NavigationView{
            List{
                NavigationLink(destination:
                        View2().onDisappear { refresh = UUID() }) { // << here !!
                    Text("go to View2")
                }
            }
            .toolbar(content: {
                 ToolbarItem(placement: .bottomBar, content: {
                      Text("toolbar item 1")
                 })
            }).id(refresh)                     // << here !!

        }
        .navigationViewStyle(StackNavigationViewStyle())
    }
}
user_122990300

This way is simpler and will help some people.

.toolbar {
      ToolbarItem(id: UUID().uuidString, placement: .bottomBar, showsByDefault: true) {
            AssetToolbarView(selectedCount: 0)
      }        
}
user_42182450

In my case I had to make sure that the toolbar is only visible in View1. To get this working I used a state variable to detect when View1 is viewed to the user.

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

struct View1: View {
    @State private var refresh = UUID()
    @State var isShown = true
    
    var body: some View {
            NavigationView {
                List {
                    NavigationLink(destination:
                        View2()
                            .onDisappear(perform: {
                                    if (isShown) {
                                        refresh = UUID()
                                    }
                            })
                            .onAppear(perform: { isShown = false })
                    ){
                       Text("Row1")
                    }
                }
                .onAppear(perform: {
                    isShown = true
                })
                .toolbar(content: {
                    ToolbarItem(placement: .bottomBar) {
                    Button(action: {
                        // Action
                    }) {
                        HStack(spacing: 10) {
                        Image(systemName: "plus.circle")
                        Text("Add")
                    }
                    }}
                })
                .id(refresh)
            }
    }
}
user_48159650
Related