showAnimatedTimePicker function

Future<TimeOfDay?> showAnimatedTimePicker({ required BuildContext context, required TimeOfDay initialTime, TimePickerEntryMode initialEntryMode = TimePickerEntryMode.dial, String? cancelText, String? confirmText, String? helpText, String? errorInvalidText, String? hourLabelText, String? minuteLabelText, EntryModeChangeCallback? onEntryModeChanged, bool useRootNavigator = true, RouteSettings? routeSettings, Offset? anchorPoint, })

Show TimeOfDay picker with easeInOutBack curve animation.

Implementation

Future<TimeOfDay?> showAnimatedTimePicker({
  required BuildContext context,
  required TimeOfDay initialTime,
  TimePickerEntryMode initialEntryMode = TimePickerEntryMode.dial,
  String? cancelText,
  String? confirmText,
  String? helpText,
  String? errorInvalidText,
  String? hourLabelText,
  String? minuteLabelText,
  EntryModeChangeCallback? onEntryModeChanged,
  bool useRootNavigator = true,
  RouteSettings? routeSettings,
  Offset? anchorPoint,
}) async {
  assert(debugCheckHasMaterialLocalizations(context));

  final Widget dialog = TimePickerDialog(
    initialTime: initialTime,
    initialEntryMode: initialEntryMode,
    cancelText: cancelText,
    confirmText: confirmText,
    helpText: helpText,
    errorInvalidText: errorInvalidText,
    hourLabelText: hourLabelText,
    minuteLabelText: minuteLabelText,
    onEntryModeChanged: onEntryModeChanged,
  );

  return showGeneralDialog<TimeOfDay?>(
    context: context,
    pageBuilder: (context, a1, a2) => dialog,
    useRootNavigator: useRootNavigator,
    routeSettings: routeSettings,
    anchorPoint: anchorPoint,
    transitionDuration: const Duration(milliseconds: 500),
    transitionBuilder: (conext, anim1, anim2, child) {
      final curveValue = Curves.easeInOutBack.transform(anim1.value) - 1.0;
      return Transform(
        transform: Matrix4.translationValues(0.0, curveValue * 200, 0.0),
        child: Opacity(
          opacity: anim1.value,
          child: dialog,
        ),
      );
    },
  );
}