Segmented picker and title in toolbar .principal?

Using a ToolbarItemGroup(placement: .principal) and a segmented picker should get you close.

For example:

struct View2: View {
    @State private var selectedTab = Shapes.star

    var body: some View {
        Color.blue
            .toolbar {
                ToolbarItemGroup(placement: .principal) {
                    Picker("Selected Tab", selection: $selectedTab) {
                        ForEach(Shapes.allCases) { tab in
                            Label {
                                Text(tab.rawValue)
                            } icon: {
                                tab.image
                            }
                            .tag(tab)
                        }
                    }
                    .pickerStyle(.segmented)
                }
            }
    }
}
struct ContentView: View {
    var body: some View {
        NavigationStack {
            NavigationLink("Next") {
                View2()
            }
        }
    }
}

enum Shapes: String, Identifiable, CaseIterable {
    case star, square, triangle

    var id: String { rawValue }
    var image: Image {
        switch self {
        case .star: return Image(systemName: "star")
        case .square: return Image(systemName: "square")
        case .triangle: return Image(systemName: "triangle")
        }
    }
}

The title is missing though, that’s the main issue I'm having. I can only seem to either put the navigation title or the segmented picker.

In iOS, iPadOS, and tvOS, the system places the principal item in the center of the navigation bar. It takes precedent over a title specified through navigationTitle.

I understand .How can the app shown in the screenshot I provided accomplish this?