我正在嘗試顯示用戶選擇的答案。
在下面的代碼中，我獲取了一個測驗串列并顯示出來。我試圖將用戶選擇的選項的背景顏色更改為與其他顏色不同的顏色，但是當我執行代碼時，所有測驗都會受到影響。
請提出一種簡單易行的方法，因為我并不是真正的 Flutter 開發人員，我只是在學習并且已經走得不遠了。
提前致謝
Widget MyQuizzesCardUI(String question, String OptionID, String Option1, String Option2, String Option3, String Option4, String MyChoice, String Status, int index) {
bool opt1 = false;
bool opt2 = false;
return Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
border: Border.all(color: Color(0xffefefef), width: 0.5)),
child: Column(
children: [
Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Container(
child: InkWell(
onTap: () {
opt1 = true;
opt2 = false;
setState(() {
opt1 = true;
opt2 = false;
});
},
child: Align(
alignment: Alignment.centerLeft,
child: Container(
width: double.infinity,
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: opt1 ? Color(0xffa4c3ff) : Colors.white,
),
child: Text(
"${Option1}",
),
),
),
),
),
Container(
child: InkWell(
onTap: () {
opt1 = false;
opt2 = true;
setState(() {
opt1 = false;
opt2 = true;
});
},
child: Align(
alignment: Alignment.centerLeft,
child: Container(
width: double.infinity,
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: opt2 ? Color(0xffa4c3ff) : Colors.white,
),
child: Text(
"${Option2}",
),
),
),
),
),
]
))
],
),
);
}
uj5u.com熱心網友回復：
it doesen't change becase when you call setState it reload the whole class so also it will set again to the begining value.
let's create a list like this:
List<Map<String, Bool>> options = [
{
"opt1": false;
"opt2": false;
}
];
and to fill up the list you can use this code in the initState like this:
@override
void initState() {
super.initState();
for(int i = 0; i>questions.length; i ) {
options.add({"opt1": false, "opt2": false});
}
in your widget it works than like this:
Widget MyQuizzesCardUI(String question, String OptionID, String Option1, String Option2, String Option3, String Option4, String MyChoice, String Status, int index) {
return Container(
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(8),
border: Border.all(color: Color(0xffefefef), width: 0.5)),
child: Column(
children: [
Container(
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Container(
child: InkWell(
onTap: () {
options[index]["opt1"] = true;
options[index]["opt2"] = false;
setState(() {
options[index]["opt1"] = true;
options[index]["opt2"] = false;
});
},
child: Align(
alignment: Alignment.centerLeft,
child: Container(
width: double.infinity,
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: options[index]["opt1"] ? Color(0xffa4c3ff) : Colors.white,
),
child: Text(
"${options[index]["opt1"]}",
),
),
),
),
),
Container(
child: InkWell(
onTap: () {
options[index]["opt1"] = false;
options[index]["opt2"] = true;
setState(() {
options[index]["opt1"] = false;
options[index]["opt2"] = true;
});
},
child: Align(
alignment: Alignment.centerLeft,
child: Container(
width: double.infinity,
padding: EdgeInsets.all(10),
decoration: BoxDecoration(
color: options[index]["opt2"] ? Color(0xffa4c3ff) : Colors.white,
),
child: Text(
"${options[index]["opt2"]}",
),
),
),
),
),
]
))
],
),
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/425483.html
下一篇：如何重置嵌套物件的值？