How to add a `min-height` to the Flutter `showTimePicker` dialog?

user_638153 0
Viewed 362

In a brand new Flutter project, if I add a showTimePicker widget, then open the time picker in input mode, the height of the dialog is shorter than the input mode contents, so you have to scroll to see the OK and Cancel buttons. This, even though the input mode is half as tall as the dial mode contents, which doesn't require scrolling.

Question: Is there any way to add padding or a min-height to a Flutter dialog such as the showTimePicker?

I've seen answers that describe sizing a container outside of/around the picker, or using the builder method, and others mentioning custom styling, but nothing for the size of the picker dialog itself that might address this vertical cutoff.

Flutter 2.0.3 - Device: Pixel XL with Android 10.

Any insights appreciated.

            TextButton(
              onPressed: () async {
                final _selectedTime = await showTimePicker(
                  context: context,
                  initialTime: TimeOfDay.now(),
                  initialEntryMode: TimePickerEntryMode.input,
                );

                if (_selectedTime != null) {
                  String thisHour = _selectedTime.hour <= 9
                      ? '0${_selectedTime.hour}'
                      : '${_selectedTime.hour}';
                  String thisMin = _selectedTime.minute <= 9
                      ? '0${_selectedTime.minute}'
                      : '${_selectedTime.minute}';
                  print('$thisHour:$thisMin');
                }
              },
              child: Text(
                'Test It',
                style: TextStyle(
                  fontSize: 22,
                ),
              ),
            ),

enter image description here

flutter-layout flutter
2 Answers

I solved this question this adding this code in showTimePicker builder.

builder: (context, childWidget) {
        return MediaQuery(
        data: MediaQuery.of(context).copyWith(
        textScaleFactor: 1),
});
user_94335450

The answer by zey is close to correct. This is a full working example:

await showTimePicker(
      context: context,
      initialTime: TimeOfDay.now(),
      builder: (context, childWidget) {
        return MediaQuery(
          data: MediaQuery.of(context).copyWith(textScaleFactor: 1),
          child: childWidget!,
        );
      },
    );

The issue is described in this flutter issue, and is happening at least since version 2.2 (and is still happening on Flutter 3.0.2)

user_34102320
Related