1. Activate Dark Mode

In the view or controller overrideUserInterfaceStyle =. Dark print (traitCollection. UserInterfaceStyle) / / dark

But obviously that’s a lot to fit in, Considering the overrideUserInterfaceStyle this property of the influence of the link for the UIScreen UIWindow – UIController UIPresentController – UIView so after xcode11 // iPadOS not included

let scene = UIApplication.shared.connectedScenes.first? .delegate as? SceneDelegate scene?.window?.overrideUserInterfaceStyle = .darkCopy the code
  1. How to respond to Dark mode

After switching the dark mode in Macos, the system will automatically refresh the updateLayer() method of NSView. In UIView, there is no corresponding method, but we can use KVO listening. For example, when we switch the mode in personal Settings, Then you need to inform each home page to redraw the necessary parts

// Use a property to keep a reference to the key-value observation object. var observation: NSKeyValueObservation? func applicationDidFinishLaunching(_ aNotification: Notification) { observation = NSApp.observe(\.effectiveAppearance) { (app, _) in app.effectiveAppearance.performAsCurrentDrawingAppearance { // Invoke your non-view code that needs to be aware of  the // change in appearance. } } }Copy the code
  1. Color adaptation

Before iOS 13, UIColor could only represent one color. Starting with iOS 13, UIColor is a dynamic color that can have different colors in LightMode and DarkMode. How to create a Dynamic UIColor We mentioned above that the system provides some dynamic colors for us to use, but in normal development, the colors provided by the system will not be enough, so we will create dynamic colors ourselves. In iOS 13, UIColor added an initialization method that we can use to create dynamic colors. @available(iOS 13.0, *) public init(dynamicProvider: @escaping (UITraitCollection) -> UIColor)

This method requires passing in a closure that triggers the callback when the system switches between LightMode and DarkMode. This closure returns a UITraitCollection class whose userInterfaceStyle property we will use. UserInterfaceStyle is an enumeration declared as follows

@Available (iOS 12.0, *) Public enum UIUserInterfaceStyle: Int {Case Unspecified Case Light Case Dark}Copy the code

This enumeration will tell us whether LightMode or DarkMode is currently used as follows:

let backgroundColor = UIColor { (trainCollection) -> UIColor in 
    if trainCollection.userInterfaceStyle == .dark { 
        return UIColor.black 
    } else { 
        return UIColor.white 
    } 
}
Copy the code
  1. Graphics adapter

Open assets.xcassets and drag the image in to see a page that looks like this

Then we click on the last bar on the right toolbar and click on bench selection Any, Dark, as shown in the picture

Let’s drag in the DarkMode image as shown

Of course we can also use code:

// Image for light mode. let lightImage: UIImage! // Image for dark mode. let darkImage: UIImage! lightImage? .imageAsset? .register(darkImage, with: .init(userInterfaceStyle: .dark))Copy the code

This makes lightImage dynamic, but changing every image makes the code intrusive and expensive

4. Other Status Bar Before there were two Status Bar states, default and lightContent now there are three Status Bar states. Default, darkContent and lightContent Now darkContent corresponds to the previous default, Default now automatically selects darkContent and lightContent chrysanthemums as appropriate

Reference documents: juejin.cn/post/684490… Developer.apple.com/documentati…