BottomNavigationBar Widget
Project Preview
- Interested in seeing the live demo? Click here to explore.
- Want to view the source code? Visit the project on GitHub.
Code Snippet
import 'package:flutter/material.dart';
class BottomNavigationBarWidget extends StatefulWidget {
const BottomNavigationBarWidget({super.key});
@override
State<BottomNavigationBarWidget> createState() =>
_BottomNavigationBarWidgetState();
}
class _BottomNavigationBarWidgetState extends State<BottomNavigationBarWidget> {
int _currentIndex = 0;
List<Widget> body = const [
Icon(Icons.home),
Icon(Icons.menu),
Icon(Icons.person),
];
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text("BottomNavigationBar Widget"),
),
body: Center(
child: body[_currentIndex],
),
bottomNavigationBar: BottomNavigationBar(
currentIndex: _currentIndex,
onTap: (int newIndex) {
setState(() {
_currentIndex = newIndex;
});
},
items: const [
BottomNavigationBarItem(
label: 'Home',
icon: Icon(Icons.home),
),
BottomNavigationBarItem(
label: 'Menu',
icon: Icon(Icons.menu),
),
BottomNavigationBarItem(
label: 'Profile',
icon: Icon(Icons.person),
)
],
),
);
}
}