adaptiveRemoveElevationTint property

FlexAdaptive? adaptiveRemoveElevationTint
final

Controls adaptive elevation tint color usage in Material 3 theming.

Material 3 introduces elevation tint on elevated surface. With the adaptiveRemoveElevationTint property you can define on which platforms elevation tint is used when using Material-3.

See class FlexAdaptive on how to configure the platform adaptive behavior. You may for example like the FlexAdaptive.iOSAndDesktop for a configuration that only keeps elevation tint on Material 3 themes on Android and Fuchsia platforms, and when the app is run in a web browser on these platforms.

The adaptiveRemoveElevationTint feature has no impact in M2 mode. It only impacts component themes in FCS where Flutter SDK also support elevation tints in its theme. Currently this applies to:

Not supported in Flutter theming on:

  • BottomNavigationBar, does not have elevation tint in M3 in Flutter 3.7, since it is an M2 component it does not support it.
  • NavigationRail, does not have elevation tint in Flutter 3.7, probably should have when elevated. Default M3 design does not elevate it.

If you want to totally remove elevation tint from all widgets and on all platforms when using Material 3, you can optionally set FlexColorScheme.surfaceTint color to Colors.transparent. This also works with vanilla ThemeData.colorScheme by setting its ColorScheme.surfaceTint to Colors.transparent.

If not defined, defaults to FlexAdaptive.off.

Implementation

final FlexAdaptive? adaptiveRemoveElevationTint;