更改 Scaffold.body 值后如何隐藏抽屉
How to hide drawer in flutter after changing Scaffold.body value
我正在使用这个问题中的方法在 flutter 中更改 Scaffold 的主体:
描述的方法非常有效。现在我只希望抽屉在用户点击其中一项后自动关闭。
我尝试使用 Navigator.pop() 方法,但它会弹出整个屏幕,而不仅仅是抽屉。它给我留下了一个全黑的屏幕。
有什么建议吗?
您使用的是 Navigator.of(context).pop()
吗?我无法重现你的问题,你能post一个最小的例子来重现它吗?
以下代码按预期工作:设置按钮会弹出抽屉,而另一个不会。
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String text = "Initial Text";
@override
Widget build(BuildContext context) {
return new Scaffold(
drawer: new Drawer(
child: new ListView(
children: <Widget>[
new Container(child: new DrawerHeader(child: new Container())),
new Container (
child: new Column(
children: <Widget>[
new ListTile(leading: new Icon(Icons.info),
onTap:(){
setState((){
text = "info pressed";
});
}
),
new ListTile(leading: new Icon(Icons.save),
onTap:(){
setState((){
text = "save pressed";
});
}
),
new ListTile(leading: new Icon(Icons.settings),
onTap:(){
setState((){
text = "settings pressed";
});
Navigator.of(context).pop();
}
),
]
),
)
],
),
),
appBar: new AppBar(title: new Text("Test Page"),),
body: new Center(child: new Text((text)),
));
}
}
创建scaffoldKey
关闭抽屉
_scaffoldKey.currentState.openEndDrawer(),
打开抽屉
scaffoldKey.currentState.openDrawer(),
例子
InkWell(
onTap: ()=> widget.scaffoldKey.currentState.openDrawer(),
child: Icon(
Icons.menu,
size: 38,
color: Color(0xFFFFFFFF),
),
),
如果您使用的是 MaterialApp,则需要使用 Scaffold.of(context).openEndDrawer() 这样就不需要创建 GlobalKey。
class Menu extends StatelessWidget {
const Menu({
Key key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return ListView(
padding: EdgeInsets.zero,
children: [
FlatButton(
onPressed: () {
Navigator.of(context).pushNamed('/');
Scaffold.of(context).openEndDrawer();
},
child: ListTile(
leading: Icon(Icons.home),
title: Text('Home'),
),
),
FlatButton(
onPressed: () {
Navigator.of(context).pushNamed('/about');
Scaffold.of(context).openEndDrawer();
},
child: ListTile(
leading: Icon(Icons.question_answer),
title: Text('About'),
),
),
],
);
}
}
简单:
ListTile(
title: const Text('Item 1'),
onTap: () {
// Update the state of the app
// ...
// Then close the drawer
Navigator.pop(context);
},
),
我正在使用这个问题中的方法在 flutter 中更改 Scaffold 的主体:
描述的方法非常有效。现在我只希望抽屉在用户点击其中一项后自动关闭。
我尝试使用 Navigator.pop() 方法,但它会弹出整个屏幕,而不仅仅是抽屉。它给我留下了一个全黑的屏幕。
有什么建议吗?
您使用的是 Navigator.of(context).pop()
吗?我无法重现你的问题,你能post一个最小的例子来重现它吗?
以下代码按预期工作:设置按钮会弹出抽屉,而另一个不会。
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
String text = "Initial Text";
@override
Widget build(BuildContext context) {
return new Scaffold(
drawer: new Drawer(
child: new ListView(
children: <Widget>[
new Container(child: new DrawerHeader(child: new Container())),
new Container (
child: new Column(
children: <Widget>[
new ListTile(leading: new Icon(Icons.info),
onTap:(){
setState((){
text = "info pressed";
});
}
),
new ListTile(leading: new Icon(Icons.save),
onTap:(){
setState((){
text = "save pressed";
});
}
),
new ListTile(leading: new Icon(Icons.settings),
onTap:(){
setState((){
text = "settings pressed";
});
Navigator.of(context).pop();
}
),
]
),
)
],
),
),
appBar: new AppBar(title: new Text("Test Page"),),
body: new Center(child: new Text((text)),
));
}
}
创建scaffoldKey
关闭抽屉
_scaffoldKey.currentState.openEndDrawer(),
打开抽屉
scaffoldKey.currentState.openDrawer(),
例子
InkWell(
onTap: ()=> widget.scaffoldKey.currentState.openDrawer(),
child: Icon(
Icons.menu,
size: 38,
color: Color(0xFFFFFFFF),
),
),
如果您使用的是 MaterialApp,则需要使用 Scaffold.of(context).openEndDrawer() 这样就不需要创建 GlobalKey。
class Menu extends StatelessWidget {
const Menu({
Key key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return ListView(
padding: EdgeInsets.zero,
children: [
FlatButton(
onPressed: () {
Navigator.of(context).pushNamed('/');
Scaffold.of(context).openEndDrawer();
},
child: ListTile(
leading: Icon(Icons.home),
title: Text('Home'),
),
),
FlatButton(
onPressed: () {
Navigator.of(context).pushNamed('/about');
Scaffold.of(context).openEndDrawer();
},
child: ListTile(
leading: Icon(Icons.question_answer),
title: Text('About'),
),
),
],
);
}
}
简单:
ListTile(
title: const Text('Item 1'),
onTap: () {
// Update the state of the app
// ...
// Then close the drawer
Navigator.pop(context);
},
),