The current Material Design spec uses different names for the basic button types. New button widgets and themes with names that match the current spec will be added to the Material library. Eventually the old widgets and themes will be deprecated. Old Widget Old Theme New Widget New Theme FlatButton ButtonTheme TextButton TextButtonTheme RaisedButton ButtonTheme ElevatedButton ElevatedButtonTheme OutlineButton ButtonTheme OutlinedButton OutlinedButtonTheme The existing ButtonTheme can be configured with MaterialStateProperties. The new widgets and themes will support MaterialStateProperties in widget constructor parameters and in theme properties. The button implementations will allow MaterialStateProperty values that resolve to null, to defer, just as null widget parameters defer to theme properties and null theme properties defer to the widget’s default. Because most buttons have most visual properties in common, we’ll introduce a new ButtonStyle class that contains all of the common properties. ButtonStyle is analogous to TextStyle. Most ButtonStyle properties will be MaterialStateProperties. All of a button’s default colors will depend on the Theme’s ColorScheme which has dark and light variants. All of a button’s default colors are defined exclusively by the button’s widget class and will not depend on the overall Theme’s brightness. Although the button widgets are visually similar there are important differences. Some of them are obvious, e.g. ElevatedButton’s background is the color scheme’s primary color and TextButton’s background is transparent. Some are subtle, e.g. ElevatedButton’s overlay color is the color scheme’s primary color with 24% opacity and TextButton is the same color with 12% opacity. To configure a button in terms of the color scheme colors that it depends on, each of the button classes includes a static method that returns a ButtonStyle given one or more color scheme colors. This method essentially exposes the button’s visual defaults and is the preferred basis for simple customizations. DETAILED DESIGN/DISCUSSION ButtonStyle This is a new class. It is a simple container for the properties that most buttons have in common. In addition to reducing the size of the APIs for the button widgets and their themes, the ButtonStyle class makes it possible to define methods that produce or operate on this collection of properties as a whole. class ButtonStyle { const ButtonStyle({ this.textStyle, this.backgroundColor, this.foregroundColor, this.overlayColor, this.shadowColor, this.elevation, this.padding, this.minimumSize, this.side, this.shape, this.mouseCursor, this.visualDensity, this.tapTargetSize, this.animationDuration, This.enableFeedback, }); final MaterialStateProperty textStyle; final MaterialStateProperty backgroundColor; final MaterialStateProperty foregroundColor; final MaterialStateProperty overlayColor; final MaterialStateProperty shadowColor; final MaterialStateProperty elevation; final MaterialStateProperty padding; final MaterialStateProperty minimumSize; final MaterialStateProperty side; final MaterialStateProperty shape; final MaterialStateProperty mouseCursor; final VisualDensity visualDensity; final MaterialTapTargetSize tapTargetSize; final Duration animationDuration; final bool enableFeedback; // ... copyWith(), merge() } Each of ButtonStyle’s MaterialStateProperty attributes resolves to a primitive value based on the button’s state. This is essential because the Material spec and the Google Material variant of the Material spec, define visual property values in terms of a color scheme, a text theme, and the button’s state. All of the ButtonStyle properties are null by default. The button widgets themselves are responsible for defining comprehensive defaults for all of relevant style properties.