Search code examples
swiftuiuinavigationbartintwatchos-7

SwiftUI 2 / WatchOS7 - Changing NavigationBar button & text color (was tint color now accent color)

I updated my SwiftUI Watch App from Xcode 11 to Xcode 12, using the new Xcode 12 / SwiftUI LifeCycle methodology. Unfortunately in doing that the "tint color" (which defines the color of NavigationBar back button & test) is lost & reverts to the defaults (which is not what I want or had set before in Xcode 11).

Does anyone know how to change the color of the ‘back’ button & text on NavigationBar - using the new lifecycle SwiftUI with Xcode 12 & WatchOS7?

In xcode 11 one could change the ‘tint’ color using inspector on the StoryBoard to do that (for the whole App). But with the new SwiftUI lifecycle in xcode 12, I can’t figure out how this is now set (probably some parameter in ‘init()’ of App?)

I have tried the the below code but it gives the below syntax error (remember this is for WatchOS7):

"Cannot find 'UINavigationBarAppearance' in scope"

@main
struct myApp: App {
    
   init() {
        
    print("App Initializing....")
        
            let navBarAppearance = UINavigationBarAppearance()
            navBarAppearance.largeTitleTextAttributes = [.foregroundColor: UIColor.white]
            navBarAppearance.titleTextAttributes = [.foregroundColor: UIColor.white]
   }

   @SceneBuilder var body: some Scene {
            WindowGroup {
                ContentView()
        }
   }
}

Also tried:

@SceneBuilder var body: some Scene {
            WindowGroup {
                ContentView().accentColor(.white)
        }

But that has no effect (no matter where the .accentColor modifier is placed). Any help / suggestions?

Thanks!

Gerard

  1. SwiftUI NavigationBar WatchOS7
Solution

  • OK - figured it out from Apple Documentation! See: https://developer.apple.com/documentation/watchos-apps/setting-the-app-s-accent-color/

    and follow instructions for "Update Existing Projects"

    NOTE: The new "AccentColor" color set must be added to the assets in the Frameworks->AppName WatchKit App->Assets.xcassets file. This is the same file where the App's Icon is placed.