Stylish
A lazily-composed grid of connected list items laid out in equal-width cells across a fixed number of columns, with shared outlines and corner radii — suited for scrollable settings dashboards or grouped navigation tiles.
This is the Finish-layer component: it supplies the Stylish list-item rendering (DefaultStylishConnectedListItem) to the headless Structure layout ConnectedListItemLazyGrid, which owns arrangement and connection geometry. Only the visible rows are composed, while the connection geometry is computed exactly as in the eager StylishConnectedListItemGrid: items are chunked into rows of columns items, within each row every item receives equal weight, corner radii are computed from each item's absolute index so that only the four outer corners of the entire grid are rounded, and a partially filled final row stretches to fill the full row width. Each item displays a headline, optional supporting text, additional supporting lines, and optional leading/trailing slot content. Items whose StylishConnectedListItem.onClick and StylishConnectedListItem.onLongClick are both null, or whose StylishConnectedListItem.enabled is false, are rendered without elevation and do not respond to interaction. Pass a custom listItem to override the Stylish rendering while keeping the connected geometry.
Parameters
The list of StylishConnectedListItem data objects that describe each cell's headline, supporting text, click/long-click actions, enabled state, and slot content.
The number of equal-width columns in the grid. Must be greater than zero.
The gap between adjacent items both horizontally and vertically. Defaults to StylishTheme.dimensions.connectedSpacing (3 dp).
PaddingValues applied around the entire lazy grid. Defaults to DefaultStylishDimensions.controlPadding horizontal padding.
LazyGridState controlling scroll position. Defaults to rememberLazyGridState. Supply a hoisted state to observe scroll offset or programmatically scroll.
Maximum number of lines for the headline text. Defaults to Int.MAX_VALUE (unlimited).
The TextOverflow strategy for the headline when it exceeds headlineMaxLines. Defaults to TextOverflow.Ellipsis.
The TextStyle applied to each item's headline. Defaults to MaterialTheme.typography.titleMedium.
Maximum number of lines for supporting text and supporting lines. Defaults to Int.MAX_VALUE (unlimited).
The TextOverflow strategy for supporting text. Defaults to TextOverflow.Ellipsis.
The TextStyle applied to supporting text and supporting lines. Defaults to MaterialTheme.typography.bodyMedium.
The background color of each item surface. When null, defaults to MaterialTheme.stylishComponentColors.groupedContainer.
The content color of each item surface. When null, defaults to an enabled/disabled-aware color.
The horizontal padding inside each item. Defaults to 16 dp.
The vertical padding inside each item. Defaults to 14 dp.
The horizontal gap between the leading slot, text block, and trailing slot inside each item. Defaults to StylishTheme.dimensions.itemSpacing (8 dp).
The MutableInteractionSource forwarded to each actionable item to observe press/hover/focus interactions for the state layer. When null, each item remembers its own. Pass a shared source to observe group-level interaction, e.g. to trigger a state update from a parent.
A composable lambda that renders a single cell. Receives the item data, a modifier (fill-max-width within an equal-weight cell), the connected Shape, the outline ConnectedEdges, and the outline ConnectedCorners. Defaults to DefaultStylishConnectedListItem, dressed in the Stylish look with the text, color, padding, and spacing parameters above.