我们如何在 flutter 中一起使用时间和日期选择器？

Question

我想一起显示日期和时间选择器，但我认为没有任何小部件或库在 flutter 中提供此功能。有什么建议或解决方案吗？

Answer 1

如果您不想添加额外的包，请将showDatePicker和组合起来showTimePicker。

import 'package: flutter/material.dart';

Future<DateTime?> showDateTimePicker({
  required BuildContext context,
  DateTime? initialDate,
  DateTime? firstDate,
  DateTime? lastDate,
}) async {
  initialDate ??= DateTime.now();
  firstDate ??= initialDate.subtract(const Duration(days: 365 * 100));
  lastDate ??= firstDate.add(const Duration(days: 365 * 200));

  final DateTime? selectedDate = await showDatePicker(
    context: context,
    initialDate: initialDate,
    firstDate: firstDate,
    lastDate: lastDate,
  );

  if (selectedDate == null) return null;

  if (!context.mounted) return selectedDate;

  final TimeOfDay? selectedTime = await showTimePicker(
    context: context,
    initialTime: TimeOfDay.fromDateTime(selectedDate),
  );

  return selectedTime == null
      ? selectedDate
      : DateTime(
          selectedDate.year,
          selectedDate.month,
          selectedDate.day,
          selectedTime.hour,
          selectedTime.minute,
        );
}

Answer 2

在这里尝试一下希望对您有帮助。flutter_datetime_picker

在此包中，您需要选择日期和时间。

也尝试一下date_time_picker包

Updated Answer:

您根据需要使用flutter_cupertino_datetime_picker并设置日期格式

    ElevatedButton(
          onPressed: () {
            dateTimePickerWidget(context);
          },
          child: Text('Pick Date-Time'),
        ),

dateTimePicker 的方法：

  dateTimePickerWidget(BuildContext context) {
    return DatePicker.showDatePicker(
      context,
      dateFormat: 'dd MMMM yyyy HH:mm',
      initialDateTime: DateTime.now(),
      minDateTime: DateTime(2000),
      maxDateTime: DateTime(3000),
      onMonthChangeStartWithFirstDate: true,
      onConfirm: (dateTime, List<int> index) {
        DateTime selectdate = dateTime;
        final selIOS = DateFormat('dd-MMM-yyyy - HH:mm').format(selectdate);
        print(selIOS);
      },
    );
  }

你的输出：

16-Mar-2022 - 12:28

小部件的结果屏幕 ->

DateTimePicker 的结果屏幕 ->