将主抽屉添加到按钮中

时间:2020-11-04 19:08:18

标签: flutter flutter-layout flutter-dependencies

我是新手,需要将应用程序的主抽屉添加到按钮中,如下图所示(这是应用程序UI的上部)

enter image description here

关于将主抽屉应用于按钮而不是通常将其分配给应用栏的任何想法。 (此移动应用没有应用栏)

  @override
  Widget build(BuildContext context) {
    var mediaQuery = MediaQuery.of(context);
    return Scaffold(
      key: scaffoldKey,
      body: Stack(
        children: <Widget>[
          _buildWidgetAlbumCover(mediaQuery),
           getMainContentWidget(mediaQuery),
          _buildWidgetMenu(mediaQuery),
          _buildWidgetFloatingActionButton(mediaQuery),
            Drawer(
              child: ListView(
                padding: EdgeInsets.zero,
                children: <Widget>[
                  DrawerHeader(
                    child: Text('Drawer Header'),
                    decoration: BoxDecoration(
                      color: Colors.blue,
                    ),
                  ),
                  ListTile(
                    title: Text('Item 1'),
                    onTap: () {
                    },
                  ),
                  ListTile(
                    title: Text('Item 2'),
                    onTap: () {
                    },
                  ),
                ],
              ),
            ),
        ],
      ),
    );
  }

  Widget _buildWidgetMenu(MediaQueryData mediaQuery) {
    return Padding(
      padding: EdgeInsets.only(
        left: 2.0,
        top: mediaQuery.padding.top + 2.0,

      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(
            icon: Icon(
              Icons.menu,
              color: Colors.white,
              size: 25,
            ),
            padding: EdgeInsets.all(2.0),
//            onPressed: () => scaffoldKey.currentState.openDrawer(),
          ),
        ],
      ),
    );
  }

enter image description here 这是我获得此代码后得到的输出。这个抽屉甚至不能固定,也不能固定。我希望普通抽屉也附在_buildWidgetMenu上,而不是附加在应用栏抽屉上。

1 个答案:

答案 0 :(得分:0)

如果使用sacffold,则它具有抽屉属性,您可以使用例如cookbook

 return Scaffold(
  appBar: AppBar(title: Text(title)),
  body: Center(child: Text('My Page!')),
  drawer: Drawer(...

点击按钮即可打开抽屉

 var scaffoldKey = GlobalKey<ScaffoldState>();
//required key 
     Scaffold(
        key: scaffoldKey,
        drawer: new Drawer(
          child: new ListView(
            padding: EdgeInsets.zero,...

             body:Center(..
                       IconButton(
                icon: Icon(Icons.menu),
//open drawer
                onPressed: () => scaffoldKey.currentState.openDrawer(),
          ),