When a wrong option is selected, I want to show the wrong option in red and then the correct option in green automatically. But I couldn't do the algorithm for it. How can I do that ? I prepared a sample project about the structure I use. I couldn't show the correct option and the wrong option at the same time when only the wrong option was selected.
Model
struct QuestionContainer: Codable, Hashable {
var questions: [Question]?
}
struct Section: Codable, Hashable {
var a, b, c, d: String
private enum CodingKeys: String, CodingKey {
case a = "A"
case b = "B"
case c = "C"
case d = "D"
}
}
struct Question: Codable, Hashable {
var number: Int?
var question: String?
var sections: Section?
var price: Int?
var correct: String?
}
QuestionView
struct QuestionView: View {
@ObservedObject var questionViewModel: QuestionViewModel
var body: some View {
VStack {
Text(questionViewModel.question.questions?[0].question ?? "empty")
SectionView(sectionViewModel: SectionViewModel(section: questionViewModel.question.questions?[0].sections?.a ?? "empty", correct: questionViewModel.question.questions?[0].correct ?? "empty"))
SectionView(sectionViewModel: SectionViewModel(section: questionViewModel.question.questions?[0].sections?.b ?? "empty", correct: questionViewModel.question.questions?[0].correct ?? "empty"))
SectionView(sectionViewModel: SectionViewModel(section: questionViewModel.question.questions?[0].sections?.c ?? "empty", correct: questionViewModel.question.questions?[0].correct ?? "empty"))
SectionView(sectionViewModel: SectionViewModel(section: questionViewModel.question.questions?[0].sections?.d ?? "empty", correct: questionViewModel.question.questions?[0].correct ?? "empty"))
}
}
}
QuestionViewModel
class QuestionViewModel: ObservableObject {
@Published var question: QuestionContainer = QuestionContainer()
init() {
getQuestions()
}
func getQuestions() {
question = QuestionContainer(questions: [Question(number: 1, question: "What is the chemical formula for water ?", sections: Section(a: "CO2", b: "H2O", c: "C2H6O", d: "H2N"), price: 5, correct: "H2O")])
}
}
SectionView
struct SectionView: View {
@ObservedObject var sectionViewModel: SectionViewModel
@State var color: UIColor = .gray
var body: some View {
Button(action: {
sectionViewModel.selected = sectionViewModel.section
color = sectionViewModel.prepareResultColor()
print("correct: \(sectionViewModel.correct)")
print("selected: \(sectionViewModel.selected)")
}) {
ZStack {
RoundedRectangle(cornerRadius: 20)
.stroke(Color(color), lineWidth: 2)
.frame(width: 340, height: 50)
HStack {
Text(sectionViewModel.section)
.foregroundColor(Color(UIColor.gray))
.bold()
Spacer()
ZStack {
Circle()
.foregroundColor(Color(UIColor.orange))
Circle()
.stroke(Color(UIColor.orange).opacity(0.4), lineWidth: 2)
Image(systemName: "checkmark")
.resizable()
.frame(width: 12, height: 12)
.font(.system(size: 15, weight: .bold, design: .rounded))
.foregroundColor(.white)
}
.frame(width: 20, height: 20)
}
.padding(.horizontal)
.padding(.vertical, 12)
.frame(width: 340)
}
}
}
}
SectionViewModel
class SectionViewModel: ObservableObject {
@Published var section: String = ""
@Published var correct: String = ""
@Published var selected: String = ""
init(section: String, correct: String) {
self.section = section
self.correct = correct
}
func prepareResultColor() -> UIColor {
if correct == selected && selected != "" {
return .green
} else if correct != selected && selected != "" {
return .red
} else {
return .gray
}
}
}