styleFrom static method

ButtonStyle styleFrom(
  1. {Color? foregroundColor,
  2. Color? backgroundColor,
  3. Color? disabledForegroundColor,
  4. Color? disabledBackgroundColor,
  5. Color? shadowColor,
  6. Color? surfaceTintColor,
  7. double? elevation,
  8. TextStyle? textStyle,
  9. EdgeInsetsGeometry? padding,
  10. Size? minimumSize,
  11. Size? fixedSize,
  12. Size? maximumSize,
  13. BorderSide? side,
  14. OutlinedBorder? shape,
  15. MouseCursor? enabledMouseCursor,
  16. MouseCursor? disabledMouseCursor,
  17. VisualDensity? visualDensity,
  18. MaterialTapTargetSize? tapTargetSize,
  19. Duration? animationDuration,
  20. bool? enableFeedback,
  21. AlignmentGeometry? alignment,
  22. InteractiveInkFeatureFactory? splashFactory}

A static convenience method that constructs a filled button ButtonStyle given simple values.

The foregroundColor, and disabledForegroundColor colors are used to create a MaterialStateProperty ButtonStyle.foregroundColor value. The backgroundColor and disabledBackgroundColor are used to create a MaterialStateProperty ButtonStyle.backgroundColor value.

The button's elevations are defined relative to the elevation parameter. The disabled elevation is the same as the parameter value, elevation + 2 is used when the button is hovered or focused, and elevation + 6 is used when the button is pressed.

Similarly, the enabledMouseCursor and disabledMouseCursor parameters are used to construct ButtonStyle.mouseCursor.

All of the other parameters are either used directly or used to create a MaterialStateProperty with a single value for all states.

All parameters default to null, by default this method returns a ButtonStyle that doesn't override anything.

For example, to override the default text and icon colors for a FilledButton, as well as its overlay color, with all of the standard opacity adjustments for the pressed, focused, and hovered states, one could write:

  style: FilledButton.styleFrom(foregroundColor:,
  onPressed: () {},
  child: const Text('Filled button'),

or for a Filled tonal variant:

  style: FilledButton.styleFrom(foregroundColor:,
  onPressed: () {},
  child: const Text('Filled tonal button'),


static ButtonStyle styleFrom({
  Color? foregroundColor,
  Color? backgroundColor,
  Color? disabledForegroundColor,
  Color? disabledBackgroundColor,
  Color? shadowColor,
  Color? surfaceTintColor,
  double? elevation,
  TextStyle? textStyle,
  EdgeInsetsGeometry? padding,
  Size? minimumSize,
  Size? fixedSize,
  Size? maximumSize,
  BorderSide? side,
  OutlinedBorder? shape,
  MouseCursor? enabledMouseCursor,
  MouseCursor? disabledMouseCursor,
  VisualDensity? visualDensity,
  MaterialTapTargetSize? tapTargetSize,
  Duration? animationDuration,
  bool? enableFeedback,
  AlignmentGeometry? alignment,
  InteractiveInkFeatureFactory? splashFactory,
}) {
  final MaterialStateProperty<Color?>? backgroundColorProp =
    (backgroundColor == null && disabledBackgroundColor == null)
      ? null
      : _FilledButtonDefaultColor(backgroundColor, disabledBackgroundColor);
  final Color? foreground = foregroundColor;
  final Color? disabledForeground = disabledForegroundColor;
  final MaterialStateProperty<Color?>? foregroundColorProp =
    (foreground == null && disabledForeground == null)
      ? null
      : _FilledButtonDefaultColor(foreground, disabledForeground);
  final MaterialStateProperty<Color?>? overlayColor = (foreground == null)
    ? null
    : _FilledButtonDefaultOverlay(foreground);
  final MaterialStateProperty<MouseCursor?> mouseCursor = _FilledButtonDefaultMouseCursor(enabledMouseCursor, disabledMouseCursor);

  return ButtonStyle(
    textStyle: MaterialStatePropertyAll<TextStyle?>(textStyle),
    backgroundColor: backgroundColorProp,
    foregroundColor: foregroundColorProp,
    overlayColor: overlayColor,
    shadowColor: ButtonStyleButton.allOrNull<Color>(shadowColor),
    surfaceTintColor: ButtonStyleButton.allOrNull<Color>(surfaceTintColor),
    elevation: ButtonStyleButton.allOrNull(elevation),
    padding: ButtonStyleButton.allOrNull<EdgeInsetsGeometry>(padding),
    minimumSize: ButtonStyleButton.allOrNull<Size>(minimumSize),
    fixedSize: ButtonStyleButton.allOrNull<Size>(fixedSize),
    maximumSize: ButtonStyleButton.allOrNull<Size>(maximumSize),
    side: ButtonStyleButton.allOrNull<BorderSide>(side),
    shape: ButtonStyleButton.allOrNull<OutlinedBorder>(shape),
    mouseCursor: mouseCursor,
    visualDensity: visualDensity,
    tapTargetSize: tapTargetSize,
    animationDuration: animationDuration,
    enableFeedback: enableFeedback,
    alignment: alignment,
    splashFactory: splashFactory,