BottomNavigationBar class Null safety

A material widget that's displayed at the bottom of an app for selecting among a small number of views, typically between three and five.

The bottom navigation bar consists of multiple items in the form of text labels, icons, or both, laid out on top of a piece of material. It provides quick navigation between the top-level views of an app. For larger screens, side navigation may be a better fit.

A bottom navigation bar is usually used in conjunction with a Scaffold, where it is provided as the Scaffold.bottomNavigationBar argument.

The bottom navigation bar's type changes how its items are displayed. If not specified, then it's automatically set to BottomNavigationBarType.fixed when there are less than four items, and BottomNavigationBarType.shifting otherwise.

The length of items must be at least two and each item's icon and title/label must not be null.

This example shows a BottomNavigationBar as it is used within a Scaffold widget. The BottomNavigationBar has three BottomNavigationBarItem widgets, which means it defaults to BottomNavigationBarType.fixed, and the currentIndex is set to index 0. The selected item is amber. The _onItemTapped function changes the selected item's index and displays a corresponding message in the center of the Scaffold.
To create a local project with this code sample, run:
flutter create --sample=material.BottomNavigationBar.1 mysample

This example shows a BottomNavigationBar as it is used within a Scaffold widget. The BottomNavigationBar has four BottomNavigationBarItem widgets, which means it defaults to BottomNavigationBarType.shifting, and the currentIndex is set to index 0. The selected item is amber in color. With each BottomNavigationBarItem widget, backgroundColor property is also defined, which changes the background color of BottomNavigationBar, when that item is selected. The _onItemTapped function changes the selected item's index and displays a corresponding message in the center of the Scaffold.
To create a local project with this code sample, run:
flutter create --sample=material.BottomNavigationBar.2 mysample

See also:

Inheritance

Constructors

BottomNavigationBar({Key? key, required List<BottomNavigationBarItem> items, ValueChanged<int>? onTap, int currentIndex = 0, double? elevation, BottomNavigationBarType? type, Color? fixedColor, Color? backgroundColor, double iconSize = 24.0, Color? selectedItemColor, Color? unselectedItemColor, IconThemeData? selectedIconTheme, IconThemeData? unselectedIconTheme, double selectedFontSize = 14.0, double unselectedFontSize = 12.0, TextStyle? selectedLabelStyle, TextStyle? unselectedLabelStyle, bool? showSelectedLabels, bool? showUnselectedLabels, MouseCursor? mouseCursor, bool? enableFeedback, BottomNavigationBarLandscapeLayout? landscapeLayout})
Creates a bottom navigation bar which is typically used as a Scaffold's Scaffold.bottomNavigationBar argument. [...]

Properties

backgroundColor Color?
The color of the BottomNavigationBar itself. [...]
final
currentIndex int
The index into items for the current active BottomNavigationBarItem.
final
elevation double?
The z-coordinate of this BottomNavigationBar. [...]
final
enableFeedback bool?
Whether detected gestures should provide acoustic and/or haptic feedback. [...]
final
fixedColor Color?
The value of selectedItemColor. [...]
read-only
hashCode int
The hash code for this object. [...]
@nonVirtual, read-only, inherited
iconSize double
The size of all of the BottomNavigationBarItem icons. [...]
final
items List<BottomNavigationBarItem>
Defines the appearance of the button items that are arrayed within the bottom navigation bar.
final
key Key?
Controls how one widget replaces another widget in the tree. [...]
final, inherited
landscapeLayout BottomNavigationBarLandscapeLayout?
The arrangement of the bar's items when the enclosing MediaQueryData.orientation is Orientation.landscape. [...]
final
mouseCursor MouseCursor?
The cursor for a mouse pointer when it enters or is hovering over the tiles. [...]
final
onTap ValueChanged<int>?
Called when one of the items is tapped. [...]
final
runtimeType Type
A representation of the runtime type of the object.
read-only, inherited
selectedFontSize double
The font size of the BottomNavigationBarItem labels when they are selected. [...]
final
selectedIconTheme IconThemeData?
The size, opacity, and color of the icon in the currently selected BottomNavigationBarItem.icon. [...]
final
selectedItemColor Color?
The color of the selected BottomNavigationBarItem.icon and BottomNavigationBarItem.title. [...]
final
selectedLabelStyle TextStyle?
The TextStyle of the BottomNavigationBarItem labels when they are selected.
final
showSelectedLabels bool?
Whether the labels are shown for the selected BottomNavigationBarItem.
final
showUnselectedLabels bool?
Whether the labels are shown for the unselected BottomNavigationBarItems.
final
type BottomNavigationBarType?
Defines the layout and behavior of a BottomNavigationBar. [...]
final
unselectedFontSize double
The font size of the BottomNavigationBarItem labels when they are not selected. [...]
final
unselectedIconTheme IconThemeData?
The size, opacity, and color of the icon in the currently unselected BottomNavigationBarItem.icons. [...]
final
unselectedItemColor Color?
The color of the unselected BottomNavigationBarItem.icon and BottomNavigationBarItem.titles. [...]
final
unselectedLabelStyle TextStyle?
The TextStyle of the BottomNavigationBarItem labels when they are not selected.
final

Methods

createElement() StatefulElement
Creates a StatefulElement to manage this widget's location in the tree. [...]
inherited
createState() State<BottomNavigationBar>
Creates the mutable state for this widget at a given location in the tree. [...]
override
debugDescribeChildren() List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children. [...]
@protected, inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node. [...]
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a non-existent method or property is accessed. [...]
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep. [...]
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) String
A string representation of this object. [...]
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a string representation of this node and its descendants. [...]
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) String
Returns a one-line detailed description of the object. [...]
inherited
toStringShort() String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) bool
The equality operator. [...]
@nonVirtual, inherited