How to add a Topbar in the panel in VisionOS

Hi, I would like to add a topbar in the panel in VisionOS by using ToolbarTitleMenu, reffering to the document: https://developer.apple.com/documentation/swiftui/toolbartitlemenu, but in the simulator, I cannot see the topbar, what's wrong with my code?

Answered by Vision Pro Engineer in 799211022

Hey @YimingLi,

Great question. The ToolbarTitleMenu requires a navigation view (like NavigationStack) and a navigationTitle. Please update your code to be similar to the following:

NavigationStack {
    Text("Hello World")
        .navigationTitle("My Project")
        .toolbar {
            ToolbarTitleMenu {
                Button("New", systemImage: "pencil") {}
            }
        }
}

Let me know if you have more questions,

Michael

This is the general sample in WWDC24, and could someone please show me the detailed code?

Hey @YimingLi,

Great question. The ToolbarTitleMenu requires a navigation view (like NavigationStack) and a navigationTitle. Please update your code to be similar to the following:

NavigationStack {
    Text("Hello World")
        .navigationTitle("My Project")
        .toolbar {
            ToolbarTitleMenu {
                Button("New", systemImage: "pencil") {}
            }
        }
}

Let me know if you have more questions,

Michael

Thanks Michael @Vision Pro Engineer , and here is my code and preview, and how to position it to the center top of the screen like WWDC24 showed?

@Vision Pro Engineer I built it to VisionOS 2.0 simulator, here is the screenshot.

Hey @YimingLi,

I can't reproduce the issue you are encountering. The following code works for me. If you are unable to the toolbar title menu to appear please file a bug report with a sample project replicating your issue. Bug Reporting: How and Why? has tips on creating your bug report. Please post the FB number here once you do.

Thanks!
Michael

@main
struct ToolbarTitleMenuApp: App {
    var body: some Scene {
        WindowGroup {
            NavigationStack {
                Text("Content")
                    .navigationTitle("Title")
                    .toolbar {
                        ToolbarTitleMenu {
                            Button("New", systemImage: "pencil") {}
                        }
                    }
            }
        }
    }
}
How to add a Topbar in the panel in VisionOS
 
 
Q