Такие разные Slivers. Часть 3: работа с пространством

Всем привет! Двигаемся дальше в изучении сливеров, в прошлых статьях мы познакомились со сливерами-списками, посмотрели на их базовые классы и делегаты. В этой статье будем рассматривать сливеры, которые помогают управлять отступами, позиционированием и распределением пространства. Эти виджеты обеспечивают гибкость при настройке компоновки и позволяют создавать более точные и адаптивные интерфейсы.

Предыдущие материалы по теме:
Такие разные Slivers. Часть 1: обзор и применение во Flutter
Такие разные Slivers. Часть 2: базовые классы и делегаты

SliverPadding — добавляет отступы для другого сливера.

SliverPadding(   padding: const EdgeInsets.all(50.0),   sliver: SomeSliver(), ),

SliverSafeArea — оборачивает дочерний сливер в достаточный padding, чтобы избежать перекрытий операционной системы

SliverSafeArea(   sliver: SomeSliver(), ),

SliverConstrainedCrossAxis — ограничивает размер дочернего sliver по поперечной оси.

SliverConstrainedCrossAxis(   maxExtent: 250,   sliver: SomeSliver(), ),

SliverMainAxisGroup — размещает множество дочерних сливеров в линейном массиве вдоль главной оси, один за другим. То же самое делает SliverList, но только для обычных виджетов, данный сливер же работает со сливерами, которые в том числе могут быть нефиксированной высоты. Можно использовать, например, чтобы добавить закрепленный заголовок только для части контента в скролле.

SliverMainAxisGroup(   slivers: [     SomeSliver(),     AnotherSliver(),   ], ),

SliverCrossAxisGroup — размещает дочерние сливеры в массиве по поперечной оси.

SliverCrossAxisGroup(   slivers: [     SomeSliver(),     AnotherSliver(),   ], ),

SliverCrossAxisExpanded — устанавливает flex коэффициент для распределения пространства в SliverCrossAxisGroup.

SliverCrossAxisGroup(   slivers: [     SliverCrossAxisExpanded(       flex: 3,       sliver: SomeSliver(),     ),     SliverCrossAxisExpanded(       flex: 2,       sliver: AnotherSliver(),     ),   ], ),

SliverToBoxAdapter — отображает один виджет, что позволяет обычным виджетам работать со сливерами.

SliverToBoxAdapter(   child: Container(     color: Colors.orange,     child: const Text('Item'),   ), ),

SliverFillRemaining — заполняет оставшееся пространство в области просмотра.

SliverFillRemaining(   child: Container(     color: orange,     child: const Text('Item'),   ), ),

В следующей части познакомимся со сливерами для более гибкого управления размерами и поведением элементов во время прокрутки.