Продолжаем серию статей о сливерах, в первой части были рассмотрены сливеры-списки: различные вариации SliverList и SliverGrid. В этом материале погрузимся чуть глубже и сосредоточимся на базовых классах и делегатах, которые определяют поведение и структуру сливеров-списков.
Первая часть "Такие разные Slivers: обзор и применение во Flutter" тут.
SliverMultiBoxAdaptorWidget — абстрактный класс для сливеров, у которых множество элементов. Помогает подклассам создавать свои дочерние элементы лениво, используя SliverChildDelegate.
Наследует абстрактный класс SliverWithKeepAliveWidget, который позволяет отмечать элементы как нуждающиеся в сохранении состояния, даже если находятся в списках с отложенной инициализацией.
Наследниками класса являются SliverGrid, SliverList и другие их вариации.
SliverChildDelegate — абстрактный класс для делегатов, которые поставляют дочерние элементы для сливеров-списков. Есть два основных подкласса:
SliverChildListDelegate — делегат, который предоставляет дочерние элементы для сливеров, используя явный список. Подходит для небольших списков с фиксированными данными.
SliverList(
delegate: SliverChildListDelegate(items),
),SliverChildBuilderDelegate — делегат, который предоставляет дочерние элементы с помощью обратного вызова builder. Это позволяет создавать только те элементы, которые необходимы в данный момент, чтобы избежать создания бóльшего количества дочерних элементов, чем видно в окне просмотра, при этом делегат обеспечивает повторное использование виджетов — очень полезно, когда в списке большой набор данных.
SliverList(
delegate: SliverChildBuilderDelegate(
(BuildContext context, int index) {
return ListTile(items[index]);
},
childCount: items.length,
),
),SliverGridDelegate — абстрактный класс для делегатов, управляющих размещением элементов в сетке для SliverGrid. Тут также два основных подкласса:
SliverGridDelegateWithFixedCrossAxisCount — создает SliverGrid с фиксированным количеством элементов по поперечной оси.
SliverGrid(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3),
delegate: SliverChildListDelegate(items),
),SliverGridDelegateWithMaxCrossAxisExtent — определяет максимальный размер элементов по поперечной оси, полезен для адаптивных сеток.
SliverGrid(
gridDelegate: const SliverGridDelegateWithMaxCrossAxisExtent(maxCrossAxisExtent: 200.0),
delegate: SliverChildListDelegate(items),
),У SliverGridDelegate есть также собственные параметры, которые можно использовать в SliverGridDelegateWithFixedCrossAxisCount и SliverGridDelegateWithMaxCrossAxisExtent:
childAspectRatio — соотношение сторон элементов внутри сетки, задаваемое как отношение ширины к высоте (по умолчанию = 1.0, то есть элементы квадратные);
crossAxisSpacing — расстояние между элементами по поперечной оси;
mainAxisSpacing — расстояние между элементами вдоль главной оси;
mainAxisExtent — задает фиксированный размер элементов по главной оси (не используется одновременно с childAspectRatio).
SliverGrid(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
childAspectRatio: 2,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
),
delegate: SliverChildListDelegate(items),
),На этом закончим со сливерами-списками. В следующей статье посмотрим на сливеры, которые помогают с позиционированием и компоновкой.
