[英]Flutter how to disable slide animation in BottomNavigationBar
I am trying to create a BottomNavigationBar in flutter, but I want to disable the slide animation between the pages.我正在尝试在 flutter 中创建一个 BottomNavigationBar,但我想禁用页面之间的幻灯片动画。 If I go from first tab to third tab I want it to open third tab directly, not slide through secondtab and then to thirdtab.如果我从第一个选项卡转到第三个选项卡,我希望它直接打开第三个选项卡,而不是滑过第二个选项卡然后滑到第三个选项卡。
Here is my code:这是我的代码:
class MyApp3 extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _MyAppState3();
}
}
class _MyAppState3 extends State<MyApp3> {
@override
PageController _pageController;
@override
void initState() {
super.initState();
_pageController = PageController(initialPage: 0);
}
@override
Widget build(BuildContext context) {
var pages = [FirstTab(), SecondTab(), ThirdTab()];
var pageView = PageView(
controller: _pageController,
physics: NeverScrollableScrollPhysics(),
children: pages,
);
var bottomNav = BottomNavigationBar(
onTap: (tabIndex) {
_pageController.jumpToPage(tabIndex);
},
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), label: "Start"),
BottomNavigationBarItem(
icon: Icon(Icons.camera_enhance), label: "Second"),
BottomNavigationBarItem(icon: Icon(Icons.offline_pin), label: "Home"),
],
);
return MaterialApp(
home: Scaffold(
body: pageView,
bottomNavigationBar: bottomNav,
));
}
}
With this code everything works as I want but the BottomNavigationBarItem doesn't change when the page changes.使用此代码,一切都可以按我的意愿工作,但是当页面更改时 BottomNavigationBarItem 不会更改。 It always look like this:它总是看起来像这样:
What can I do to make the BottomNavigationBarItem selection change?我该怎么做才能改变 BottomNavigationBarItem 选择?
Try this.尝试这个。
class MyApp3 extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return _MyAppState3();
}
}
class _MyAppState3 extends State<MyApp3> {
@override
PageController _pageController;
@override
void initState() {
super.initState();
_pageController = PageController(initialPage: 0);
}
int _currentIndex = 0;
@override
Widget build(BuildContext context) {
var pages = [FirstTab(), SecondTab(), ThirdTab()];
var pageView = PageView(
controller: _pageController,
physics: NeverScrollableScrollPhysics(),
children: pages,
);
var bottomNav = BottomNavigationBar(
onTap: (tabIndex) {
setState((){_currentIndex = tabIndex;});
_pageController.jumpToPage(tabIndex);
},
currentIndex: _currentIndex,
items: [
BottomNavigationBarItem(icon: Icon(Icons.home), label: "Start"),
BottomNavigationBarItem(
icon: Icon(Icons.camera_enhance), label: "Second"),
BottomNavigationBarItem(icon: Icon(Icons.offline_pin), label: "Home"),
],
);
return MaterialApp(
home: Scaffold(
body: pageView,
bottomNavigationBar: bottomNav,
));
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.