1

I wish to open a side menu from left when clicked on an icon.

top header

Code:

class _MovieScreenState extends State<MovieScreen> {


MovieBloc _bloc;
 final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();

  @override
  void initState() {
    super.initState();
    _bloc = MovieBloc();

  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      drawer: new Drawer(),
      appBar: AppBar(
        backgroundColor: Color(0xffFAFCF7), // status bar color
        brightness: Brightness.light,
        elevation: 0.0,
        leading: Container(
          margin: EdgeInsets.only(left: 17),
          child: RawMaterialButton(
            onPressed: _scaffoldKey.currentState.openDrawer(),
            child: new Icon(
              Icons.menu,
              // color: Colors.black,
              size: 25.0,
            ),
            shape: new CircleBorder(),
            elevation: 4.0,
            fillColor: Colors.white,
            padding: const EdgeInsets.all(5.0),
          ),
          ...

So, onTap i wish to open the screen from the left with full screen cover. Also, will it be possible to open the side screen if swipe towards to right from left is done on home screen. Thanks

Gaurav Kumar
  • 1,111
  • 6
  • 25
  • 52

1 Answers1

1

Yes it's possible and the Widget you are looking for is Drawer

Pass param drawer into your Scaffold and you will see hamburger icon

class LeftMenu extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
   return Container(child: 
      ListView(
        padding: EdgeInsets.zero,
        children:  // your widgets that you want to put inside
      )
   )
 }
}
Scaffold(
  drawer: Drawer(
    child: LeftMenu()
  )
);

And now it's possible to open it with hamburger menu or with swipe from right to the left.

You can read more about it in official tutorial: Drawer

dubace
  • 1,601
  • 1
  • 19
  • 27
  • how to call this drawer from `InkWell onTap` – Gaurav Kumar Nov 16 '19 at 08:47
  • 1
    You have add some key to your Scaffold: `final GlobalKey _scaffoldKey = new GlobalKey();` `Scaffold( key: _scaffoldKey, ......` and then you can open it in your onTap: `_scaffoldKey.currentState.openDrawer()` – dubace Nov 16 '19 at 09:54
  • there is this error `The expression here has a type of 'void', and therefore can't be used. Try checking to see if you are using the correct API; there might be a function or call that returns void you didn't expect. Also check type parameters and variables which might also be void.dart(use_of_void_result)` – Gaurav Kumar Nov 16 '19 at 10:12
  • 1
    change it to: `onPressed: (){_scaffoldKey.currentState.openDrawer();}` – dubace Nov 16 '19 at 11:23