Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter: ListView in a SimpleDialog

I want to show a SimpleDialog with ListView.builder in my Flutter app with this code:

showDialog(   context: context,   builder: (BuildContext context) {     return new SimpleDialog(       children: <Widget>[         new FittedBox(           child: new ListView(             children: <Widget>[               new Text("one"),               new Text("two"),             ],           ),         )       ],     );   }, ); 

which gives this error (sorry, I couldn't wrap the logs as code because Stackoverflow complains that there's too much code):

══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ I/flutter ( 4481): The following assertion was thrown during performLayout(): I/flutter ( 4481): RenderViewport does not support returning intrinsic dimensions. I/flutter ( 4481): Calculating the intrinsic dimensions would require instantiating every child of the viewport, which I/flutter ( 4481): defeats the point of viewports being lazy. I/flutter ( 4481): If you are merely trying to shrink-wrap the viewport in the main axis direction, consider a I/flutter ( 4481): RenderShrinkWrappingViewport render object (ShrinkWrappingViewport widget), which achieves that I/flutter ( 4481): effect without implementing the intrinsic dimension API. I/flutter ( 4481): ... I/flutter ( 4481): Another exception was thrown: RenderBox was not laid out: RenderPhysicalShape#83d92 relayoutBoundary=up2 NEEDS-PAINT I/flutter ( 4481): Another exception was thrown: 'package:flutter/src/rendering/shifted_box.dart': Failed assertion: line 310 pos 12: 'child.hasSize': is not true. I/flutter ( 4481): Another exception was thrown: RenderBox was not laid out: RenderPhysicalShape#83d92 relayoutBoundary=up2

I tried using Container with specific height and width, and it works, but I want the ListView to fit itself in the Dialog.

How to include a ListView in a SimpleDialog?

like image 936
Darkhan Avatar asked Apr 30 '18 07:04

Darkhan


1 Answers

Just wrap ListView.builder in a Container with a specific height and width.

Widget setupAlertDialoadContainer() {   return Container(     height: 300.0, // Change as per your requirement     width: 300.0, // Change as per your requirement     child: ListView.builder(       shrinkWrap: true,       itemCount: 5,       itemBuilder: (BuildContext context, int index) {         return ListTile(           title: Text('Gujarat, India'),         );       },     ),   ); } 

And call the above method in showDialog.

showDialog(     context: context,     builder: (BuildContext context) {       return AlertDialog(         title: Text('Country List'),         content: setupAlertDialoadContainer(),       );     }); 

EDITED:

You can go with @Rap's comment too.

like image 148
Govaadiyo Avatar answered Oct 24 '22 12:10

Govaadiyo