Collapsible

A fully controlled single-section disclosure primitive with animated expand/collapse and scoped trigger and content slots.

Collapsible is a controlled disclosure primitive — the caller owns the open state and receives toggle intent via onOpenChange. Inside the trailing content lambda, CollapsibleScope exposes two slots: CollapsibleTrigger (a clickable Row) and CollapsibleContent (an AnimatedVisibility-wrapped Column with 300 ms fade + expand/shrink animation).

Basic usage

With icon

Animate an Icon rotation with animateFloatAsState to give a visual hint of the open direction.

Disabled

Set enabled = false to prevent the trigger from responding to taps. The content stays in its current open state but cannot be changed by the user.

API reference

Collapsible

ParameterTypeDefaultDescription
openBooleanWhether the content is currently expanded. Owned by the caller.
onOpenChange(Boolean) -> UnitInvoked with the requested new open state when the trigger is tapped.
modifierModifierModifierApplied to the root Column.
enabledBooleantrueWhen false, the trigger does not respond to taps.
content@Composable CollapsibleScope.() -> UnitSlot for CollapsibleTrigger and CollapsibleContent.

CollapsibleTrigger

Scoped to CollapsibleScope. A Row that toggles open on tap.

ParameterTypeDefaultDescription
modifierModifierModifierApplied to the trigger Row.
horizontalArrangementArrangement.HorizontalArrangement.StartHorizontal arrangement of the trigger's children.
verticalAlignmentAlignment.VerticalAlignment.TopVertical alignment of the trigger's children.
content@Composable RowScope.() -> UnitTrigger content.

CollapsibleContent

Scoped to CollapsibleScope. An AnimatedVisibility wrapper that fades and expands/shrinks over 300 ms.

ParameterTypeDefaultDescription
modifierModifierModifierApplied to the inner Column.
content@Composable ColumnScope.() -> UnitContent revealed when open is true.
Edit this page on GitHub