Какие знаешь способы реализации списков?

Способы реализации списков в Flutter

В Flutter есть несколько способов создания списков, каждый с собственными преимуществами и областями применения.

1. ListView

Основной и самый популярный виджет для отображения прокручиваемых списков. Существует несколько вариантов конструктора:

ListView.builder — самый эффективный способ для больших списков. Создаёт элементы только те, которые видны на экране:

ListView.builder(
  itemCount: items.length,
  itemBuilder: (context, index) {
    return ListTile(
      title: Text(items[index]),
      leading: Icon(Icons.list),
    );
  },
)

ListView() с children — используется для небольших фиксированных списков:

ListView(
  children: [
    ListTile(title: Text("Элемент 1")),
    ListTile(title: Text("Элемент 2")),
  ],
)

ListView.separated — позволяет добавить разделители между элементами:

ListView.separated(
  itemCount: items.length,
  separatorBuilder: (context, index) => Divider(),
  itemBuilder: (context, index) => ListTile(title: Text(items[index])),
)

2. GridView

Для отображения элементов в виде сетки (например, галерея изображений):

GridView.builder(
  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
    crossAxisCount: 2,
    crossAxisSpacing: 8,
    mainAxisSpacing: 8,
  ),
  itemCount: items.length,
  itemBuilder: (context, index) => Container(
    color: Colors.blue,
    child: Text(items[index]),
  ),
)

3. SingleChildScrollView + Column

Для небольших списков с фиксированным количеством элементов:

SingleChildScrollView(
  child: Column(
    children: List.generate(
      items.length,
      (index) => Text(items[index]),
    ),
  ),
)

4. Sliver виджеты

Для сложных сценариев с несколькими прокручиваемыми областями:

CustomScrollView(
  slivers: [
    SliverAppBar(title: Text("Заголовок")),
    SliverList(
      delegate: SliverChildBuilderDelegate(
        (context, index) => ListTile(title: Text(items[index])),
        childCount: items.length,
      ),
    ),
  ],
)

5. PageView

Для горизонтальной прокрутки с постраничным переходом (как в картах):

PageView(
  children: items.map((item) => Page(item: item)).toList(),
)

Оптимизация и лучшие практики

• Всегда используй builder версию для больших данных — это экономит память
• Добавляй const конструкторы для неизменяемых элементов
• Используй itemExtent в ListView.builder если все элементы одинакового размера — это значительно ускоряет отрисовку
• Кэшируй вычисления в itemBuilder для тяжёлых операций
• Используй RepaintBoundary для изоляции перерисовок сложных элементов

Выбор способа зависит от типа данных (небольшие/большие объёмы), структуры списка (один/несколько столбцов) и требуемой производительности.