SwiftUI点击CHECK按钮修改指定按钮背景色问题求助

不用去引用按钮实例，SwiftUI是状态驱动的，通过添加状态变量和计算颜色的逻辑就能实现需求，具体修改步骤如下：

1. 添加状态变量标记是否已点击CHECK按钮
2. 让AnswerButton支持自定义背景色
3. 根据检查状态、正确选项、用户选择来计算每个按钮的背景色

修改后的完整代码：

import SwiftUI

struct Question {
    let questionText: String
    let AnswerChoices: [String]
    let correctChoiceIndex: Int
    
    // 示例数据，可根据实际结构调整
    static let AllQuestions: [Question] = [
        Question(questionText: "示例问题？", AnswerChoices: ["选项1", "选项2", "选项3"], correctChoiceIndex: 1)
    ]
}

struct ContentView: View {
    let question: Question
    @State private var guessedIndex: Int? = nil
    @State private var isChecked = false // 标记是否已点击CHECK
    
    var body: some View {
        VStack{
            Spacer()
            Text(question.questionText)
                .padding()
            
            VStack {
                ForEach(question.AnswerChoices.indices) { index in
                    AnswerButton(
                        text: question.AnswerChoices[index],
                        backgroundColor: buttonBackgroundColor(for: index)
                    ) {
                        guessedIndex = index
                    }
                    .border(selectChoice(at: index), width: 4)
                }
            }
            
            Spacer()
            Text(answerFeedbackText)
                .padding()
            Spacer()
            
            HStack{
                Button("CHECK") {
                    isChecked = true
                }
                .padding()
                .disabled(guessedIndex == nil) // 未选选项时禁用CHECK
                
                Button("NEXT") {
                    guessedIndex = nil
                    isChecked = false
                    // 此处添加切换到下一题的逻辑，比如更新question变量
                }
                .padding()
            }
        }
    }
    
    // 计算按钮背景色
    private func buttonBackgroundColor(for index: Int) -> Color {
        guard isChecked else { return .yellow }
        
        if index == question.correctChoiceIndex {
            return .green // 正确选项标绿
        } else if index == guessedIndex {
            return .red // 用户选错的标红
        }
        return .yellow // 其他保持原黄色
    }
    
    // 原有选中边框逻辑
    private func selectChoice(at buttonIndex: Int) -> Color {
        if buttonIndex == guessedIndex {
            return .gray
        } else {
            return .clear
        }
    }
    
    // 答题反馈文本
    private var answerFeedbackText: String {
        guard isChecked else { return "Answer feedback" }
        
        if guessedIndex == question.correctChoiceIndex {
            return "回答正确！"
        } else {
            return "回答错误，正确答案是：\(question.AnswerChoices[question.correctChoiceIndex])"
        }
    }
}

struct AnswerButton: View {
    let text: String
    let backgroundColor: Color
    let onClick: () -> Void
    
    var body: some View {
        Button(action: onClick) {
            Text(text)
        }
        .padding()
        .background(backgroundColor)
        .cornerRadius(8) // 可选：给按钮加圆角优化视觉效果
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        Group {
            ContentView(question: Question.AllQuestions[0])
        }
    }
}

额外优化点：

• 未选择选项时禁用CHECK按钮，避免无效点击
• 添加了动态答题反馈文本，根据结果显示不同内容
• 给按钮添加圆角，提升视觉体验

内容的提问来源于stack exchange，提问作者Flynn