How to handle custom colors for Dark Mode in Swift

Question

Here is how I'm currently handling UI Element Colors for Dark Mode with a fallback for older operating systems.

extension UIColor {
    class var mySystemBackground: UIColor {
        if #available(iOS 13, *) {
            return .systemBackground
        } else {
            return .white
        }
    }
}

On this casesystemBackground knows when it's in Dark Mode and when it's in Light Mode and it changes accordingly. I would like to do something similar using custom colors.

For instance I have a custom Yellow color that I'm currently using throughout my app and I would like to provide a different color for when in Dark Mode.

Here is the code I'm thinking...

extension UIColor{
    class var mySystemYellowColor: UIColor {
        // default light-color 
        var myYellow = UIColor(red: 254/255, green: 219/255, blue: 2/255, alpha: 1.0) /* #fedb02 */

        if #available(iOS 13.0, *) {  

            if traitCollection.userInterfaceStyle == .light {
                return myYellow
            } else {
                // color for dark mode in iOS 13.0
                myYellow = UIColor(red: 242/255, green: 125/255, blue: 0/255, alpha: 1.0) /* #f27d00 */
            }
            return myYellow

        } else {
            return myYellow
        }
    }
}

Is this an approachable way to handle custom colors for Dark Mode in iOS13 with a fallback for other operating systems?

If you can't afford to use color assets for any reason try the new color initializer. https://developer.apple.com/documentation/uikit/uicolor/3238041-init — Desdenova, Oct 21 '19 at 14:11

score 12 · Accepted Answer · answered Oct 21 '19 at 14:08

12

Create the colors in the asset catalog.

Colors in the asset catalog can be created for different Appearances and can be accessed with the UIColor(named:) API

Please see Supporting Dark Mode in Your Interface

answered Oct 21 '19 at 14:08

vadian

274,689
30
353
361

But I need to access the colors in code, is it possible to access the assets in code like images? Also, would it have a fallback for older operating systems? – fs_tigre Oct 21 '19 at 14:12
1

*But I need to access the colors in code*. Why? The colors seem to be constants. In versions prior to iOS 13 only the light appearance is used in the asset catalog. – vadian Oct 21 '19 at 14:15
1

1. Yes, just like he said, use `UIColor(named:)`. 2. No, this assumes you'll target iOS 11+, if you support lower versions, use the new color initializer in your `if #available(iOS 13.0, *)` – Desdenova Oct 21 '19 at 14:17
@Desdenova- If Understand you correctly when using Color assets in iOS11+ you don't need the fallback check, correct? – fs_tigre Oct 21 '19 at 14:59
My colors are calculated in code, they're not static. – algrid Jun 03 '21 at 10:30

score 2 · Answer 2 · answered Oct 21 '19 at 14:09

2

Yes it is use color assets and it has appearances set Any, Dark

And Then use asset name and UIColor(named: "AssetName") no need any version check or check Interface Style

answered Oct 21 '19 at 14:09

Tornike Davitashvili

52
3

score 0 · Answer 3 · answered Jan 10 '21 at 15:33

I added to Assets additional element - Color Set and determined 2 colors - for Light and Dark themes (source: https://skalolaskovy.ru/xcode/556-ios-dark-theme-support-simple-implementation Russian article). You can create some Color Sets as many as you need.

How to handle custom colors for Dark Mode in Swift

3 Answers3