flutter - 有什么方法可以使一个DateTimePicker flutter 地获得年，月，日和一个小时吗？

Question

我想要一个库比蒂诺(Cupertino)风格的选择器，可以选择年份，月份，天数和小时数，有人知道有什么包装或方法可以实现吗？
我想实现这样的目标，但是要有00-23个小时而不是红色圆圈:

Answer 1

您可以在CupertinoDatePicker和Row中使用CupertinoPicker。 CupertinoPicker用于选择以小时为单位的时间。如果CupertinoDatePicker的设计不是您想要的，则可以使用多个CupertinoPicker进行日期选择(年，月和日分别使用三个CupertinoDatePicker)。

  DateTime _selectedDate;
  String _selectedTime = '00';
  List<String> timeList = [];
  DateTime today;
  DateTime _date;
  String _time = '00';

  @override
  void initState() {
    super.initState();
    for (int i = 0; i < 24; i++) {
      timeList.add(i.toString().padLeft(2, '0'));
    }
    var now = DateTime.now();
    today = new DateTime(now.year, now.month, now.day);
    _date = today;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Pick a date'),
      ),
      body: Center(
        child: Container(
          child: Center(
            child: Column(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.all(80.0),
                  child: Text('Picked date and time: ' +
                      _date.year.toString() +
                      ' ' +
                      _date.month.toString() +
                      ' ' +
                      _date.day.toString() +
                      ' ' +
                      _time),
                ),
                CupertinoButton(
                  onPressed: showPicker,
                  child: Text('Pick'),
                  color: Colors.blueAccent,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  showPicker() {
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context) {
          return Container(
            height: 300,
            child: Column(
              children: <Widget>[
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: <Widget>[
                    CupertinoButton(
                      child: Text(
                        'Cancel',
                        style: TextStyle(color: Colors.grey),
                      ),
                      onPressed: () {
                        Navigator.of(context).pop();
                      },
                    ),
                    CupertinoButton(
                      child: Text(
                        'Done',
                        style: TextStyle(color: Colors.blue),
                      ),
                      onPressed: () {
                        setState(() {
                          _date = _selectedDate;
                          _time = _selectedTime;
                        });
                        Navigator.of(context).pop();
                      },
                    )
                  ],
                ),
                Container(
                    height: 200.0,
                    child: Flex(
                      direction: Axis.horizontal,
                      children: <Widget>[
                        Flexible(
                          flex: 8,
                          child: CupertinoDatePicker(
                            mode: CupertinoDatePickerMode.date,
                            initialDateTime: _date,
                            onDateTimeChanged: (DateTime dateTime) {
                              _selectedDate = dateTime;
                            },
                          ),
                        ),
                        Flexible(
                          flex: 2,
                          child: CupertinoPicker(
                              itemExtent: 38,
                              onSelectedItemChanged: (int index) {
                                setState(() {
                                  _selectedTime = timeList[index];
                                });
                              },
                              children: timeList
                                  .map(
                                    (item) => Center(
                                      child: Text(
                                        item,
                                        style: TextStyle(
                                          fontSize: 20,
                                        ),
                                      ),
                                    ),
                                  )
                                  .toList()),
                        ),
                      ],
                    )),
              ],
            ),
          );
        });
  }

结果: