A Flutter package with custom implementation of the Side Menu (Drawer)
To start using this package, add flutter_zoom_drawer
dependency to your pubspec.yaml
dependencies:
flutter_zoom_drawer: '<latest_release>'
ZoomDrawer(
controller: ZoomDrawerController,
menuScreen: MENU_SCREEN,
mainScreen: MAIN_SCREEN,
borderRadius: 24.0,
showShadow: true,
angle: -12.0,
backgroundColor: Colors.grey[300],
slideWidth: MediaQuery.of(context).size.width*.65,
openCurve: Curves.fastOutSlowIn,
closeCurve: Curves.bounceIn,
)
Parameters | Value | Required | Docs |
---|---|---|---|
controller |
ZoomDrawerController |
No | Controller to have access to the open/close/toggle function of the drawer |
mainScreen |
Widget |
Yes | Screen containing the main content to display |
menuScreen |
Widget |
Yes | Screen containing the menu/bottom screen |
slideWidth |
double |
No | Sliding width of the drawer - defaults to 275.0 |
borderRadius |
double |
No | Border radius of the slided content - defaults to 16.0 |
angle |
double |
No | Rotation angle of the drawer - defaults to -12.0 - should be 0.0 to -30.0 |
backgroundColor |
Color |
No | Background color of the drawer shadows - defaults to white |
showShadow |
bool |
No | Boolean, whether to show the drawer shadows - defaults to false |
openCurve |
Curve |
No | open animation curve - defaults to Curves.easeOut |
closeCurve |
Curve |
No | close animation curve - defaults to Curves.easeOut |
To get access to the drawer, and be able to control it, there are 2 ways:
ZoomDrawerController
inside the main widget where ou have the ZoomDrawer
widget and providing it to the widget, which will allow you to trigger the open/close/toggle methods. final _drawerController = ZoomDrawerController();
_drawerController.open();
_drawerController.close();
_drawerController.toggle();
_drawerController.isOpen();
_drawerController.stateNotifier;
ZoomDrawer
. ZoomDrawer.of(context).open();
ZoomDrawer.of(context).close();
ZoomDrawer.of(context).toggle();
ZoomDrawer.of(context).isOpen();
ZoomDrawer.of(context).stateNotifier;
ZoomDrawer(
controller: ZoomDrawerController,
menuScreen: MENU_SCREEN,
mainScreen: MAIN_SCREEN,
borderRadius: 24.0,
showShadow: false,
angle: 0.0,
backgroundColor: Colors.grey[300],
slideWidth: MediaQuery.of(context).size.width*(ZoomDrawer.isRTL()? .45: 0.65),
)
ZoomDrawer(
controller: ZoomDrawerController,
menuScreen: MENU_SCREEN,
mainScreen: MAIN_SCREEN,
borderRadius: 24.0,
showShadow: true,
angle: 0.0,
backgroundColor: Colors.grey[300],
slideWidth: MediaQuery.of(context).size.width*(ZoomDrawer.isRTL()? .45: 0.65),
)
ZoomDrawer(
controller: ZoomDrawerController,
menuScreen: MENU_SCREEN,
mainScreen: MAIN_SCREEN,
borderRadius: 24.0,
showShadow: false,
angle: -12.0,
backgroundColor: Colors.grey[300],
slideWidth: MediaQuery.of(context).size.width*(ZoomDrawer.isRTL()? .45: 0.65),
)
ZoomDrawer(
controller: ZoomDrawerController,
menuScreen: MENU_SCREEN,
mainScreen: MAIN_SCREEN,
borderRadius: 24.0,
showShadow: true,
angle: -12.0,
backgroundColor: Colors.grey[300],
slideWidth: MediaQuery.of(context).size.width*(ZoomDrawer.isRTL()? .45: 0.65),
)
Please file any issues, bugs or feature request as an issue on our GitHub page.
If you would like to contribute to the plugin (e.g. by improving the documentation, solving a bug or adding a cool new feature), please carefully review our contribution guide and send us your pull request.
Credits goes to pedromassango as most of this package comes from his implementation.
Author: medyas
Source Code: https://github.com/medyas/flutter_zoom_drawer
#flutter #dart #mobile-apps