如果我有 SwiftUI
Colorlet col: Color = Color(red: 0.5, green: 0.5, blue: 0.5)
如何从
colprint(col.components.red)
在 UIKit 中，我可以使用
UIColor.getRed您可以要求在给定的环境
中解析
Color组件，因为颜色在不同的环境中（例如在黑暗和明亮的环境中）是不同的。在下面的示例中，我使用所用颜色的当前环境解决了这个问题。
struct ContentView: View {
@Environment(\.self) var environment
@State private var color = Color.red
@State private var components: Color.Resolved?
var body: some View {
VStack {
ColorPicker("Select your favorite color", selection: $color)
if let components {
Text("R: \(components.red)")
Text("G: \(components.green)")
Text("B: \(components.blue)")
Text("A: \(components.opacity)")
Text("HEX: \(components.description)")
}
}
.padding()
.onChange(of: color, initial: true) { components = color.resolve(in: environment) }
}
}
上面的代码是使用 Xcode 15 beta 1 为 iOS 17 beta 1 编写的
Color
并返回
UIColor（对于iOS）或
NSColor（对于macOS）。在这些人的帮助下，您可以实现以下扩展：
import SwiftUI
#if canImport(UIKit)
import UIKit
#elseif canImport(AppKit)
import AppKit
#endif
extension Color {
var components: (red: CGFloat, green: CGFloat, blue: CGFloat, opacity: CGFloat) {
#if canImport(UIKit)
typealias NativeColor = UIColor
#elseif canImport(AppKit)
typealias NativeColor = NSColor
#endif
var r: CGFloat = 0
var g: CGFloat = 0
var b: CGFloat = 0
var o: CGFloat = 0
guard NativeColor(self).getRed(&r, green: &g, blue: &b, alpha: &o) else {
// You can handle the failure here as you want
return (0, 0, 0, 0)
}
return (r, g, b, o)
}
var hex: String {
String(
format: "#%02x%02x%02x%02x",
Int(components.red * 255),
Int(components.green * 255),
Int(components.blue * 255),
Int(components.opacity * 255)
)
}
}
Color.red.components.red // 0.9999999403953552 // <- SwiftUI Colors are not pure!
print(UIColor(Color.blue).cgColor.components)
您会得到 [红、绿、蓝、alpha] 的 [CGFloat]?
。
CustomStringConvertible
协议来处理简单的 rgba 情况，其中颜色描述格式为#rrggbbaa
debugPrint(Color.red)
debugPrint(Color(red: 1.0, green: 0.0, blue: 0.0))
debugPrint(Color(red: 1.0, green: 0.3, blue: 0.0))
debugPrint(Color(.sRGB, red: 1.0, green: 0.0, blue: 0.5, opacity: 0.3))
debugPrint(Color(hue: 1.0, saturation: 0.0, brightness: 1.0))
debugPrint(Color(.displayP3, red: 1.0, green: 0.0, blue: 0.0, opacity: 1.0).description)
red
#FF0000FF
#FF4C00FF
#FF00804D
#FFFFFFFF
"DisplayP3(red: 1.0, green: 0.0, blue: 0.0, opacity: 1.0)"
如您所见，像 Color.red 这样的东西只是转储“红色”，但如果您正在使用 由代码（即从颜色选择器）生成的简单 RGB 颜色，那么这还不错
extension SwiftUI.Color {
var redComponent: Double? {
let val = description
guard val.hasPrefix("#") else { return nil }
let r1 = val.index(val.startIndex, offsetBy: 1)
let r2 = val.index(val.startIndex, offsetBy: 2)
return Double(Int(val[r1...r2], radix: 16)!) / 255.0
}
var greenComponent: Double? {
let val = description
guard val.hasPrefix("#") else { return nil }
let g1 = val.index(val.startIndex, offsetBy: 3)
let g2 = val.index(val.startIndex, offsetBy: 4)
return Double(Int(val[g1...g2], radix: 16)!) / 255.0
}
var blueComponent: Double? {
let val = description
guard val.hasPrefix("#") else { return nil }
let b1 = val.index(val.startIndex, offsetBy: 5)
let b2 = val.index(val.startIndex, offsetBy: 6)
return Double(Int(val[b1...b2], radix: 16)!) / 255.0
}
var opacityComponent: Double? {
let val = description
guard val.hasPrefix("#") else { return nil }
let b1 = val.index(val.startIndex, offsetBy: 7)
let b2 = val.index(val.startIndex, offsetBy: 8)
return Double(Int(val[b1...b2], radix: 16)!) / 255.0
}
}
然后我发现使用
UIColor(self)
时，黑暗的外观会以某种方式消失。这是我想出的解决方法：注意，这仅适用于
iOS
，因为我的应用程序仅适用于
iOS，您当然可以像@Mojtaba Hosseini 一样进行操作，并将其适应
macOS。
extension Color {
var components: (r: Double, g: Double, b: Double, o: Double)? {
let uiColor: UIColor
var r: CGFloat = 0
var g: CGFloat = 0
var b: CGFloat = 0
var o: CGFloat = 0
if self.description.contains("NamedColor") {
let lowerBound = self.description.range(of: "name: \"")!.upperBound
let upperBound = self.description.range(of: "\", bundle")!.lowerBound
let assetsName = String(self.description[lowerBound..<upperBound])
uiColor = UIColor(named: assetsName)!
} else {
uiColor = UIColor(self)
}
guard uiColor.getRed(&r, green: &g, blue: &b, alpha: &o) else { return nil }
return (Double(r), Double(g), Double(b), Double(o))
}
}
这个想法是使用 UIColor(named:)
初始化器来代替，其中所有外观都是正确的。 幸运的是，我们在资产中设置的名称保存在
Color的描述中。我们只需要抽象它，因为还有其他信息，即捆绑等。
#if canImport(UIKit)
import UIKit
#elseif canImport(AppKit)
import AppKit
#endif
extension Color {
#if canImport(UIKit)
var asNative: UIColor { UIColor(self) }
#elseif canImport(AppKit)
var asNative: NSColor { NSColor(self) }
#endif
var rgba: (red: CGFloat, green: CGFloat, blue: CGFloat, alpha: CGFloat) {
let color = asNative.usingColorSpace(.deviceRGB)!
var t = (CGFloat(), CGFloat(), CGFloat(), CGFloat())
color.getRed(&t.0, green: &t.1, blue: &t.2, alpha: &t.3)
return t
}
var hsva: (hue: CGFloat, saturation: CGFloat, value: CGFloat, alpha: CGFloat) {
let color = asNative.usingColorSpace(.deviceRGB)!
var t = (CGFloat(), CGFloat(), CGFloat(), CGFloat())
color.getHue(&t.0, saturation: &t.1, brightness: &t.2, alpha: &t.3)
return t
}
}
做 asNative.redComponent 等也可能有效，仅供参考。
否 - 目前还没有 API 可以这样做，但是...
大多数 SwiftUI 结构体都具有private
字段，如
Color中所示。您可以使用
Mirror
来提取此类信息 - 但请记住，这效率不高。以下是如何提取 SwiftUI 的十六进制表示形式
Color
- 用于教育目的。将其复制并粘贴到
Xcode 11 游乐场中。
import UIKit
import SwiftUI
let systemColor = Color.red
let color = Color(red: 0.3, green: 0.5, blue: 1)
extension Color {
var hexRepresentation: String? {
let children = Mirror(reflecting: color).children
let _provider = children.filter { $0.label == "provider" }.first
guard let provider = _provider?.value else {
return nil
}
let providerChildren = Mirror(reflecting: provider).children
let _base = providerChildren.filter { $0.label == "base" }.first
guard let base = _base?.value else {
return nil
}
var baseValue: String = ""
dump(base, to: &baseValue)
guard let firstLine = baseValue.split(separator: "\n").first,
let hexString = firstLine.split(separator: " ")[1] as Substring? else {
return nil
}
return hexString.trimmingCharacters(in: .newlines)
}
}
systemColor.hexRepresentation
color.hexRepresentation
像
.red
、
.white等颜色，里面似乎没有太多信息，当
dumped.只是他们的“系统”名称。
▿ red
▿ provider: SwiftUI.(unknown context at $1297483bc).ColorBox<SwiftUI.SystemColorType> #0
- super: SwiftUI.(unknown context at $129748300).AnyColorBox
- base: SwiftUI.SystemColorType.red
使用
Color
/
red/
blue组件实例化的
green可以代替。
▿ #4C80FFFF
▿ provider: SwiftUI.(unknown context at $11cd2e3bc).ColorBox<SwiftUI.Color._Resolved> #0
- super: SwiftUI.(unknown context at $11cd2e300).AnyColorBox
▿ base: #4C80FFFF
- linearRed: 0.073238954
- linearGreen: 0.21404114
- linearBlue: 1.0
- opacity: 1.0
在 Playground 中，您会看到：
systemColor.hexRepresentation返回
nil
color.hexRepresentation返回
"#4C80FFFF"
extension UIColor {
func hexValue() -> String {
let values = self.cgColor.components
var outputR: Int = 0
var outputG: Int = 0
var outputB: Int = 0
var outputA: Int = 1
switch values!.count {
case 1:
outputR = Int(values![0] * 255)
outputG = Int(values![0] * 255)
outputB = Int(values![0] * 255)
outputA = 1
case 2:
outputR = Int(values![0] * 255)
outputG = Int(values![0] * 255)
outputB = Int(values![0] * 255)
outputA = Int(values![1] * 255)
case 3:
outputR = Int(values![0] * 255)
outputG = Int(values![1] * 255)
outputB = Int(values![2] * 255)
outputA = 1
case 4:
outputR = Int(values![0] * 255)
outputG = Int(values![1] * 255)
outputB = Int(values![2] * 255)
outputA = Int(values![3] * 255)
default:
break
}
return "#" + String(format:"%02X", outputR) + String(format:"%02X", outputG) + String(format:"%02X", outputB) + String(format:"%02X", outputA)
}
}
适用于 MacOS 14.X 索诺玛
func getRgbInfo(of color : Color) -> String {
// 1: convert SwiftUI.Color into NSColor with RGB colorspace
guard let nsColor: NSColor = NSColor(color).usingColorSpace(.sRGB) else { return "Error" }
// 2: create variables to be filled
var red : CGFloat = 0
var green : CGFloat = 0
var blue : CGFloat = 0
var alpha : CGFloat = 0
// 3: fill the variables
nsColor.getRed(&red, green: &green, blue: &blue, alpha: &alpha)
// 4: optional : Create Integer values
let redValue : Int = Int(red * 255)
let greenValue : Int = Int(green * 255)
let blueValue : Int = Int(blue * 255)
let alphaValue : Int = Int(alpha * 255)
// 5: return the result
return "(R: \(redValue), G: \(greenValue), B: \(blueValue), A: \(alphaValue)"
}