Question

我一直想让它正常工作，基本上我有一个带有两个CheckBoxListTiles的ListView，当用户选择一个CheckBoxListTile时，弹出带有DatePicker的模式，我要实现的是在用户选择之后日期，将CheckBoxListTile文本（或我想的标题）更改为日期，这是到目前为止的代码。

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart' show timeDilation;

class ChecklistWidget extends StatefulWidget {
  @override
  _ChecklistWidget createState() => _ChecklistWidget();
}

class _ChecklistWidget extends State<ChecklistWidget> {
    String date1 = "";
    String date2 = "";
    Map<String, bool> values = {
    'Choose a specific date': false,
    'Choose an alternative date': false,
  };
  @override 
  Widget build(BuildContext build){

    return new ListView(
        shrinkWrap: true,
        children: values.keys.map((String key) {
          return new CheckboxListTile(
            title: new Text(key),
            value: values[key],
            onChanged: (bool value) {
              setState(() {
                values[key] = value;
                showCupertinoModalPopup(context: context, builder: (BuildContext context) { return _buildDatePicker(
                    CupertinoDatePicker(
                        mode: CupertinoDatePickerMode.dateAndTime,
                        initialDateTime: DateTime.now(),
                        onDateTimeChanged: (DateTime newDateTime) {
                           // date1 = newDateTime.toString();
                            print("Your Selected Date: ${newDateTime.day}");


                        },
                    ),
                    ); });
              });
              title: date1;
            },
          );
        }).toList(),
      );

  }

   Widget _buildDatePicker(Widget picker){
    return Container(
      height: 216.0,
      padding: const EdgeInsets.only(top: 6.0),
      color: CupertinoColors.white,
      child: DefaultTextStyle(   style: const TextStyle(
                color: CupertinoColors.black,
                fontSize: 22.0,
                ),
                child: GestureDetector(
                // Blocks taps from propagating to the modal sheet and popping.
                onTap: () {},
                child: SafeArea(
                    top: false,
                    child: picker,
                ),
                ),)
    );
  }
}

感谢任何帮助，我是新手，所以我确定我只是想念一些东西，但我无法将头包裹住。

Answer 1

我建议您不要循环使用地图键，因为日期数量有限，因此最好构建每个日期并相应地更新其值。

如果您确实有未知的日期数，最好将每个日期存储在具有label，value和enabled字段的模型中。

但这足以满足您的情况：

class _ChecklistWidget extends State<ChecklistWidget> {
  String date1;
  String date2;
  bool specificDateEnabled = false;
  bool alternativeDateEnabled = false;
  @override
  Widget build(BuildContext build) {
    return new ListView(shrinkWrap: true, children: [
      CheckboxListTile(
        title: Text(date1 ?? 'Choose a specific date'),
        value: specificDateEnabled,
        onChanged: (bool value) {
          setState(() {
            specificDateEnabled = value;
            showCupertinoModalPopup(
                context: context,
                builder: (BuildContext context) {
                  return _buildDatePicker(
                    CupertinoDatePicker(
                      mode: CupertinoDatePickerMode.dateAndTime,
                      initialDateTime: DateTime.now(),
                      onDateTimeChanged: (DateTime newDateTime) {
                        setState(() {
                          date1 = newDateTime.toString();
                        });
                      },
                    ),
                  );
                });
          });
        },
      ),
      CheckboxListTile(
        title: Text(date2 ?? 'Choose an alternative date'),
        value: alternativeDateEnabled,
        onChanged: (bool value) {
          setState(() {
            alternativeDateEnabled = value;
            showCupertinoModalPopup(
                context: context,
                builder: (BuildContext context) {
                  return _buildDatePicker(
                    CupertinoDatePicker(
                      mode: CupertinoDatePickerMode.dateAndTime,
                      initialDateTime: DateTime.now(),
                      onDateTimeChanged: (DateTime newDateTime) {
                        setState(() {
                          date2 = newDateTime.toString();
                        });
                      },
                    ),
                  );
                });
          });
        },
      ),
    ]);
  }

   Widget _buildDatePicker(Widget picker){
    return Container(
      height: 216.0,
      padding: const EdgeInsets.only(top: 6.0),
      color: CupertinoColors.white,
      child: DefaultTextStyle(   style: const TextStyle(
                color: CupertinoColors.black,
                fontSize: 22.0,
                ),
                child: GestureDetector(
                // Blocks taps from propagating to the modal sheet and popping.
                onTap: () {},
                child: SafeArea(
                    top: false,
                    child: picker,
                ),
                ),)
    );
  }
}

如何在特定事件后更改CheckboxListTile的标题？

1 个答案: