Home > Blockchain >  SwiftUI color extension for creating theme
SwiftUI color extension for creating theme

Time:03-15

I want to create a theme collection using swift color but I don't know where I getting this wrong. because this throw error. I think it is obvious based on the code below but I'm new to SwiftUI!

Thank you.

 Import SwiftUI

enum Colors {
    enum Content {
        static var contentStrongestColor: Color {
            return color(
                dark: UIColor(red: 0.21568627655506134, green: 0.2549019753932953, blue: 0.3176470696926117, alpha: 1),
                light: UIColor(red: 0.8784313797950745, green: 0.8784313797950745, blue: 0.8784313797950745, alpha: 1)
            )
        }
  }
  enum Background {
   static var contentDefaultColor: Color {
            return color(
                dark: UIColor(red: 0.06666667014360428, green: 0.09019608050584793, blue: 0.15294118225574493, alpha: 1),
                light: UIColor(red: 1, green: 1, blue: 1, alpha: 1)
            )
        }
  }
}

extension Colors {
    static func colorColor(dark: Color, light: Color) -> Color{
        return Color { (UITraitCollection: UITraitCollection)
            switch UITraitCollection.userInterfaceStyle {
            case .dark: return dark
            case .light: return light
            default: return light
            }
        }
    }
}

enter image description here

CodePudding user response:

There are some code mistakes.

  1. You have created a function with the name colorColor but your are called a color
  2. Used wrong traitCollection

Here is the fixed code.

enum Colors {
    enum Content {
        static var contentStrongestColor: Color {
            return setColor(
                dark: Color(red: 0.21568627655506134, green: 0.2549019753932953, blue: 0.3176470696926117),
                light: Color(red: 0.8784313797950745, green: 0.8784313797950745, blue: 0.8784313797950745)
            )
        }
    }
    enum Background {
        static var contentDefaultColor: Color {
            return setColor(
                dark: Color(red: 0.06666667014360428, green: 0.09019608050584793, blue: 0.15294118225574493),
                light: Color(red: 1, green: 1, blue: 1)
            )
        }
    }
}

extension Colors {
    static func setColor(dark: Color, light: Color) -> Color {
        switch UIScreen.main.traitCollection.userInterfaceStyle {
        case .dark: return dark
        case .light: return light
        default: return light
        }
    }
}

CodePudding user response:

If your purpose is to have one color for the light theme and another one for the dark theme, Xcode has an easier way to do that. Follow these steps:

  1. Go to the "Assets" file (column on the left of Xcode, in the Project navigator)
  2. Right-click on the assets list (the column where you see "AccentColor") and select "New Color Set"
  3. Select the new item on the list called "Color" (you can change the name if you want, like "NameOfTheColorCreated") and open the attributes on the Inspector column, on the right side of the screen.
  4. You can select a color for the light theme on the box "Any appearance" and a different color on the box "Dark"
  5. In your code, you can use them as follows:
let myColor = Color(UIColor(named: "NameOfTheColorCreated") ?? .white)

When you use myColor, the color will automatically change if you change the appearance.

  • Related