timePickerTheme static method

TimePickerThemeData timePickerTheme({
  1. Color? backgroundColor,
  2. double? radius,
  3. double? elementRadius,
  4. InputDecorationTheme? inputDecorationTheme,
})

An opinionated TimePickerThemeData with custom corner radius.

Corner radius defaults to kDialogRadius. The internal shapes in the picker also have rounding, their corner radii are defined by elementRadius that defaults to kCardRadius 12.

In the InputDecorator, if you pass it an input decoration style that matches the main input decoration style and corner rounding it will be used on the data entry elements in the picker.

Implementation

static TimePickerThemeData timePickerTheme({
  /// Pass the value the `theme.dialogColor` that is set to your `ThemeData`
  /// and used by other dialogs.
  ///
  /// If null, this dialog defaults to using surface color and it may
  /// not match dialogColor used by other dialogs.
  ///
  /// FlexColorScheme sub-theming uses this property to match the background
  /// color to other dialogs.
  final Color? backgroundColor,

  /// Outer corner radius.
  ///
  /// Defaults to [kDialogRadius] = 28.
  final double? radius,

  /// Elements corner radius.
  ///
  /// Defaults to [kCardRadius] = 12.
  final double? elementRadius,

  /// An input decoration theme, for the time picker.
  ///
  /// You would typically pass in one that matches the main used input
  /// decoration theme in order to get same input style with possible
  /// rounding used in the app otherwise on the input fields in the picker.
  ///
  /// It adds the custom overrides to the passed in decorator, that the widget
  /// does internally to the default null InputDecorationTheme. There is
  /// no need to add those in the passed in InputDecorationTheme. Just pass
  /// in your overall used app InputDecorationTheme.
  final InputDecorationTheme? inputDecorationTheme,
}) =>
    TimePickerThemeData(
      backgroundColor: backgroundColor,
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(
          Radius.circular(radius ?? kDialogRadius),
        ),
      ),
      hourMinuteShape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(
          Radius.circular(elementRadius ?? kCardRadius),
        ),
      ),
      dayPeriodShape: RoundedRectangleBorder(
        borderRadius: BorderRadius.all(
          Radius.circular(elementRadius ?? kCardRadius),
        ),
      ),
      // Custom additions the Widget does internally, but for some reason
      // only does to null default theme. If you use a custom decorator
      // you are supposed to know that you have to add these shenanigans
      // for it to work and look right.
      inputDecorationTheme: inputDecorationTheme?.copyWith(
            contentPadding: EdgeInsets.zero,
            // Prevent the error text from appearing.
            // See https://github.com/flutter/flutter/issues/54104
            errorStyle: const TextStyle(fontSize: 0, height: 0),
          ) ??
          const InputDecorationTheme().copyWith(
            contentPadding: EdgeInsets.zero,
            // Prevent the error text from appearing.
            // See https://github.com/flutter/flutter/issues/54104
            errorStyle: const TextStyle(fontSize: 0, height: 0),
          ),
    );