苹果官方不建议自定义颜色,而是使用官方提供的颜色。详情参见: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")