swiftUI bottomBar toolbar disappears when going back

Question

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?

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()
    }
}

This was already reported https://stackoverflow.com/questions/63956668/swiftui-toolbar-disappears-after-following-navigationlink-and-coming-back — Asperi, Dec 03 '20 at 13:37

score 16 · Accepted Answer · edited Aug 23 '22 at 07:13

16

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())
    }
}

edited Aug 23 '22 at 07:13

Martijn Pieters

1,048,767
296
4,058
3,343

answered Dec 03 '20 at 13:49

Asperi

228,894
20
464
690

Nice workaround. It works with xCode 12.2 as well – georgeok Dec 03 '20 at 13:52
1

Does not work for me. XCode 12.4 (12D4e). – Sunkas Jan 28 '21 at 14:17
Works for me in Xcode 12.4 - almost forgot to include the onDisappear method which refreshes the ID. Thanks! – adamfootdev Mar 13 '21 at 18:04
1

any solution or recommendation? @asperi 's solution doesn't work for my situation – Vader Jun 22 '21 at 07:55

score 1 · Answer 2 · answered Jul 31 '21 at 14:43

1

This way is simpler and will help some people.

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

answered Jul 31 '21 at 14:43

gaohomway

2,132
1
20
37

This was the solution that worked. I had been using ToolbarItemGroups, so switched to just ToolbarItem. I only needed to do this on one of the two items to get the toolbar to show up when returning to the parent view. Thanks! – Gallaugher Jul 22 '22 at 17:26

score 0 · Answer 3 · answered Feb 05 '21 at 12:16

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)
            }
    }
}

swiftUI bottomBar toolbar disappears when going back

3 Answers3

Update: Fixed in Xcode 13.3 / iOS 15.4

Linked