add floating and rounded navbar

This commit is contained in:
Yannick
2025-11-08 16:14:52 +01:00
parent d5315a8f00
commit 5bbb5c1888

View File

@@ -52,22 +52,28 @@ class _CustomNavigationBarState extends State<CustomNavigationBar>
), ),
backgroundColor: CustomTheme.backgroundColor, backgroundColor: CustomTheme.backgroundColor,
body: tabs[currentIndex], body: tabs[currentIndex],
extendBody: true, extendBody: true, // Enables floating effect
bottomNavigationBar: BottomAppBar( bottomNavigationBar: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10), padding: const EdgeInsets.only(left: 12.0, right: 12.0, bottom: 8.0),
elevation: 10, child: Material(
height: 60, elevation: 10,
color: CustomTheme.primaryColor, borderRadius: BorderRadius.circular(24),
shape: null, color: CustomTheme.primaryColor,
child: Row( child: ClipRRect(
mainAxisSize: MainAxisSize.max, borderRadius: BorderRadius.circular(24),
mainAxisAlignment: MainAxisAlignment.spaceAround, child: SizedBox(
children: <Widget>[ height: 60,
_buildNavItem(Icons.home, 'Home', 0), child: Row(
_buildNavItem(Icons.history, 'Games', 1), mainAxisAlignment: MainAxisAlignment.spaceAround,
_buildNavItem(Icons.groups, 'Groups', 2), children: <Widget>[
_buildNavItem(Icons.bar_chart, 'Stats', 3), _buildNavItem(Icons.home, 'Home', 0),
], _buildNavItem(Icons.history, 'Games', 1),
_buildNavItem(Icons.groups, 'Groups', 2),
_buildNavItem(Icons.bar_chart, 'Stats', 3),
],
),
),
),
), ),
), ),
); );