SliverGrid

SliverGrid is a sliver widget in the Flutter framework that arranges its children in a two‑dimensional grid within a scrollable area. It is designed to be used inside a CustomScrollView or another sliver-enabled scrollable, allowing the grid to scroll together with other slivers such as SliverAppBar or SliverList. SliverGrid builds its children lazily as they come into view, using a SliverChildDelegate (for example SliverChildBuilderDelegate or SliverChildListDelegate).

Layout for SliverGrid is defined by a gridDelegate, which controls tile sizing and spacing. Common options include SliverGridDelegateWithFixedCrossAxisCount, which fixes the number of columns and derives tile width from the available space, and SliverGridDelegateWithMaxCrossAxisExtent, which fixes the maximum tile width and adapts the number of columns accordingly. Both delegates support mainAxisSpacing, crossAxisSpacing, and childAspectRatio to influence tile size and shape.

SliverGrid differs from GridView in that it is a component of a sliver-based scrolling area rather than a standalone scrollable grid. This distinction allows developers to combine multiple slivers in a single scroll view and to apply advanced scrolling effects and behaviors across different types of content.

Common usage involves placing a SliverGrid inside a CustomScrollView with an appropriate gridDelegate and a SliverChildDelegate. For example, one might use SliverGrid with SliverGridDelegateWithFixedCrossAxisCount to render a grid of items built on demand, with configurable spacing and aspect ratio, within a larger scrollable page.