如何更改在 SwiftUI 中的 forEach 中动态创建的按钮的颜色

Question

我想在 swiftUI forEach 语句中用不同颜色更改不同按钮的颜色。更改按钮颜色时不应更改其他按钮的颜色。我怎样才能做到这一点？我的代码如下所示：

import SwiftUI

struct ColorModel: Identifiable {
    let value: Color
    let id = UUID()
}
let colors = [
    ColorModel(value: Color.orange),
    ColorModel(value: Color.green),
    ColorModel(value: Color.blue),
    ColorModel(value: Color.red),
    ColorModel(value: Color.yellow),
    ColorModel(value: Color.gray),
    ColorModel(value: Color.pink),
]
let totalButtons: Int = 10

struct ContentView: View {
    func updateSelectedButtons(value: Int) {
        if self.selectedButtons.contains(value) {
            if let index = self.selectedButtons.firstIndex(of: value) {
                self.selectedButtons.remove(at: index)
            }
        } else {
            if self.selectedButtons.count < 7 {
                self.selectedButtons.append(value)
            }
        }
    }
    @State private var selectedButtons: [Int] = [Int]()
    @State private var colorIndex: Int = 0
    var body: some View {
        ForEach(0 ..< totalButtons) { index in
            Button(action: {
                self.updateSelectedButtons(value: index)
                self.colorIndex += 1
            }) {
                Text("  ")
            }
            .background(self.selectedButtons.contains(index) ? colors[self.colorIndex].value : Color.white)
        }
    }
}

Answer 1

您可以尝试以下方法：

struct ContentView: View {
    @State private var selectedButtons = [Int]()

    var body: some View {
        ForEach(0..<totalButtons) { index in
            Button(action: {
                self.updateSelectButton(value: index) // <- on tap update selection
            }) {
                Text("Button \(index)")
            }
            .background(self.selectedButtons.contains(index) ? colors[index].value : Color.white) // <- if index is selected set color 
        }
    }

    func updateSelectButton(value: Int) {
        guard value < colors.count else { // <- make sure you don't go outside the `colors` range
            return
        }
        if let index = self.selectedButtons.firstIndex(of: value) {
            self.selectedButtons.remove(at: index)
        } else {
            self.selectedButtons.append(value)
        }
    }
}