The simplest way to get started using grids is by using the GridView.count() constructor, because it allows you to specify how many rows or columns you’d like.
To visualize how GridView works, generate a list of 100 widgets that display their index in the list.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { final title = 'Grid List'; return MaterialApp( title: title, home: Scaffold( appBar: AppBar( title: Text(title), ), body: GridView.count( // Create a grid with 2 columns. If you change the scrollDirection to // horizontal, this produces 2 rows. crossAxisCount: 2, // Generate 100 widgets that display their index in the List. children: List.generate(100, (index) { return Center( child: Text( 'Item $index', style: Theme.of(context).textTheme.headline5, ), ); }), ), ), ); } } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.