How to put a ListView.builder in a Drawer?

Question

I'm trying to make a dynamic menu (via a json file). When I put my code in the body it's working fine. But when I put it in my Drawer, the drawer is blank, even my DrawerHeader disappear.

My code:

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('My App'),
        backgroundColor: Colors.green,
      ),
      body: ListView.builder(                       // <----------  WORKING
          itemCount: data == null ? 0 : data.length,
          itemBuilder: (BuildContext context, i) {
            return new ListTile(
              title: new Text(data[i]["title"]),
            );
          }),
      drawer: Drawer(
        child: ListView(
          // Important: Remove any padding from the ListView.
          padding: EdgeInsets.zero,
          children: <Widget>[
            Container(
              height: 85.0,
              child: DrawerHeader(
                child: Text(
                  'Categories',
                  style: new TextStyle(fontSize: 18.0, color: Colors.white),
                ),
                decoration: BoxDecoration(
                  color: Colors.green,
                ),
              ),
            ),
            ListView.builder(                       // <---------- NOT WORKING
                itemCount: data == null ? 0 : data.length,
                itemBuilder: (BuildContext context, i) {
                  return new ListTile(
                    title: new Text(data[i]["title"]),
                  );
                })
          ],
        ),
      ),
    );
  }

full code

Answer 1

Your ListView.builder widget needs to be inside a widget with a fixed height.

You can set it inside a Container:

Container(
  height: double.maxFinite,
  child: ListView.builder(
    itemCount: data == null ? 0 : data.length,
    itemBuilder: (BuildContext context, i) {
      return new ListTile(
        title: new Text(data[i]["title"]),
      );
  }))