Navigaton Bar

แบบง่ายๆ….

dependencies:
curved_navigation_bar
: ^1.0.1
import 'package:curved_navigation_bar/curved_navigation_bar.dart';

set each…page

int _currentIndex = 1;
final List<Widget> _children = [
HomePage(),
CountDownWalking(),
Setting()
];
@override
Widget build(BuildContext context) {
return Scaffold(
bottomNavigationBar: CurvedNavigationBar(
index: _currentIndex,
color: Colors.white,
backgroundColor: Colors.teal,
buttonBackgroundColor: Colors.amber,
items: <Widget>[
Icon(
Icons.arrow_back_rounded,
size: 30,
),
Icon(Icons.alarm, size: 30),
Icon(Icons.my_library_books, size: 30),
],
onTap: onTabTapped,
),
body: Container(...

Build onTabTapped method

void onTabTapped(int index) {
setState(() {
_currentIndex = index;
Navigator.push(context, MaterialPageRoute(builder: (context) {
return _children[_currentIndex];
}));
});
}

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store