如何在Flutter中增加抽屉拖动区域的宽度?

时间:2019-09-20 09:10:27

标签: flutter navigation-drawer

我的Flutter应用程序中有一个抽屉,但是默认抽屉有一个很小的拖动区域来显示它。我该如何增加呢?

  @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return Scaffold(
        drawerDragStartBehavior: DragStartBehavior.down,
        drawer: Drawer(
        child: Column(
          children: <Widget>[
            UserAccountsDrawerHeader(
              accountName: Text(
                fullName ?? "",
                style: TextStyle(
                  color: Colors.white,
                  letterSpacing: 1.0,
                  fontSize: 16.0,
                ),
              ),

2 个答案:

答案 0 :(得分:1)

 drawer: SizedBox(
        width: MediaQuery.of(context).size.width/1.2,
        child: Drawer(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: <Widget>[
              Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  SizedBox(
                    height: 10,
                  ),
                  ListTile(
                    dense: true,
                    title: Text(
                      "Apply for Leave",
                      style: drawerFont,
                    ),
                    onTap: () {
                      Navigator.pop(context);
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => ApplyLeave()));
                    },
                  ),
                  ListTile(
                    dense: true,
                    title: Text(
                      "Approval for Bills",
                      style: drawerFont,
                    ),
                    onTap: () {
                      Navigator.pop(context);
                      Navigator.push(
                          context,
                          MaterialPageRoute(
                              builder: (context) => ApplyBill()));
                    },
                  )
                ],
              ),
              Column(
                crossAxisAlignment: CrossAxisAlignment.end,
                mainAxisAlignment: MainAxisAlignment.end,
                children: <Widget>[
                  Container(
                    color: Colors.grey[200],
                    width: double.infinity,
                    height: 60,
                    child: Padding(
                      padding: const EdgeInsets.only(
                          left: 28.0, top: 15, bottom: 15),
                      child: GestureDetector(
                        onTap: () {
                          Navigator.pop(context);
                          Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: (context) => ContactUs()));
                        },
                        child: Text(
                          "Contact Us",
                          style: drawerFont,
                        ),
                      ),
                    ),
                  ),
                ],
              )
            ],
          ),
        ),
      ),

答案 1 :(得分:0)

您可以简单地使用drawerEdgeDragWidth的{​​{1}}属性:

Scaffold