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,15 +52,18 @@ class _CustomNavigationBarState extends State<CustomNavigationBar>
),
backgroundColor: CustomTheme.backgroundColor,
body: tabs[currentIndex],
extendBody: true,
bottomNavigationBar: BottomAppBar(
padding: const EdgeInsets.symmetric(horizontal: 10),
extendBody: true, // Enables floating effect
bottomNavigationBar: Padding(
padding: const EdgeInsets.only(left: 12.0, right: 12.0, bottom: 8.0),
child: Material(
elevation: 10,
height: 60,
borderRadius: BorderRadius.circular(24),
color: CustomTheme.primaryColor,
shape: null,
child: ClipRRect(
borderRadius: BorderRadius.circular(24),
child: SizedBox(
height: 60,
child: Row(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
_buildNavItem(Icons.home, 'Home', 0),
@@ -70,6 +73,9 @@ class _CustomNavigationBarState extends State<CustomNavigationBar>
],
),
),
),
),
),
);
}