Метод builder

Метод builder виджета GridView конструктор GridView.builder принимает gridDelegate и функцию itemBuilder. Число ячеек задают в itemCount.

Синтаксис

GridView.builder(
	gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
	itemBuilder: (context, index) => Text('abcde'),
)

Параметры

Параметр	Описание
`itemBuilder`	Функция, которая строит ячейку по индексу. Обязательный параметр.
`gridDelegate`	Правила сетки. Обязательный параметр.
`itemCount`	Сколько всего ячеек.

Пример

Давайте вызовем его в простом экране:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: GridView.builder(
					gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
						crossAxisCount: 2,
					),
					itemCount: 10,
					itemBuilder: (BuildContext context, int index)
					{
						return Center(child: Text('abcde'));
					},
				),
			),
		),
	);
}

На экране видны первые ячейки, остальные появятся при прокрутке.

Пример

Давайте повторим вызов с другими числами:

import 'package:flutter/material.dart';

void main()
{
	runApp(
		MaterialApp(
			home: Scaffold(
				body: GridView.builder(
					gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
						crossAxisCount: 3,
					),
					itemCount: 12,
					itemBuilder: (BuildContext context, int index)
					{
						return Center(child: Text('12345'));
					},
				),
			),
		),
	);
}

На экране сетка из трёх колонок с одинаковыми подписями.

Смотрите также

метод extent,
который часто ставят рядом в прокручиваемых экранах
метод custom,
который дополняет работу с прокруткой
метод count,
который помогает собрать сложный список
класс SliverGridDelegateWithFixedCrossAxisCount,
который задаёт поведение или данные прокрутки