FlexSubThemes class

Contains static sub-theme helpers used by opt-in widget sub theming in FlexColorScheme.

FlexSubTheme offers optional opinionated static theme helpers. You can change many properties of the the opt-in setup by defining custom configuration values in the FlexSubThemesData configuration class, and passing it to the FlexColorScheme.subThemesData property.

To enable the component sub-themes using default settings, pass a default constructor FlexSubThemesData to FlexColorScheme.subThemesData.

The configuration class FlexSubThemesData offers easy to use configuration properties for using these sub-themes in FlexColorScheme.

You can if you wish, also the static sub-themes without even using FlexColorScheme based theming. The FlexSubThemesData configuration has no direct impact on these static helpers. It is FlexColorScheme that uses the FlexSubThemesData class to configure the opt-in sub-themes based on the setup information provided via FlexColorScheme.subThemesData.

These component themes are available:

In ToggleButtons hover, press, selected and focus states are not an exact match for the main buttons. It does not have as flexible styling as the main buttons. The theme mimics the style of the OutlinedButton for not selected buttons and the style of ElevatedButton for selected button. It does not support MaterialStateProperty and has only one state for different parts of the button. The selected and not selected, states would need different property values to be able to match the general buttons. It can therefore not fully match the same theme style as the Material states used on two different ButtonStyleButton buttons that it should match.

The theme ButtonThemeData is included to provide a very similar theme style on the deprecated legacy buttons RaisedButton, OutlineButton and FlatButton as on the current main buttons. It is not an exact match, since the legacy buttons do not offer as flexible styling as the newer buttons. They do follow and match the styling on ToggleButtons when it comes to hover, press, selected and focus. Please consider phasing out the legacy buttons, as they are deprecated and will be removed from the Flutter SDK. Their theme the ButtonThemeData will also soon be deprecated and later removed.

The following widgets that have rounded corners, but are excluded from the component theming for now:

  • Tooltip, generally so small that larger prominent rounding the opinionated sub-theming is designed for, is not a good fit. FlexColorScheme does include out of the box theming options for tooltips, that also adapts to color branding when opting in on sub themes, it also gets a bit more rounded than when not opting in on sub themes.
  • Scrollbar, rounding on edges of scrollbars are left to platform default.
  • The AppBar and BottomAppBar shape properties are left to defaults.
  • SnackBar the floating SnackBar should be themed to also include border radius, but the none floating one should remain straight. This cannot can be done via current theming features.
  • Drawer should have have rounding on shown side edge, it is in recent version (2.8.0) possible to assign a Shape in the drawer theme. But Drawer uses same theme, when used as Drawer and EndDrawer and the rounding should be on end edge on Drawer and start edge in EndDrawer. It seem we cannot do this without having two Shapes in its theme or other usage behavior modifying it. A default behavior in SDK can implement it by looking up if the Drawer is being used in Scaffold as Drawer or EndDrawer, but support via theme is needed too.

Properties

hashCode → int
The hash code for this object.
no setterinherited
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited

Methods

noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toString() → String
A string representation of this object.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited

Static Methods

bottomNavigationBar({required ColorScheme colorScheme, TextStyle? labelTextStyle, double? selectedLabelSize, double? unselectedLabelSize, SchemeColor? selectedLabelSchemeColor, SchemeColor? unselectedLabelSchemeColor, bool? mutedUnselectedLabel, double? selectedIconSize, double? unselectedIconSize, SchemeColor? selectedIconSchemeColor, SchemeColor? unselectedIconSchemeColor, bool? mutedUnselectedIcon, SchemeColor? backgroundSchemeColor, double? opacity, double? elevation, bool? showSelectedLabels, bool? showUnselectedLabels, BottomNavigationBarType? type, BottomNavigationBarLandscapeLayout? landscapeLayout, int unselectedAlphaBlend = kUnselectedBackgroundPrimaryAlphaBlend, int unselectedAlpha = kUnselectedAlphaBlend, bool useFlutterDefaults = false}) → BottomNavigationBarThemeData
An opinionated BottomNavigationBarThemeData with custom elevation.
bottomSheetTheme({Color? backgroundColor, Color? modalBackgroundColor, double? elevation, double? modalElevation, double? radius, Clip clipBehavior = Clip.antiAlias, BoxConstraints? constraints}) → BottomSheetThemeData
An opinionated BottomSheetThemeData with custom top corner radius.
buttonTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? radius, EdgeInsetsGeometry? padding, Size? minButtonSize}) → ButtonThemeData
An opinionated ButtonThemeData theme.
cardTheme({double? radius, double? elevation, Clip clipBehavior = Clip.antiAlias}) → CardTheme
An opinionated CardTheme with custom corner radius and elevation.
checkboxTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? splashRadius, bool unselectedIsColored = true}) → CheckboxThemeData
An opinionated CheckboxThemeData theme.
chipTheme({required ColorScheme colorScheme, SchemeColor? selectedSchemeColor, SchemeColor? baseSchemeColor, SchemeColor? deleteIconSchemeColor, required TextStyle labelStyle, double? radius, bool? useMaterial3}) → ChipThemeData
An opinionated ChipThemeData theme with custom border radius and a custom theme that partially mimics the M3 style in M2 and works well with FlexColorScheme surface blends.
dialogTheme({Color? backgroundColor, ColorScheme? colorScheme, SchemeColor? backgroundSchemeColor, double? radius, double? elevation, EdgeInsetsGeometry? actionsPadding}) → DialogTheme
An opinionated DialogTheme with custom corner radius and elevation.
elevatedButtonTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, SchemeColor? onBaseSchemeColor, double? radius, double? elevation, EdgeInsetsGeometry? padding, Size? minButtonSize, MaterialStateProperty<TextStyle?>? textStyle, bool useMaterial3 = false}) → ElevatedButtonThemeData
An opinionated ElevatedButtonThemeData theme.
floatingActionButtonTheme({ColorScheme? colorScheme, SchemeColor? backgroundSchemeColor, double? radius, bool useShape = true, bool alwaysCircular = false}) → FloatingActionButtonThemeData
An opinionated FloatingActionButtonThemeData with custom border radius.
inputDecorationTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? radius, FlexInputBorderType? borderType, bool filled = true, Color? fillColor, double? focusedBorderWidth, double? unfocusedBorderWidth, double gapPadding = 4, bool unfocusedHasBorder = true, bool unfocusedBorderIsColored = true, bool useMaterial3 = false}) → InputDecorationTheme
An opinionated OutlineInputBorder or UnderlineInputBorder using InputDecorationTheme, with optional fill color and adjustable corner radius.
An opinionated NavigationBarThemeData with a flat API.
An opinionated NavigationRailThemeData with simpler API.
outlinedButtonTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, SchemeColor? outlineSchemeColor, double? radius, double? pressedOutlineWidth, double? outlineWidth, EdgeInsetsGeometry? padding, Size? minButtonSize, MaterialStateProperty<TextStyle?>? textStyle, bool useMaterial3 = false}) → OutlinedButtonThemeData
An opinionated OutlinedButtonThemeData theme.
popupMenuTheme({double? radius, double? elevation, Color? color}) → PopupMenuThemeData
An opinionated PopupMenuThemeData with custom corner radius.
radioTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? splashRadius, bool unselectedIsColored = true}) → RadioThemeData
An opinionated RadioThemeData theme.
schemeColor(SchemeColor value, ColorScheme colorScheme) → Color
Returns the Color from passed in ColorScheme in colorScheme corresponding to the SchemeColor enum selection in value.
schemeColorPair(SchemeColor value, ColorScheme colorScheme) → Color
Returns the Color from passed in ColorScheme in colorScheme that is the color pair corresponding to the SchemeColor enum value passed in via value.
sliderTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? trackHeight, Color? valueIndicatorColor, TextStyle? valueIndicatorTextStyle}) → SliderThemeData
An opinionated SliderThemeData theme.
snackBarTheme({double? elevation, Color? backgroundColor, ColorScheme? colorScheme, SchemeColor? backgroundSchemeColor}) → SnackBarThemeData
An opinionated SnackBarThemeData with custom elevation.
switchTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, SchemeColor? thumbSchemeColor, double? splashRadius, bool unselectedIsColored = false, bool useMaterial3 = false}) → SwitchThemeData
An opinionated SwitchThemeData theme.
textButtonTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? radius, EdgeInsetsGeometry? padding, Size? minButtonSize, MaterialStateProperty<TextStyle?>? textStyle, bool useMaterial3 = false}) → TextButtonThemeData
An opinionated TextButtonThemeData theme.
timePickerTheme({Color? backgroundColor, ColorScheme? colorScheme, SchemeColor? backgroundSchemeColor, double? radius, double? elementRadius, InputDecorationTheme? inputDecorationTheme}) → TimePickerThemeData
An opinionated TimePickerThemeData with custom corner radius.
toggleButtonsTheme({required ColorScheme colorScheme, SchemeColor? baseSchemeColor, double? radius, double? borderWidth, Size? minButtonSize, VisualDensity? visualDensity, bool useMaterial3 = false}) → ToggleButtonsThemeData
An opinionated ToggleButtonsThemeData theme.
tooltipTheme({required ColorScheme colorScheme, SchemeColor? backgroundSchemeColor, Color? backgroundColor, Color? foregroundColor, int? backgroundAlpha, double? borderRadius, Color? borderColor, TextStyle? textStyle, EdgeInsetsGeometry? padding, EdgeInsetsGeometry? margin, Duration? waitDuration, Duration? showDuration}) → TooltipThemeData
An opinionated TooltipThemeData