首页 > 解决方案 > 在颤动中更改每个列表项的文本值

问题描述

我有一个按钮列表。onPressed 函数触发 datePicker 函数,选择日期后,按钮的文本应更改为选取的日期。每个日期都保存到一个 DateTime 值列表“日期”中,我稍后会使用它。日期列表和列表视图是动态的,它们的长度取决于用户选择的数字。我已初始化 buttonText 并将其在 initState 中的值设置为“日期”。问题是,在选择日期之后,每个按钮都显示相同的日期。

Future<DateTime> _pickDate() async {
    DateTime chosen = DateTime.now();
    DateTime date = await showDatePicker(
        context: context,
        initialDate: pickedDate,
        firstDate: DateTime(DateTime.now().year - 100),
        lastDate: DateTime.now());
    if (date != null) {
      setState(() {
        chosen = date;
        print(chosen);
        dates.add(chosen);
        print(dates);
      });
    }
    return chosen;
  }
Widget _dateList() {
    return Container(
      margin: EdgeInsets.all(10),
      width: MediaQuery.of(context).size.width * 0.8,
      height: MediaQuery.of(context).size.height * 0.1,
      decoration: BoxDecoration(
          //border: Border.all(
          //  color: Colors.red
          // )
          ),
      child: ListView.builder(
          scrollDirection: Axis.horizontal,
          shrinkWrap: true,
          itemCount:
              pregController.text == '' ? 0 : int.parse(pregController.text),
          itemBuilder: (BuildContext context, int index) {
            DateTime birth = DateTime.now();
            return Container(
              padding: EdgeInsets.all(5),
              width: MediaQuery.of(context).size.width * 0.3,
              child: RaisedButton(
                  color: Colors
                      .primaries[Random().nextInt(Colors.primaries.length)],
                  key: Key(index.toString()),
                  child: Text(
                    buttonText,
                    textAlign: TextAlign.center,
                    style: GoogleFonts.lato(
                        textStyle: TextStyle(
                      color: Colors.white,
                    )),
                  ),
                  onPressed: () async {
                    birth = await _pickDate();
                    setState(() {
                      buttonText =
                          '${dates[index].day}/${dates[index].month}/${dates[index].year}';
                    });
                  }),
            );
          }),
    );
  }

标签: datetimelistviewflutterbuttontext

解决方案


尝试这样的事情:

class Test1 extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => Test1State();

}

class Test1State extends State<Test1> {
  List<DateTime> dates = [
    DateTime.now(),
    DateTime.now(),
    DateTime.now(),
    DateTime.now(),
    DateTime.now(),
  ];

  @override
  Widget build(BuildContext context) => Scaffold(
    body: _dateList(),
  );

  Future<DateTime> _pickDate(DateTime initialDate) async {
    DateTime chosen = DateTime.now();
    DateTime date = await showDatePicker(
        context: context,
        initialDate: initialDate,
        firstDate: DateTime(DateTime.now().year - 100),
        lastDate: DateTime.now());
    if (date != null) {
      setState(() {
        chosen = date;
        print(chosen);
        dates.add(chosen);
        print(dates);
      });
    }
    return chosen;
  }

  Widget _dateList() {
    return Container(
      margin: EdgeInsets.all(10),
      width: MediaQuery.of(context).size.width * 0.8,
      height: MediaQuery.of(context).size.height * 0.1,
      decoration: BoxDecoration(
        //border: Border.all(
        //  color: Colors.red
        // )
      ),
      child: ListView.builder(
          scrollDirection: Axis.horizontal,
          shrinkWrap: true,
          itemCount: dates.length,
          itemBuilder: (BuildContext context, int index) {
            DateTime birth = DateTime.now();
            return Container(
              padding: EdgeInsets.all(5),
              width: MediaQuery.of(context).size.width * 0.3,
              child: RaisedButton(
                  color: Colors
                      .primaries[Random().nextInt(Colors.primaries.length)],
                  key: Key(index.toString()),
                  child: Text(
                    '${dates[index].day}/${dates[index].month}/${dates[index].year}',
                    textAlign: TextAlign.center,
                  ),
                  onPressed: () async {
                    birth = await _pickDate(birth);
                    setState(() {
                      dates[index] = birth;
                    });
                  }),
            );
          }),
    );
  }

}

推荐阅读