Flutter:解决首页跳转子页面子页面依然显示BottomNavigationBar问题
刚开始接触flutter时,由于对Flutter的不熟悉,经常出现一些莫名其妙的问题,首页跳转子页面子页面依然显示BottomNavigationBar问题就是其中之一。
- 先来看看效果图
会发现跳入子页面后BottomNavigationBar依然显示,
学过Flutter的同学基本都知道Flutter跳转使用的是:
Navigator.of(context).push(new MaterialPageRoute(
builder: (ctx) => new ConsultPage()));
但是,在跳转的是要注意context问题,如果不是首页,使用当前页面的context跳转当然是没有问题的,但是如果是首页并且带有BottomNavigationBar时,就一定要注意context问题了!
如果要解决这个问题,这里的context就不是当前页面的context,他需要是当前页面父类的上下文!
- 父类传递context给当前页面
_bodys = [new HomePage(context), new MapPage(context), new MemberPage(context),new MorePage(context)];
直接将context使用构造方法的形式传入。
- 接收context
//页面入口(无状态的部件)
class HomePage extends StatelessWidget {
/**
* 父类上下文
*/
var parentContext;
HomePage(this.parentContext);
@override
Widget build(BuildContext context) {
return new MaterialApp(
theme: new ThemeData(primarySwatch: Colors.blue),
debugShowCheckedModeBanner: false,
home: new HomeWidget(this.parentContext),
);
}
}
//加载页面(有状态的部件)
class HomeWidget extends StatefulWidget {
/**
* 父类上下文
*/
var parentContext;
HomeWidget(this.parentContext);
@override
createState() => new HomeState();
}
这是就可以使用父类上下问了!
Navigator.of(widget.parentContext).push(new MaterialPageRoute(
builder: (ctx) => new ConsultPage()));
注意使用widget.parentContext就是父类上下文!!
这是这个问题就解决了!!!!!!