Search code examples
flutterflutter-layout

'Wrap' widget - items alignment


Is there a way to align Wrap widget items in all lines except the last with spaceAround and the last one with start? Is there another way to do it? Number of rows and columns should not be fixed - it depends on device width and height.

    showModalBottomSheet(
    context: context,
    builder: (BuildContext bc) {
      return SingleChildScrollView(
        child: new Wrap(
          direction: Axis.horizontal,
          spacing: 10.0,
          alignment: WrapAlignment.spaceAround,
          children: <Widget>[
             //items
          ],
        ),
      );
    });

See screenshot how it actually looks like. I need the last row to have the same spacing as the others and start from the left.


Solution

  • AFAIK there's no way to achieve this with Wrap widget, but similar effect produce GridView with extent constructor:

            GridView.extent(
              children: List.generate(10, (index) {
                return Center(
                  child: Icon(
                    Icons.star_border,
                    size: 100.0,
                  ),
                );
              }),
              maxCrossAxisExtent: 150.0,
            )
    

    enter image description here