swiftswiftui

How to leftalign Text in Toolbar under iOS 26


Before iOS 26 Beta I used to put custom navigation titles in the toolbar. Those were left aligned as desired

NavigationStack {
    Text("Hello, World!")
        .navigationBarTitleDisplayMode(.inline)
        .toolbar {
            ToolbarItem(placement: .topBarLeading) {
                Text("Good morning!")
            }
        }
}

However since the iOS 26 the items in .topBarLeading are treated as actions hence surrounded by Liquid Glass. Same code under iOS 26

For that reason I tried to change the placement to either .principal or .title. The problem is that most of the time this will align the Item in the topMiddle instead of topLeading (I prefer topLeading).

New code that doesn't work

Sometimes it did end up in the topLeading, but I could not figure out under what circumstances this happens. I also tried wrapping the Text in a leadingAligned HStack or .frame.
What I want is the topLeading alignment without LiquidGlass (the second picture but leftaligned). What is the preferred way to achieve that under iOS 26?


Solution

  • Use fixedSize to have the toolbar item match the size of the text, then use sharedBackgroundVisibility to hide the glass.

    .toolbar {
        ToolbarItem(placement: .topBarLeading) {
            Text("Good morning!")
                .fixedSize()
        }
        .sharedBackgroundVisibility(.hidden)
    }