如何将抽屉小部件放在右侧答案

【问题标题】：How to place Drawer widget on the right如何将抽屉小部件放在右侧
【发布时间】：2021-11-23 19:43:34
【问题描述】：

如何将抽屉小部件放在右侧。也可以将两个抽屉小部件放置在应用栏任一侧的单个页面中

Widget build(BuildContext context){
 return Scaffold(
  drawer: Drawer(
    child: ListView(
      children: <Widget>[
        ListTile(
          leading: Icon(Icons.shopping_cart),
          title: Text('Checkout'),
          onTap: (){
            Navigator.pushNamed(context, '/home');
          },
        ),
        ListTile(
          leading: Icon(Icons.report),
          title: Text('Transactions'),
          onTap: (){
            Navigator.pushNamed(context, '/transactionsList');
          },
        ),
      ]
    )
  ),
  body: SingleChildScrollView(
    child: Column(
      children : [
        _buildOrderHeader(),
        _buildOrderDetails(context),
      ]
    )
  )
);

【问题讨论】：

在脚手架中使用endDrawer
感谢您的支持。有效。是否可以更改抽屉图标？
在appBar 中使用leading 属性
我需要更改endDrawer的图标。我也无法打开 endDrawer

标签： flutter

【解决方案1】：

通过使用endDrawer: ... 代替drawer: ... 来设置抽屉，如下所示：

Scaffold(
  endDrawer: Drawer(...),
  // ...
)

要以编程方式打开它，请使用

Scaffold.of(context).openEndDrawer(); //This might have been updated by flutter team since the last edit

另见https://docs.flutter.io/flutter/material/Scaffold/endDrawer.html

【讨论】：

感谢您的回答。粘贴 appbar 操作按钮时，我需要打开 endDrawer
Scaffold.of(context).openEndDrawer() docs.flutter.io/flutter/material/ScaffoldState/…
@GünterZöchbauer 最后，能够在 Flutter 中超越我的英雄 ranking #2。

【解决方案2】：

  endDrawer:Drawer(child:Center(child:Columun(   children: <Widget>[
          Text('End Drawer)           ],
      ),))

【讨论】：

【解决方案3】：

要使用 Dart Null Safety 从右侧打开导航抽屉，您应该使用 endDrawer()。 Flutter 中有两个可用的抽屉参数。

抽屉（左侧）
endDrawer（右侧）您可以查看 endDrawer 的示例。

点击按钮打开 endDrawer。

 _scaffoldKey.currentState!.openEndDrawer();

创建全局密钥

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

在 Build() 中

Scaffold(
          backgroundColor: backgroundcolor_cust,
          key: _scaffoldKey,
          endDrawer: Drawer(
            elevation: 16.0,
            child: leftDrawerMenu(context, user_phone, cart_count),
          ),

【讨论】：

【解决方案4】：

如果您想保持按钮在右侧，抽屉在左侧，则将汉堡按钮添加到容器内，这样汉堡按钮将位于右侧，而导航抽屉则保留在左侧。（不推荐）

new Container(
  alignment: Alignment.topRight,
  margin: EdgeInsets.only(top: 20.0, right: 10.0),
  child: IconButton(
    icon: Icon(
      Icons.menu,
      size: 24,
      color: Colors.white,
    ),
    onPressed: () => scaffoldKey.currentState.openDrawer(),
  ),
)

【讨论】：