时间戳

首页 > 解决方案 > UI颤动上未选择的RadioListTile列表

flutter - UI颤动上未选择的RadioListTile列表

问题描述

我正在构建一个问答应用程序。当我成功获取数据并显示每个问题的 RadioListTile 列表时，包括答案（A，B）。但是当我选择进入电台时。它不反映对 Ui 的更改意味着它不选择按下的单选按钮。我的代码在这里：

class CauHoiModel{
  int id;
  String dapAn;//A, B, C, D
  QuestionModel({this.id, this.dapAn});
}
class QuestionListState extends State<QuestionList>{
  List<CauHoiModel> _list = [];

  @override
  void initState() {
    for(var i = 0; i < widget.questions.length; i++){
      _list.add(CauHoiModel(id: widget.questions[i].id, dapAn: ""));
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Column(
            children:[
              Expanded(
                child: ListView.builder(
                  itemCount: widget.questions.length,
                  itemBuilder: (context, index) {
                    return Container(
                        padding: EdgeInsets.all(10.0),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text("Câu ${index+1} " + widget.questions[index].title,
                                style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold)
                            ),
                            RadioListTile(
                              title: Text(widget.questions[index].ABCD.answerA.value),
                              value: CauHoiModel(id: widget.questions[index].id, dapAn: "A"),
                              groupValue: _list[index],
                              onChanged: (value) {
                                setState(() {
                                  _list[index] = value;
                                });
                              },
                            ),
                            RadioListTile(
                              title: Text(widget.questions[index].ABCD.answerB.value),
                              value: CauHoiModel(id: widget.questions[index].id, dapAn: "B"),
                              groupValue: _list[index],
                              onChanged: (value) {
                                setState(() {
                                  _list[index] = value;
                                });
                              },
                            ),                            
                          ],
                        )
                    );
                  },
                ),
              ),
              Text(
                "$soPhut",
                style: TextStyle(fontSize: 25, color: Colors.red),
              )
            ]
        )
    );
  }
}

标签： flutter

解决方案

它需要selected设置属性。

简单地说，定义一个地图（或尽力而为）来存储答案，然后设置选定的属性RadioListTile

var answers = Map();

RadioListTile(
  ...
  selected : answers[index] == "A",
  onChanged : (value) {
    setState(() {
        ...
        answers[index] = "A";
    });
  },
),

RadioListTile(
  ...
  selected : answers[index] == "B",
  onChanged : (value) {
    setState(() {
        ...
        answers[index] = "B";
    });
  },
),

推荐阅读