Swiftui:从JSON中获取动态颜色渐变

Question

对于数组中的每一项，我都希望加载JSON中定义的颜色的动态渐变。每件商品都有不同的颜色。

在JSON中，我将十六进制值存储在[String]中。我可以使用以下扩展来加载Color(hex:String(：在SwiftUI 中使用十六进制颜色

我一直在考虑以下几条实现路线，但Xcode抛出了各种错误，此外，它感觉像是一个黑客。我错过了什么？

示例型号：

struct Item: Codable, Identifiable, Hashable {
let colors: [String]
}

示例细节视图：

struct DetailView: View {
let item: Item
let gradientColors: [Color]
init(item: Item){
self.item = item
ForEach(item.colors) { color in
gradientColors.append(Color(hex: color))
}
}
var body: some View {
Circle()
.background(LinearGradient(gradient: Gradient(colors: gradientColors), startPoint: .leading, endPoint: .trailing))
}
}

Answer 1

在SwiftUI中，ForEach是一个视图，用于传递与UIKit中UIView的子视图类似的数据视图集合。所以不能在init方法中使用它。了解更多信息(https://developer.apple.com/documentation/swiftui/foreach)

正确使用代码：

struct Item: Codable, Identifiable {
var id = UUID()
let colors: [String]
}
struct ContentView: View {
let item: Item

init(item: Item){
self.item = item
}

var body: some View {
Circle()
.fill(LinearGradient(gradient: Gradient(colors: item.colors.map{Color(hex: $0)}), startPoint: .leading, endPoint: .trailing))
}
}

如果要使用forEach迭代数组，则需要使用与旧方法相同的方法。

示例：

struct ContentView: View {
let item: Item

var gradientColors: [Color] = []

init(item: Item){
self.item = item
item.colors.forEach { (strColor) in
gradientColors.append(Color(hex: strColor))
}
}

var body: some View {
Circle()
.fill(LinearGradient(gradient: Gradient(colors: gradientColors), startPoint: .leading, endPoint: .trailing))
}
}

还有一件事。如果尝试向圆添加渐变，则无法使用.background(LinearGradient。为此，您需要使用.fill

var body: some View {
Circle()
.fill(LinearGradient(gradient: Gradient(colors: gradientColors), startPoint: .leading, endPoint: .trailing))
}