The BottomNavigation enables you to specify different position modes in regard to the page content.
To specify the type of positioning mode used for the BottomNavigation, use the positionMode property.
The BottomNavigation provides the following options:
- fixed(Default) - The BottomNavigation always stays at the bottom of the viewport, regardless of the page scroll position.
- sticky - Positions the BottomNavigation at the end of the scrollable container.
When the BottomNavigation has
positionMode="fixed", there is no reserved space for the component with regard to the other page content. This can cause parts of the page to be hidden behind the BottomNavigation. In this case, either apply bottom padding to the page content or set a