我在 flutter 中有一个底部导航栏,我想要的是点击底部栏的各个小部件,它应该将我导航到下一页
Widget _bottemTab() {
return new BottomNavigationBar(
currentIndex: _currentIndex,
onTap:(newIndex) => setState((){_currentIndex = newIndex;}),
type: BottomNavigationBarType.fixed,
items: [
new BottomNavigationBarItem(
icon: Image.asset(
"assets/home.png",
width: 24.0,
height: 24.0,
),
title: Text(
'Home',
),
),
new BottomNavigationBarItem(
icon: Image.asset(
"assets/shopping-bagg.png",
width: 24.0,
height: 24.0,
),
title: Text(
'Mall',
)),
new BottomNavigationBarItem(
icon: Image.asset(
"assets/qr-code.png",
width: 24.0,
height: 24.0,
),
title: Text(
'Scan',
)),
new BottomNavigationBarItem(
icon: Image.asset(
"assets/bank.png",
width: 24.0,
height: 24.0,
),
title: Text(
'Bank',
)),
new BottomNavigationBarItem(
icon: Image.asset(
"assets/delivery.png",
width: 24.0,
height: 24.0,
),
title: Text(
'Inbox',
)),
]);
}
我想要的是点击底部栏的各个小部件,它应该将我导航到我为底部导航 View 的每个菜单项分别创建的下一页..任何帮助表示赞赏
最佳答案
在您的 build()
方法,您可以添加此逻辑。
@override
Widget build(BuildContext context) {
Widget widget = Container(); // default
switch (_currentIndex) {
case 0:
widget = FirstPage();
break;
case 1:
widget = SecondPage();
break;
case 2:
widget = ThirdPage();
break;
}
return Scaffold(
body: widget,
// ...
);
}
更新:
我不确定你是怎么做到的,在这里你可以看到一个正确的小例子。
int _index = 0;
@override
Widget build(BuildContext context) {
Widget child = Container();
switch(_index) {
case 0:
child = FlutterLogo(colors: Colors.orange);
break;
case 1:
child = FlutterLogo();
break;
}
return Scaffold(
appBar: AppBar(),
bottomNavigationBar: _bottomTab(),
body: SizedBox.expand(child: child),
);
}
Widget _bottomTab() {
return BottomNavigationBar(
currentIndex: _index,
onTap: (int index) => setState(() => _index = index),
backgroundColor: Colors.deepPurple,
items: [
BottomNavigationBarItem(icon: Icon(Icons.looks_one), title: Text("1")),
BottomNavigationBarItem(icon: Icon(Icons.looks_two), title: Text("2")),
],
);
}
关于flutter - 如何在 flutter 中为BottomNavigationBar菜单提供onPress功能?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57496185/