Stylish
A horizontally connected group of buttons that share outlines and corner radii to form a segmented-control appearance.
This is the Finish-layer component: it supplies the Stylish button rendering (DefaultStylishConnectedButton) to the headless Structure layout ConnectedButtonRow, which owns arrangement and connection geometry. Each button occupies an equal weight within the row and stretches to the tallest sibling. Outline edges and corner radii are computed automatically from each item's index. Items whose StylishConnectedButtonItem.onClick is null or whose StylishConnectedButtonItem.enabled is false are rendered in a disabled state and do not respond to interaction. Pass a custom button to override the Stylish rendering while keeping the connected geometry.
Parameters
The list of StylishConnectedButtonItem data objects that describe each button's content, click action, colors, and enabled state.
The radius applied to the outer corners of the first and last buttons. Defaults to StylishTheme.dimensions.connectedCornerRadius (12 dp).
The horizontal gap between adjacent buttons. Defaults to StylishTheme.dimensions.connectedSpacing (3 dp).
The inner padding of each button. Defaults to 12 dp horizontal and 12 dp vertical.
The ButtonColors used for every item whose StylishConnectedButtonItem.colors is null.
A composable lambda that renders a single button. Receives the item data, a modifier (including weight and fill-max-height), the connected Shape, the outline ConnectedEdges, and the outline ConnectedCorners. Defaults to DefaultStylishConnectedButton, dressed in the Stylish look with cornerRadius, contentPadding, and defaultColors.