SwiftUI conditional ToolbarItemGroup bottomBar on iOS 16

Question

Something has changed between iOS 15.5 and iOS 16 regarding conditional. In iOS 15.5 the following code allowed toggling the visibility of the bottom bar. In iOS 16 the bottom bar no longer toggles on.

If the default state for showBottomBar = true then the toolbar will appear initially but it will not be hidden when toggled (only the content will be hidden).

There is a new feature in Swift 4/iOS 16 that allows putting the condition outside the ToolbarItemGroup but this still does not toggle the bottom bar.

import SwiftUI

struct ContentView: View {
    @State private var showBottomBar = false

    var body: some View {
        List {
            Button("showBottomBar: \(showBottomBar ? "true" : "false")") { showBottomBar.toggle() }
        }
        .toolbar {
            ToolbarItemGroup(placement: .bottomBar) {
                if showBottomBar {
                    Text("Bottom Bar Content")
                }
            }
        }
    }
}

@main
struct MainApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

Screen recording showing working iOS 15.5 and not working iOS 16 in simulator: https://giphy.com/gifs/ios16-swift4-bug-1Y4N7OkDJ9IU6vkDI6

Does this answer your question? [Toolbar bottom iOS 16 - SwiftUI](https://stackoverflow.com/questions/73704536/toolbar-bottom-ios-16-swiftui) — lorem ipsum, Sep 14 '22 at 21:39
@loremipsum, your comment pointed me in the right direction. Thank you. — Gerry Shaw, Sep 15 '22 at 03:00

score 4 · Accepted Answer · answered Sep 15 '22 at 03:00

Thanks to @lorem-ipsum's comment and link to another answer I was able to find a work around for iOS 16.

It requires using NavigationStack and then the new .toolbar(.visible/.hidden, for: .bottomBar) method.

struct ContentView: View {
    @State private var showBottomBar = false

    var body: some View {
        NavigationStack {
            List {
                Button("showBottomBar: \(showBottomBar ? "true" : "false")") { showBottomBar.toggle() }
            }
            .toolbar(showBottomBar ? .visible : .hidden, for: .bottomBar)
            .toolbar {
                ToolbarItemGroup(placement: .bottomBar) {
                    Text("Bottom Bar Content")
                }
            }
        }
    }
}

SwiftUI conditional ToolbarItemGroup bottomBar on iOS 16

1 Answers1