FlexSystemNavBarStyle enum

Enum used to define the SystemUiOverlayStyle for the system navigation bar.

Used with the FlexColorScheme.themedSystemNavigationBar helper to select the background style of system navigation bar when using the helper in an AnnotatedRegion to style the system navigation bar.

Inheritance
Available extensions

Values

system → const FlexSystemNavBarStyle

Standard Android system style, white in light theme and black in dark theme.

surface → const FlexSystemNavBarStyle

The system navigation bar will be the same color as active theme colorScheme.surface color. If your FlexColorScheme definition is set to use primary branded surface and background colors, the same primary color blend that the surface color has received will be used.

background → const FlexSystemNavBarStyle

The system navigation bar will be the same color as active theme's ColorScheme.surfaceContainerLow color.

If your FlexColorScheme definition is set to use primary branded surface and background colors, the same primary color blend that the surfaceContainerLow color has received will be used.

In FlexColorScheme versions before 8.0, this selection resulted in the ColorScheme background color being used as the AppBar color. This was deprecated in version 8.0.0 and replaced with ColorScheme.surfaceContainerLow because Flutter 3.22 deprecated the background color.

scaffoldBackground → const FlexSystemNavBarStyle

The system navigation bar will be the same color as active theme scaffoldBackground color. If your FlexColorScheme definition is set to use primary branded surface and background colors, the same primary color blend that the scaffoldBackground color has received will be used.

transparent → const FlexSystemNavBarStyle

Make the system navigation bar fully transparent, showing the background, while navigation buttons float over the background. For this to work Android SDK has to be >= 29.

The fully transparent system navigation bar works well when there is a bottom navigation bar with some opacity, you can then share the same background as it has with the system navigation bar, using same color and opacity as on the bottom navigation bar, creating one shared surface with same color and opacity on bottom navigation bar and the system navigation bar. The package doc site includes an example of this.

To see the effect of the opacity, the:

  • SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge)

call has to be used. It is called automatically called by the FlexColorScheme.themedSystemNavigationBar helper when opacity is < 1 or this transparent option is used.

Do note that this SystemUiMode mode may require layout changes in your Flutter app in some use cases. A SafeArea may help to add the required padding back.

Make the system navigation bar follow the default or the themed background color of the NavigationBar component, if it is defined.

You can achieve a similar looking result by using the transparent option, but this is an alternative that does not use opacity, it just sets the color of the Android system navigation bar to the NavigationBar background color.

It has the advantage of not requiring to call:

  • SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge)

Properties

hashCode → int
The hash code for this object.
no setterinherited
index → int
A numeric identifier for the enumerated value.
no setterinherited
name → String

Available on Enum, provided by the EnumName extension

The name of the enum value.
no setter
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

Constants

values → const List<FlexSystemNavBarStyle>
A constant List of the values in this enum, in order of their declaration.