Customize navigation bar background

SwiftUI has some new APIs for iOS 16 to customize toolbars, including visibility and background. To set custom background on toolbars we can use toolbarBackground() modifier. To set a background on a navigation bar that shows when content scrolls behind the bar, we should specify a ShapeStyle, such as a color, material or gradient and navigationBar placement in the modifier.

struct ContentView: View {
    var body: some View {
        NavigationStack {
            List(1...20, id: \.self) {
                Text("\($0)")
            }
            .listStyle(.plain)
            .navigationTitle("My List")
            
            .toolbarBackground(.indigo, in: .navigationBar)
        }
    }
}

Level up your Swift skills!$35

100+ tips to take your Swift code to the next level

Swift Gemsby Natalia Panferova

• Advanced Swift techniques for experienced developers bypassing basic tutorials
• Curated, actionable tips ready for immediate integration into any Swift project
• Strategies to improve code quality, structure, and performance across all platforms

Level up your Swift skills!

100+ tips to take your Swift code to the next level

Swift Gems

by Natalia Panferova

$35