3

How can I customize the native navigation bar in SwiftUI to resemble the one used in the Apple TV app for iOS? On the detail screen, there's a native navigation bar where the tint color of the toolbar button item and the navigation bar background change when scrolling.

I'm aware that I can replicate the same behavior by using a ZStack and a custom navigation bar, along with a GeometryReader to adjust the opacity. However, I'd like to achieve this using the native navigation bar and toolbar so that I can take advantage of all the built-in animations.

I've attempted to modify the color using .toolbarBackground(.gray.opacity(0.5), for: .navigationBar), but even when the opacity is set to 0, the color isn't completely clear. Also, how can I animate the color change during scrolling?

Detail screen with background image and white color Tool bar items with Blur circle background

Detail screen with white navigation bar when scroll down to content

Improve this question
1
  • Have you tried creating your own custom toolbar, and then setting its background color to clear? Like, literally .background(Color.clear)?
    – kiselitza
    Mar 30, 2023 at 11:58
Related questions
466
How can I change image tintColor in iOS and WatchKit
3
How can I change my SwiftUI background without losing the navigation bar UI?
444
Status bar and navigation bar appear over my view's bounds in iOS 7
Load 5 more related questions Show fewer related questions

0

Reset to default

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.