iOS开发 SwitfUI 12:颜色和颜色选择器 RGB转换

📅 2026/7/5 15:44:05
iOS开发 SwitfUI 12:颜色和颜色选择器 RGB转换
目录颜色的基本知识自定义颜色ColorPicker 颜色选择器 从Color获取RGB颜色的基本知识颜色的表示最常见的是RGB表示法但是还有一些别的表示法比如HSL具体遇到的时候不要惊慌每种表示法都是可以互相转换的。如果用过adobe的全家桶中的东西会知道出版业用的颜色表示法是减色法三原色是CMY青色、品红和黄色因为工业原料的原因这三种色兑不出纯黑所以打印机还需要单独的黑色墨盒当然这也符合成本经济性但是不是决定性的理由。扯这么多就让你知道RGB只是颜色表示法的一种不是唯一。RGB表示法每种颜色通常用一个字节来表示也就是0-255共256个档次。字节这概念不够高大上所以高级语言用浮点数也就是百分比来表示颜色255就是100%也就是1.0。所以swift的Color构造时RGB参数通常写作颜色值/255。自定义颜色下面的代码是一个标准的自定义颜色的界面State var R: CGFloat 0 State var G: CGFloat 0 State var B: CGFloat 0 var body: some View { Form { Rectangle() .fill(Color(red: R / 255, green: G / 255, blue: B / 255)) .frame(height: 200) Text(R \(Int(R))\nG \(Int(G))\nB \(Int(B))) Slider(value: $R, in: 0...255, step: 1).accentColor(.red) Slider(value: $G, in: 0...255, step: 1).accentColor(.green) Slider(value: $B, in: 0...255, step: 1).accentColor(.blue) } }初始随便弄一个颜色代码很简单没什么好解释的。其实我更愿意用整数但是Slider只能绑定浮点数所以只能用浮点数。ColorPicker 颜色选择器 从Color获取RGB这个系统组件比我们自己做的完善一些但是绑定的是Color类型Color类型有个大问题不能直接获得RGB甚至没有提供间接方法要想实现这个功能必须借助UIColor对象。下面的示例通过ColorPicker和之前的代码联动State var ColorValue:Color .black ColorPicker(颜色,selection: $ColorValue) .onChange(of: ColorValue) { var uicolor: UIColor {.init(ColorValue)} var r: CGFloat 0 var g: CGFloat 0 var b: CGFloat 0 var a: CGFloat 0 uicolor.getRed(r, green: g, blue: b,alpha: a) R r*255 G g*255 B b*255 }代码在onChange里手动将选取的Color值同步到之前的RGB上。UIColor可以用initColor来构造然后用UIColor的getRed方法来获取RGBA处处显示着设计混乱getRed为什么获取RGBA啊偷懒了吗alpha是透明度本质上不是颜色而是颜色叠加操作Color的构造不包含alpha。获取到的值是百分比因此放入我们定义的RGB时要乘以255不然显示的时候总是黑色因为数值太小。初始选择颜色选择的时候就已经直接在背景上生效了。选择颜色有三个页面三种方式滑块方式会显示RGB值由于我们用了数值转换转换后的值和这里显示的可能会略有差别这就是浮点数的问题正经C/C程序员不到万不得已是不会使用浮点数的。滑块方式关闭后注意到三个值都小了1吧。为了避免这个问题可以用浮点数来保存界面显示*255不过转成整数免不了精度问题。如果不是专门折腾颜色一般用ColorPicker也就满足需要了。