How to adapt crossAxisCount of GridView based on its width in Flutter?

Question

What is the best practice to adapt the number of columns (crossAxisCount) of a GridView based on its width in Flutter?

Maybe I can better explain the intended behaviour by referencing HTML:

• I create 6 boxes (e.g. DIVs) with a width of 200 px (and same height) each.
• (a) If the element surrounding these boxes has a width of 400 px, it would automatically show 2 boxes per row in 3 rows.
• (b) If the element surrounding these boxes has a width of 700 px, it would automatically show 3 boxes per row in 2 rows.

Answer 1

Use Wrap. It can put renderboxes as many as fit to a row, then wrap to the next row. (formerly a comment, but it looks like the answer!)