如何在flutter中的showDatePicker上设置日期后显示showTimePicker？

在Flutter中，要在showDatePicker后显示showTimePicker，可以使用showModalBottomSheet方法结合DatePicker和TimePicker来实现。

首先，在showDatePicker的onDateChanged回调函数中，获取选中的日期，并使用Navigator.of(context).pop方法关闭DatePicker。

接下来，在关闭DatePicker后，使用showModalBottomSheet方法显示TimePicker。在TimePicker的onTimeChanged回调函数中，获取选中的时间，并使用Navigator.of(context).pop方法关闭TimePicker。

以下是示例代码：

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  DateTime selectedDate;
  TimeOfDay selectedTime;

  Future<void> _selectDateTime(BuildContext context) async {
    final DateTime pickedDate = await showDatePicker(
      context: context,
      initialDate: DateTime.now(),
      firstDate: DateTime(2022),
      lastDate: DateTime(2023),
    );
    if (pickedDate != null) {
      setState(() {
        selectedDate = pickedDate;
      });
      Navigator.of(context).pop(); // 关闭DatePicker
      _selectTime(context); // 打开TimePicker
    }
  }

  Future<void> _selectTime(BuildContext context) async {
    final TimeOfDay pickedTime = await showModalBottomSheet(
      context: context,
      builder: (BuildContext context) {
        return Container(
          height: 200.0,
          child: TimePickerDialog(
            initialTime: TimeOfDay.now(),
            onTimeChanged: (TimeOfDay time) {
              setState(() {
                selectedTime = time;
              });
              Navigator.of(context).pop(); // 关闭TimePicker
            },
          ),
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter DatePicker and TimePicker'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(
              'Selected Date:',
              style: TextStyle(fontSize: 20.0),
            ),
            Text(
              selectedDate == null
                  ? 'No date selected'
                  : selectedDate.toString(),
              style: TextStyle(fontSize: 18.0),
            ),
            SizedBox(height: 20.0),
            Text(
              'Selected Time:',
              style: TextStyle(fontSize: 20.0),
            ),
            Text(
              selectedTime == null
                  ? 'No time selected'
                  : selectedTime.toString(),
              style: TextStyle(fontSize: 18.0),
            ),
            SizedBox(height: 20.0),
            ElevatedButton(
              onPressed: () {
                _selectDateTime(context);
              },
              child: Text('Select Date and Time'),
            ),
          ],
        ),
      ),
    );
  }
}

class TimePickerDialog extends StatefulWidget {
  final TimeOfDay initialTime;
  final ValueChanged<TimeOfDay> onTimeChanged;

  TimePickerDialog({
    Key key,
    this.initialTime,
    this.onTimeChanged,
  }) : super(key: key);

  @override
  _TimePickerDialogState createState() => _TimePickerDialogState();
}

class _TimePickerDialogState extends State<TimePickerDialog> {
  TimeOfDay _selectedTime;

  @override
  void initState() {
    super.initState();
    _selectedTime = widget.initialTime;
  }

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            'Select Time',
            style: TextStyle(fontSize: 20.0, fontWeight: FontWeight.bold),
          ),
          SizedBox(height: 16.0),
          Row(
            children: <Widget>[
              Text(
                'Hour:',
                style: TextStyle(fontSize: 18.0),
              ),
              SizedBox(width: 16.0),
              DropdownButton<int>(
                value: _selectedTime.hour,
                items: List<DropdownMenuItem<int>>.generate(24, (int index) {
                  return DropdownMenuItem<int>(
                    value: index,
                    child: Text(index.toString()),
                  );
                }),
                onChanged: (int value) {
                  setState(() {
                    _selectedTime = TimeOfDay(hour: value, minute: _selectedTime.minute);
                  });
                },
              ),
            ],
          ),
          SizedBox(height: 16.0),
          Row(
            children: <Widget>[
              Text(
                'Minute:',
                style: TextStyle(fontSize: 18.0),
              ),
              SizedBox(width: 16.0),
              DropdownButton<int>(
                value: _selectedTime.minute,
                items: List<DropdownMenuItem<int>>.generate(60, (int index) {
                  return DropdownMenuItem<int>(
                    value: index,
                    child: Text(index.toString()),
                  );
                }),
                onChanged: (int value) {
                  setState(() {
                    _selectedTime = TimeOfDay(hour: _selectedTime.hour, minute: value);
                  });
                },
              ),
            ],
          ),
          SizedBox(height: 16.0),
          ElevatedButton(
            onPressed: () {
              widget.onTimeChanged(_selectedTime);
            },
            child: Text('Done'),
          ),
        ],
      ),
    );
  }
}

在这个示例中，我们创建了一个HomePage Widget，其中包含一个ElevatedButton用于选择日期和时间。在点击按钮时，会调用_selectDateTime方法来打开DatePicker。

在_selectDateTime方法中，首先显示DatePicker。当选择完日期后，会更新selectedDate的值并关闭DatePicker。接着调用_selectTime方法来打开TimePicker。

_selectTime方法使用showModalBottomSheet方法来显示TimePicker。当选择完时间后，会更新selectedTime的值并关闭TimePicker。

最后，我们在HomePage中显示选择的日期和时间，通过文本显示在界面上。

请注意，这里的DatePicker和TimePicker仅作为示例，您可以根据实际需求选择合适的DatePicker和TimePicker组件。