Composable Component

ListItem

ListItem is a component used to represent a single item in a androidx.xr.glimmer.list.VerticalList.

RevenueCat

RevenueCat

Add subscriptions to your apps in minutes

Ad Get started for free

ListItem

Android
@Composable
public fun ListItem(
    modifier: Modifier = Modifier,
    supportingLabel: @Composable (() -> Unit)? = null,
    leadingIcon: @Composable (() -> Unit)? = null,
    trailingIcon: @Composable (() -> Unit)? = null,
    shape: Shape = GlimmerTheme.shapes.medium,
    color: Color = GlimmerTheme.colors.surface,
    contentColor: Color = calculateContentColor(color),
    border: BorderStroke? = SurfaceDefaults.border(),
    contentPadding: PaddingValues = ListItemDefaults.contentPadding,
    interactionSource: MutableInteractionSource? = null,
    content: @Composable () -> Unit,
)

Parameters
modifier the Modifier to be applied to this list item
supportingLabel optional supporting label to be placed underneath the primary label content
leadingIcon optional leading icon to be placed before the primary label content. This is typically an Icon.
trailingIcon optional trailing icon to be placed after the primary label content. This is typically an Icon.
shape the Shape used to clip this list item, and also used to draw the background and border
color background color of this list item
contentColor content color used by components inside content, supportingLabel, leadingIcon, and trailingIcon.
border the border to draw around this list item
contentPadding the spacing values to apply internally between the container and the content
interactionSource an optional hoisted MutableInteractionSource for observing and emitting Interactions for this list item. You can use this to change the list item's appearance or preview the list item in different states. Note that if null is provided, interactions will still happen internally.
content the main content / primary label to display inside this list item

ListItem

Android
@Composable
public fun ListItem(
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    supportingLabel: @Composable (() -> Unit)? = null,
    leadingIcon: @Composable (() -> Unit)? = null,
    trailingIcon: @Composable (() -> Unit)? = null,
    shape: Shape = GlimmerTheme.shapes.medium,
    color: Color = GlimmerTheme.colors.surface,
    contentColor: Color = calculateContentColor(color),
    border: BorderStroke? = SurfaceDefaults.border(),
    contentPadding: PaddingValues = ListItemDefaults.contentPadding,
    interactionSource: MutableInteractionSource? = null,
    content: @Composable () -> Unit,
)

Parameters
onClick called when this list item is clicked
modifier the Modifier to be applied to this list item
supportingLabel optional supporting label to be placed underneath the primary label content
leadingIcon optional leading icon to be placed before the primary label content. This is typically an Icon.
trailingIcon optional trailing icon to be placed after the primary label content. This is typically an Icon.
shape the Shape used to clip this list item, and also used to draw the background and border
color background color of this list item
contentColor content color used by components inside content, supportingLabel, leadingIcon, and trailingIcon.
border the border to draw around this list item
contentPadding the spacing values to apply internally between the container and the content
interactionSource an optional hoisted MutableInteractionSource for observing and emitting Interactions for this list item. You can use this to change the list item's appearance or preview the list item in different states. Note that if null is provided, interactions will still happen internally.
content the main content / primary label to display inside this list item