How to reduce top padding of NavigationBar to match native Apple apps? [closed]

1 week ago 11
ARTICLE AD BOX

Here’s the working code that reduces the top padding and makes the navigation look like native Apple apps:

// NEW: fixed top padding NavigationStack(path: $projectRouter.path) { ProjectContentView(viewModel: viewModel) .environmentObject(router) .navigationTitle("Projects") .toolbarTitleDisplayMode(.inlineLarge) // <-- this fixes the large top padding .navigationDestination(for: ProjectRoute.self) { route in ProjectNavigationBuilder() .destinationView(for: route) } }

Old code that caused too much top padding:

// OLD: too much top padding NavigationStack(path: $projectRouter.path) { ProjectContentView(viewModel: viewModel) .environmentObject(router) .navigationTitle("Projects") .navigationBarTitleDisplayMode(.large) // <-- does not work .navigationDestination(for: ProjectRoute.self) { route in ProjectNavigationBuilder() .destinationView(for: route) } }

Summary: Use .toolbarTitleDisplayMode(.inlineLarge) instead of .navigationBarTitleDisplayMode to reduce the top padding in SwiftUI NavigationStack.

Read Entire Article