styleFrom static method

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

A static convenience method that constructs an icon button ButtonStyle given simple values. This method is only used for Material 3.

The foregroundColor color is used to create a WidgetStateProperty ButtonStyle.foregroundColor value. Specify a value for foregroundColor to specify the color of the button's icons. The hoverColor, focusColor and highlightColor colors are used to indicate the hover, focus, and pressed states if overlayColor isn't specified.

If overlayColor is specified and its value is Colors.transparent then the pressed/focused/hovered highlights are effectively defeated. Otherwise a WidgetStateProperty with the same opacities as the default is created.

Use backgroundColor for the button's background fill color. Use disabledForegroundColor and disabledBackgroundColor to specify the button's disabled icon and fill color.

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 WidgetStateProperty 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 icon color for a IconButton, as well as its overlay color, with all of the standard opacity adjustments for the pressed, focused, and hovered states, one could write:

IconButton(
  icon: const Icon(Icons.pets),
  style: IconButton.styleFrom(foregroundColor: Colors.green),
  onPressed: () {
    // ...
  },
),

Implementation

static ButtonStyle styleFrom({
  Color? foregroundColor,
  Color? backgroundColor,
  Color? disabledForegroundColor,
  Color? disabledBackgroundColor,
  Color? focusColor,
  Color? hoverColor,
  Color? highlightColor,
  Color? shadowColor,
  Color? surfaceTintColor,
  Color? overlayColor,
  double? elevation,
  Size? minimumSize,
  Size? fixedSize,
  Size? maximumSize,
  double? iconSize,
  BorderSide? side,
  OutlinedBorder? shape,
  EdgeInsetsGeometry? padding,
  MouseCursor? enabledMouseCursor,
  MouseCursor? disabledMouseCursor,
  VisualDensity? visualDensity,
  MaterialTapTargetSize? tapTargetSize,
  Duration? animationDuration,
  bool? enableFeedback,
  AlignmentGeometry? alignment,
  InteractiveInkFeatureFactory? splashFactory,
}) {
  final Color? overlayFallback = overlayColor ?? foregroundColor;
  WidgetStateProperty<Color?>? overlayColorProp;
  if ((hoverColor ?? focusColor ?? highlightColor ?? overlayFallback) != null) {
    overlayColorProp = switch (overlayColor) {
      Color(a: 0.0) => WidgetStatePropertyAll<Color>(overlayColor),
      _ => WidgetStateProperty<Color?>.fromMap(
        <WidgetState, Color?>{
          WidgetState.pressed: highlightColor ?? overlayFallback?.withOpacity(0.1),
          WidgetState.hovered: hoverColor     ?? overlayFallback?.withOpacity(0.08),
          WidgetState.focused: focusColor     ?? overlayFallback?.withOpacity(0.1),
        },
      ),
    };
  }

  return ButtonStyle(
    backgroundColor: ButtonStyleButton.defaultColor(backgroundColor, disabledBackgroundColor),
    foregroundColor: ButtonStyleButton.defaultColor(foregroundColor, disabledForegroundColor),
    overlayColor: overlayColorProp,
    shadowColor: ButtonStyleButton.allOrNull<Color>(shadowColor),
    surfaceTintColor: ButtonStyleButton.allOrNull<Color>(surfaceTintColor),
    elevation: ButtonStyleButton.allOrNull<double>(elevation),
    padding: ButtonStyleButton.allOrNull<EdgeInsetsGeometry>(padding),
    minimumSize: ButtonStyleButton.allOrNull<Size>(minimumSize),
    fixedSize: ButtonStyleButton.allOrNull<Size>(fixedSize),
    maximumSize: ButtonStyleButton.allOrNull<Size>(maximumSize),
    iconSize: ButtonStyleButton.allOrNull<double>(iconSize),
    side: ButtonStyleButton.allOrNull<BorderSide>(side),
    shape: ButtonStyleButton.allOrNull<OutlinedBorder>(shape),
    mouseCursor: WidgetStateProperty<MouseCursor?>.fromMap(
      <WidgetStatesConstraint, MouseCursor?>{
        WidgetState.disabled: disabledMouseCursor,
        WidgetState.any: enabledMouseCursor,
      },
    ),
    visualDensity: visualDensity,
    tapTargetSize: tapTargetSize,
    animationDuration: animationDuration,
    enableFeedback: enableFeedback,
    alignment: alignment,
    splashFactory: splashFactory,
  );
}