add bottom sheet demo

lib/my_app_routes.dart

@@ -65,6 +65,7 @@ import './routes/widgets_stateful_widgets_ex.dart';
 import './routes/widgets_text_ex.dart';
 import './routes/widgets_textfield_ex.dart';
 import './routes/widgets_textformfield_ex.dart';
+import 'routes/nav_bottom_sheet_ex.dart';
 
 const kHomeRoute = MyRoute(
   child: MyHomePage(),
@@ -405,6 +406,14 @@ const kMyAppRoutesStructure = <MyRouteGroup>[
           'Doc': 'https://docs.flutter.io/flutter/material/Drawer-class.html',
         },
       ),
+      MyRoute(
+        child: BottomSheetExample(),
+        sourceFilePath: 'lib/routes/nav_nav_bottom_sheet_ex.dart',
+        title: 'Bottom sheet',
+        links: {
+          'Medium article': 'https://medium.com/flutter-community/flutter-beginners-guide-to-using-the-bottom-sheet-b8025573c433',
+        },
+      ),
       MyRoute(
         child: BottomTabbarExample(),
         sourceFilePath: 'lib/routes/nav_bottom_tabbar_ex.dart',

lib/routes/nav_bottom_sheet_ex.dart

@@ -0,0 +1,77 @@
+import 'package:flutter/material.dart';
+import 'package:fluttertoast/fluttertoast.dart';
+
+class BottomSheetExample extends StatefulWidget {
+  const BottomSheetExample({Key key}) : super(key: key);
+
+  @override
+  _BottomSheetExampleState createState() => _BottomSheetExampleState();
+}
+
+class _BottomSheetExampleState extends State<BottomSheetExample> {
+  // GlobalKey is needed to show bottom sheet.
+  final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      key: this._scaffoldKey,
+      body: Center(
+        child: Column(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: <Widget>[
+            RaisedButton(
+              child: Text('show bottom sheet'),
+              onPressed: () => this
+                  ._scaffoldKey
+                  .currentState
+                  .showBottomSheet((ctx) => _buildBottomSheet(ctx)),
+            ),
+            RaisedButton(
+              child: Text('show modal bottom sheet'),
+              onPressed: () => showModalBottomSheet(
+                  context: context, builder: (ctx) => _buildBottomSheet(ctx)),
+            ),
+          ],
+        ),
+      ),
+      floatingActionButton: FloatingActionButton(
+        child: Icon(Icons.add),
+        onPressed: () =>
+            Fluttertoast.showToast(msg: 'Dummy floating action button'),
+      ),
+    );
+  }
+
+  Container _buildBottomSheet(BuildContext context) {
+    return Container(
+      height: 300,
+      padding: EdgeInsets.all(8.0),
+      decoration: BoxDecoration(
+        border: Border.all(color: Colors.blue, width: 2.0),
+        borderRadius: BorderRadius.circular(8.0),
+      ),
+      child: ListView(
+        children: <Widget>[
+          ListTile(title: Text('Bottom sheet')),
+          TextField(
+            keyboardType: TextInputType.number,
+            decoration: InputDecoration(
+              border: OutlineInputBorder(),
+              icon: Icon(Icons.attach_money),
+              labelText: 'Enter an integer',
+            ),
+          ),
+          Container(
+            alignment: Alignment.center,
+            child: RaisedButton.icon(
+              icon: Icon(Icons.save),
+              label: Text('Save and close'),
+              onPressed: () => Navigator.pop(context),
+            ),
+          )
+        ],
+      ),
+    );
+  }
+}