单击左上方按钮(汉堡图标)时如何从侧面打开屏幕?

时间:2019-11-16 08:16:42

标签: flutter flutter-layout

我希望在单击图标时从左侧打开侧边菜单。

top header

代码:

class _MovieScreenState extends State<MovieScreen> {


MovieBloc _bloc;
 final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  void initState() {
    super.initState();
    _bloc = MovieBloc();

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      drawer: new Drawer(),
      appBar: AppBar(
        backgroundColor: Color(0xffFAFCF7), // status bar color
        brightness: Brightness.light,
        elevation: 0.0,
        leading: Container(
          margin: EdgeInsets.only(left: 17),
          child: RawMaterialButton(
            onPressed: _scaffoldKey.currentState.openDrawer(),
            child: new Icon(
              Icons.menu,
              // color: Colors.black,
              size: 25.0,
            ),
            shape: new CircleBorder(),
            elevation: 4.0,
            fillColor: Colors.white,
            padding: const EdgeInsets.all(5.0),
          ),
          ...

因此,在onTap上,我希望从左侧打开具有全屏盖的屏幕。另外,如果在主屏幕上从左向右滑动,则可以打开侧屏幕。 谢谢

1 个答案:

答案 0 :(得分:1)

是的,您正在寻找的小部件是Drawer

将参数drawer传递到脚手架中,您将看到汉堡包图标

class LeftMenu extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   return Container(child: 
      ListView(
        padding: EdgeInsets.zero,
        children:  // your widgets that you want to put inside
      )
   )
 }
}
Scaffold(
  drawer: Drawer(
    child: LeftMenu()
  )
);

现在可以通过汉堡菜单或从右向左滑动来打开它。

您可以在官方教程中Drawer

了解更多信息