Skip to content

Latest commit

History

History
63 lines (46 loc) 路 1.76 KB

File metadata and controls

63 lines (46 loc) 路 1.76 KB

How to Style an ElevatedButton in Flutter

How do you style an ElevatedButton in Flutter?

Glad you asked. This is the simplest way:


Want a consistent style across all ElevatedButtons in your app?

Then set ThemeData.elevatedButtonTheme in your MaterialApp and you're good to go:


Of course, ButtonStyle has many properties:

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,
})

As usual, the documentation is your friend.

Complete article: How to style an ElevatedButton in Flutter


Found this useful? Show some love and share the original tweet 馃檹


Previous Next
How to Generate Fake data with the Faker package How to Validate a TextField in Flutter