Created
March 10, 2020 17:02
-
-
Save vanpav/df8d160c6e38909ddf93c08612f2210a to your computer and use it in GitHub Desktop.
Simple custom drawer
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
import 'package:provider/provider.dart'; | |
import 'counter.dart'; | |
void main() => runApp(MyApp()); | |
class MyModel extends ChangeNotifier { | |
bool isDrawerOpened = false; | |
void toggleDrawer() { | |
isDrawerOpened = !isDrawerOpened; | |
notifyListeners(); | |
} | |
} | |
class MyApp extends StatelessWidget { | |
// This widget is the root of your application. | |
@override | |
Widget build(BuildContext context) { | |
return ChangeNotifierProvider<MyModel>( | |
create: (_) => MyModel(), | |
child: MaterialApp( | |
title: 'Flutter Demo', | |
home: CounterPage(title: 'Flutter Demo Home Page'), | |
), | |
); | |
} | |
} | |
class CounterPage extends StatefulWidget { | |
final String title; | |
CounterPage({Key key, this.title}) : super(key: key); | |
@override | |
_CounterPageState createState() => _CounterPageState(); | |
} | |
class _CounterPageState extends State<CounterPage> { | |
Counter counter = Counter(0); | |
Widget _buildDrawer(bool show) { | |
return AnimatedContainer( | |
duration: Duration(milliseconds: 300), | |
curve: Curves.easeOutExpo, | |
color: Colors.red, | |
height: MediaQuery.of(context).size.height, | |
width: show ? MediaQuery.of(context).size.width / 1.3 : 0, | |
); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Consumer<MyModel>( | |
builder: (context, model, child) => Stack( | |
children: <Widget>[ | |
child, | |
_buildDrawer(model.isDrawerOpened), | |
], | |
), | |
child: Scaffold( | |
appBar: AppBar(title: Text(widget.title)), | |
body: Center(child: Text('Widget')), | |
floatingActionButton: Row( | |
mainAxisSize: MainAxisSize.min, | |
children: <Widget>[ | |
FloatingActionButton( | |
child: Icon(Icons.add), | |
onPressed: () { | |
Provider.of<MyModel>(context, listen: false).toggleDrawer(); | |
}, | |
), | |
], | |
), | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment