SwiftUI——自定义颜色（UIColor和Color Set包括dark model黑暗模式）

苹果官方不建议自定义颜色，而是使用官方提供的颜色。详情参见：https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/

但是还是可以SwiftUI里自定义一些属性的颜色（例如背景），有两种办法：

 

UIColor：

第一种方法定义起来比较简单，如下：

struct secondThinkView: View {
    let brightRed = UIColor(displayP3Red: 1.0, green: 0.0, blue: 0.0, alpha: 1.0)
    var body: some View {
        VStack{  
                Spacer()
                Button(action: do) {
                    Text("1111")
                }
                .padding()
                .background(Color(brightRed))
        }
    }
}
                

或者这种格式：

struct secondThinkView: View {
    var body: some View {
        VStack{  
                Spacer()
                Button(action: do) {
                    Text("1111")
                }
                .padding()
                .background(Color(UIColor(displayP3Red: 1.0, green: 0.0, blue: 0.0, alpha: 1.0)))
        }
    }
}
          

这是P3色域下的格式。透明度部分（alpha）可以删掉。

不过需要注意，这里不是用的数字0到255定义RGB。而是0.0到1.0（包含小数），如果想使用255表示rgb，就用分数，比如123/255这样。

如果需要仅需要RGB格式，删除displayP3就可以了。

如果需要HSB格式，如下：

UIColor(hue: CGFloat, saturation: CGFloat, brightness: CGFloat, alpha: CGFloat)

 

Color Set：

第二种方法虽然麻烦一点，但是是一种非常方便的色彩管理手段。

在Xcode里，选择Assets.xcassets，并在图中区域右击，选择“Color Set”：

然后出现下图：

这样可以在右边侧栏的设置里设定该颜色集的相关属性和颜色：

Color Set：这里是Color Set（颜色集）相关属性。

• Name：自定义该颜色的名字，例如greenBlue。
• Devices：使用该颜色的设备，一般选择Universal（通用）就可以了。
• Appearances：这里面有“None”、“Any，Dark”和“Any，Light，Dark”三个选项，推荐选择“Any，Dark”就可以了。因为第三个的Any和Light的颜色设置应该是一样的。“Any Appearance”就是通用模式（包含了Light Mode）下显示的颜色，“Dark Appearance”就说设备设置为Dark Mode下显示的颜色。
• High Contrast：高对比度，这个设置一般UI设计用不到，一般用在图像处理。选择这个会让你设置四个颜色（luminosity意思是发光），如下：

• Gamut：这里设置色彩范围/色域。可选为“Any”和“sRGB and Display P3”，一般选Any即可。
• Localization：本地化/本土化。这个选项是可以设置在不同语言环境下显示不同颜色。默认只有English，想要添加或者更改该选项，点击左边侧栏最上面项目文件，选择Info，如下图：

然后如图所示位置，可以更改Localization属性。

 

Color：这里是定义颜色的部分。

• Content：这部分可以选择色域、颜色范围和一些系统自带的颜色。一般自定义颜色，选择“Display P3”。
• Input Method：如果Content选择色域或者范围，那么就会出现该属性。这里有“Floating point（0.0-1.0）”、“8-bit（0-255）”和“8-bit Hexadec”三个可选项，分别表示“浮点值（用0.0-1.0之间的值表示颜色的相关值）”、“8bit（用0-255表示颜色相关值）”和“十六进制表示法”。推荐“8-bit（0-255）”，因为很多网上的颜色都是用这种格式给的值，比较方便。

 

使用“Color Set”的方法如下：

//假如设定背景为自定义的颜色————字符串为定义的Color Set的Name属性
.background(Color("customColor"))

或者

// macOS
let aColor = NSColor(named: NSColor.Name("customColor"))

// iOS
let aColor = UIColor(named: "customColor")