How to change BackgroundColor etc. of NavigationBar in Swift UI

Thing you want to do

Change the background color of the Navigation Bar in Swift UI I don't want to use ʻUI Appearance` (strong will)

Conclusion

--Changed BackgroundColor of NavigationBar without using ʻUINavigationBar.appearance () --ʻCreate View that you want to change the Style of NavigationBar with UIViewControllerRepresentable --Set the above View to .background () of View that uses NavigationBar

Preparation

import SwiftUI
import UIKit

struct NavigationConfigurator: UIViewControllerRepresentable {
    var configure: (UINavigationController) -> Void = { _ in }

    func makeUIViewController(context: UIViewControllerRepresentableContext<NavigationConfigurator>) -> UIViewController {
        UIViewController()
    }
    func updateUIViewController(_ uiViewController: UIViewController, context: UIViewControllerRepresentableContext<NavigationConfigurator>) {
        if let nc = uiViewController.navigationController {
            self.configure(nc)
        }
    }

}

Actual usage example

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Don't use .appearance()!")
            .navigationBarTitle("Try it!", displayMode: .inline)
            .background(NavigationConfigurator { nc in
                //OK in the same way as changing the style of the NavigationBar in UIKit
                nc.navigationBar.barTintColor = .blue
                nc.navigationBar.titleTextAttributes = [.foregroundColor : UIColor.white]
            })
        }
    }
}

preview

ss20201011

environment

As of October 11, 2020 Xcode 12.0.1 Swift 5.3 I don't know because I haven't verified the environment other than this. I think it is possible in an environment where Swift UI works

I want to change the background color of the Navigation Bar

For the time being, when I googled it quickly, in some articles, I wondered if it could only be done with ʻUINavigationBar.appearance ()` during the initialization process of the constructor etc.: sob:

Certainly, you can change what you can change with ʻUINavigationBar.appearance ()`, It is difficult to change the color for each screen (I mean, this is not possible, ...)

Thank you Stack Overflow!

SwiftUI update navigation bar title color Someone has taught me how to change it to a nice one: smile:

Disadvantages of this method

The style is not reflected unless the preview is set to live mode It doesn't matter because you only have to put it in live mode

So I was able to change the background color nicely using ʻUIViewControllerRepresentable` SwiftUI is still growing, so it seems that I have to master this child

Recommended Posts

How to change BackgroundColor etc. of NavigationBar in Swift UI
[Swift] How to dynamically change the height of the toolbar on the keyboard
[Swift UI] How to get the startup status of the application [iOS]
[swift5] How to specify color in hexadecimal
How to change app name in rails
[Swift] How to fix Label in UIPickerView
How to overwrite Firebase data in Swift
How to change the maximum and maximum number of POST data in Spark
How to change the value of a variable at a breakpoint in intelliJ
[swift5] How to change the color of TabBar or the color of item of TabBar with code
Summary of how to select elements in Selenium
How to add sound in the app (swift)
How to use JQuery in js.erb of Rails6
How to execute tasks in parallel in Swift in Swift Package
[Swift] How to get the number of elements in an array (super basic)
[swift] How to control the behavior when the back button of NavigationBar is pressed
How to get the ID of a user authenticated with Firebase in Swift
How to fix a crash when deleting Realm data in Swift UI List
How to implement UICollectionView in Swift with code only
[Swift] Save Color to User Defaults in Swift UI (memo)
[Rails] How to change the column name of the table
How to use CommandLineRunner in Spring Batch of Spring Boot
Summary of how to implement default arguments in Java
[Swift] How to get the document ID of Firebase
Display 3D objects of SceneKit with Swift UI, etc.
How to launch Swagger UI and Swagger Editor in Docker
How to change application.properties settings at boot time in Spring boot
Memo: [Java] How to check groupId etc. described in pom.xml
[Swift] How to use UserDefaults
How to use Swift UIScrollView
Photo library in Swift UI
How to implement infinite scrolling (page nate) in Swift TableView
How to change the setting value of Springboot Hikari CP
[Swift5] How to avoid applying dark mode (dark appearance) in code
How to implement one-line display of TextView in Android development
How to derive the last day of the month in Java
[Sprint Boot] How to use 3 types of SqlParameterSource defined in org.springframework.jdbc.core.namedparam
[Swift5] How to get an array and the complement of arrays
[Swift] How to implement the Twitter login function using Firebase UI ①
[Rails] How to change the page title of the browser for each page
How to delete large amounts of data in Rails and concerns
How to output a list of strings in JSF as comma-separated strings
How to implement UI automated test using image comparison in Selenium
[chown] How to change the owner of a file or directory
[Swift] How to implement the Twitter login function using Firebase UI ②
I want to change the value of Attribute in Selenium of Ruby
How to get the length of an audio file in java
How to increment the value of Map in one line in Java
How to use Lombok in Spring
How to find May'n in XPath
How to hide scrollbars in WebView
How to run JUnit in Eclipse
How to iterate infinitely in Ruby
[Rails] How to write in Japanese
How to run Ant in Gradle
[Swift] Change the textColor of UIDatePicker
How to master programming in 3 months
Create Master Detail in Swift UI
How to learn JAVA in 7 days
How to get parameters in Spark
How to change kube-proxy to ipvs mode.