@Binding var totalScore: Int
@State private var questionIndex = 0
@State private var answerIndex = 0
@State private var userAnswer: String = " "
let button = ["Confirm Answer"]
@State public var buttonConfirm = [Int]
let buttons = ["Check Answer"]
@State public var buttonCheck: Int?
var body: some View {
VStack(spacing: 1.0) {
//Multiple Choice Question Appears
VStack {
Text(MemorySA[questionIndex].question)
.foregroundColor(Color(red: 0.945, green: 0.442, blue: 0.022))
.padding(EdgeInsets(top: 10, leading: 10, bottom: 0, trailing: 10))
//VStack Allowing User To Enter Their Response
VStack {
TextField(
"Enter Answer",
text: $userAnswer
)
.disableAutocorrection(true)
.padding(.top, 10)
.foregroundColor(Color.clear)
}
.textFieldStyle(.roundedBorder)
.shadow(radius: 1)
.padding([.leading, .trailing], 15)
}
//Confirm Answer Button
HStack(spacing: 15) {
Spacer()
ForEach(0..<button.count, id: .self) {button in
Button {
//Increases Score By 1 If Answer Is Correct
if questionIndex == 0 {
answerIndex += 0 }
else if questionIndex == 1 {
answerIndex += 0 }
else if questionIndex == 2 {
answerIndex += 1 }
// Make sure the index doesn't go beyond the array size
if MemorySA.count > answerIndex + 1 {
answerIndex += 1
}
} label: {
Text("Check")
.padding(.vertical, 12.5)
.padding(.horizontal, 145)
.foregroundColor(.white)
.background(2 == button ? Color.primary: Color.secondary)
.clipShape(Capsule())
}
//'Continue' Button is Disabled if User Has Not Selected Values
.clipShape(Capsule())
}
Spacer()
}
Text((MemorySA[answerIndex].answer))
.padding(EdgeInsets(top: 10, leading: 10, bottom: 0, trailing: 10))
Spacer()
}
//Shows User Current Quiz Score
Text("Total Score = (totalScore)")
HStack(spacing: 15) {
ForEach(0..<button.count, id: .self) {button in
Button {
// Make sure the index doesn't go beyond the array size
if MemorySA.count > questionIndex + 1 {
questionIndex += 1
}
} label: {
//Disables Button If Answer Box Is Empty
ZStack {
if questionIndex != 2 {
Text("Confirm Answer")
.foregroundColor(.white) }
if questionIndex == 2 {
NavigationLink("Confirm Answer", destination: MemoryLAView())
.foregroundColor(.white)}
}}
.padding(.vertical, 12.5)
.padding(.horizontal, 120)
.foregroundColor(.white)
.foregroundStyle(.background)
.background(2 == button ? Color.primary: Color.secondary)
.clipShape(Capsule())
Hi, I understand this code probably looks confusing however im trying to only show the 'Text((MemorySA[answerIndex].answer))' line of code if the button is clicked. Is there any way I can adapt the above code?
Yes, it is really confusing, without a complete code of the class. And hard to check and test…
if the button is clicked.
Which button, there are many.
//'Continue' Button is Disabled
There is no Continue button here
So your code once formatted is:
HStack(spacing: 15) {
ForEach(0..<button.count, id: .self) {button in
Button {
} label: {
Text("Check")
.padding(.vertical, 12.5)
.padding(.horizontal, 145)
.foregroundColor(.white)
.background(2 == button ? Color.primary: Color.secondary)
.clipShape(Capsule())
}
//'Continue' Button is Disabled if User Has Not Selected Values
.clipShape(Capsule())
}
Spacer()
}
Text((MemorySA[answerIndex].answer))
.padding(EdgeInsets(top: 10, leading: 10, bottom: 0, trailing: 10))
The principle would be to declare a state var, that the button action toggles
@State var fire = false
// … More code here
HStack(spacing: 15) {
ForEach(0..<button.count, id: .self) {button in
Button {
fire = true // or fire.toggle()
} label: {
Text("Check")
.padding(.vertical, 12.5)
.padding(.horizontal, 145)
.foregroundColor(.white)
.background(2 == button ? Color.primary: Color.secondary)
.clipShape(Capsule())
}
//'Continue' Button is Disabled if User Has Not Selected Values
.clipShape(Capsule())
}
Spacer()
}
if fire { Text((MemorySA[answerIndex].answer))
.padding(EdgeInsets(top: 10, leading: 10, bottom: 0, trailing: 10)) }
That's just the principle, impossible to say more without the full code