bottom_draggable_drawer

A flutter draggable drawer

Getting Started

class TestPage extends StatelessWidget {
  final BottomDraggableDrawerController controller =
      BottomDraggableDrawerController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CupertinoNavigationBar(
        middle: Text('Drawer Example'),
        trailing: GestureDetector(
            onTap: () {
              controller.switchDrawerStatus();
            },
            child: Text('switch')),
      ),
      body: Stack(
        children: <Widget>[
          Center(
            child: Container(
              height: 100,
              width: 300,
              child: Text('this is your main body!',
                  style: TextStyle(fontSize: 30)),
            ),
          ),
          ///this is your drawer,wrapped with a Positioned widget
          Positioned(
            bottom: 0,
            child: BottomDraggableDrawer(
              controller: controller,
              draggableHeader: _buildHeader(),
              content: _buildContent(),
              maxOffsetDistance: ScreenUtil.screenHeightDp * 0.16,
              originalOffset: ScreenUtil.screenHeightDp * 0.85,
            ),
          )
        ],
      ),
    );
  }

  Widget _buildHeader() {
    return Container(
      height: ScreenUtil().setHeight(90),
      width: ScreenUtil.screenWidthDp,
      decoration: BoxDecoration(
        color: Colors.grey[200],
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(10),
          topRight: Radius.circular(10),
        ),
      ),
      child: Container(
        margin: EdgeInsets.only(top: ScreenUtil().setHeight(10)),
        child: Center(
          child: Container(
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10),
              color: Colors.grey,
            ),
            height: ScreenUtil().setHeight(10),
            width: ScreenUtil().setWidth(100),
          ),
        ),
      ),
    );
  }

  Widget _buildContent() {
    return Container(
      height: ScreenUtil.screenHeightDp * 0.9,
      width: ScreenUtil.screenWidthDp,
      color: Colors.white,
      child: ListView.builder(
          itemCount: 30,
          itemBuilder: (ctx, index) {
            return Padding(
              padding: const EdgeInsets.all(12.0),
              child:
                  Text('this is item $index', style: TextStyle(fontSize: 24)),
            );
          }),
    );
  }
}

params:

• double originalOffset：The distance to top when Closed（required)
• double minOffsetDistance：The distance to top when open（required)
• Widget draggableHeader: The widget that you can drag（required)
• Widget content: Content widget（required)
• int animationDuration: Animation duration
• ValueChanged onOpened; A callback that you can know the drawer is open or closed
• BottomDraggableDrawerController controller: The drawer controller

Download flutter draggable drawer source code on GitHub

https://github.com/luckysmg/bottom_draggable_drawer