Wrap

part 1 - not enough space

class Square extends StatelessWidget {

  final Color _color;
  final double _width;

  const Square(this._color,[this._width]);

  @override
  Widget build(BuildContext context) => Container(
    width: _width,
    height: 100,
    color: _color,
  );
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) => Container(
      color: Colors.deepOrangeAccent,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Square(Colors.blue,100),
          Square(Colors.green,100),
          Square(Colors.yellow,100),
          Square(Colors.deepOrangeAccent,100),
          Square(Colors.lime,100),
          Square(Colors.blue,100),
          Square(Colors.green,100),
          Square(Colors.yellow,100),
          Square(Colors.black,100),
        ],
      ),
    );
}

part 2 - wrap widgets

Widget build(BuildContext context) => Container(
      color: Colors.deepOrangeAccent,
      child: Wrap(
        children: <Widget>[
          Square(Colors.blue,100),
          Square(Colors.green,100),
          Square(Colors.yellow,100),
          Square(Colors.deepOrangeAccent,100),
          Square(Colors.lime,100),
          Square(Colors.blue,100),
          Square(Colors.green,100),
          Square(Colors.yellow,100),
          Square(Colors.black,100),
        ],
      ),
    );

part 3 - change direction

child: Wrap(
        direction: Axis.vertical,
        alignment: WrapAlignment.end,