Navigation title font cannot be changed

Question

Created Nov ’23

Replies 1

Boosts 0

Views 1.2k

Participants 2

I would like to change my visionOS app's title font to Copperplate, but the Simulator just ignores my code. I know that I'm modifying the right attributes because changing the foregroundColor to red works, it's just the font that always remains the default system title font and size. Here's my code, where everything in init() seems to have no effect at all:

struct ContentView: View
{
	@Environment(ViewModel.self) private var model

	init()
	{
		let appearance = UINavigationBarAppearance()
		appearance.titleTextAttributes = [.font: UIFont(name: "Copperplate", size: UIFont.preferredFont(forTextStyle: .title1).pointSize)!]
		UINavigationBar.appearance().standardAppearance = appearance
		UINavigationBar.appearance().scrollEdgeAppearance = appearance
	}

	var body: some View
	{
		@Bindable var model = model

		NavigationStack(path: $model.navigationPath)
		{
			BooksView()
				.tabItem { Label("Books", systemImage: "book") }
				.navigationTitle("Title Test")
				// .navigationDestination is also provided of course
		}
	}
}

However, configuring the appearance like this works fine:

appearance.titleTextAttributes = [.foregroundColor: UIColor.red]

Is this a limitation of the visionOS Simulator, or of visionOS, or am I doing something wrong?

Boost

Answer 1

alabertus OP

Apr ’24

I experienced the same issue. Appearance proxies are part of the UIKit API, so I don't think they are guaranteed to work in SwiftUI. They usually do because SwiftUI tends to wrap UIKit views, but that’s not necessarily the case for all platforms and versions.

As an alternative you can omit the navigationTitle modifier and use a toolbar with an item positioned to .navigationBarLeading, where you can apply any style you want:

.toolbar {
    ToolbarItem(placement: .navigationBarLeading) {
        Text("Title")
            .font(.largeTitle)
            .fontDesign(.rounded)
    }
}

The result in visionOS 1.1 looks the same as if you were able to style navigationTitle, but keep in mind that's not the case for other platforms like iOS.

0