Compose Component

TrailingImageCard

TrailingImageCard is a component used to group related information into a single digestible unit, featuring a trailing image.

TrailingImageCard

Source set: Android
@Composable
public fun TrailingImageCard(
    image: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    title: @Composable (() -> Unit)? = null,
    subtitle: @Composable (() -> Unit)? = null,
    shape: Shape = TrailingImageCardDefaults.shape,
    color: Color = TrailingImageCardDefaults.color,
    contentColor: Color = TrailingImageCardDefaults.contentColor(color),
    contentPadding: PaddingValues = TrailingImageCardDefaults.contentPadding,
    interactionSource: MutableInteractionSource? = null,
    content: @Composable () -> Unit,
)

Parameters

image the image to be placed after the text content. This image is allocated 30% of the card width.
modifier the Modifier to be applied to this card
title optional title to be placed above subtitle and content
subtitle optional subtitle to be placed above content, below title
shape the Shape used to clip this card, and also used to draw the background and border
color background color of this card
contentColor content color used by components inside content, title, and subtitle
contentPadding the spacing values to apply internally between the container and the content. Note that there is additional padding applied around the content / text / image inside a card, this only affects the outermost content padding.
interactionSource an optional hoisted MutableInteractionSource for observing and emitting Interactions for this card. You can use this to change the card's appearance or preview the card in different states. Note that if null is provided, interactions will still happen internally.
content the main content / body text to display inside this card. This is recommended to be limited to 10 lines of text.

TrailingImageCard

Source set: Android
@Composable
public fun TrailingImageCard(
    onClick: () -> Unit,
    image: @Composable () -> Unit,
    modifier: Modifier = Modifier,
    title: @Composable (() -> Unit)? = null,
    subtitle: @Composable (() -> Unit)? = null,
    shape: Shape = TrailingImageCardDefaults.shape,
    color: Color = TrailingImageCardDefaults.color,
    contentColor: Color = TrailingImageCardDefaults.contentColor(color),
    contentPadding: PaddingValues = TrailingImageCardDefaults.contentPadding,
    interactionSource: MutableInteractionSource? = null,
    content: @Composable () -> Unit,
)

Parameters

onClick called when this card item is clicked
image the image to be placed after the text content. This image is allocated 30% of the card width.
modifier the Modifier to be applied to this card
title optional title to be placed above subtitle and content
subtitle optional subtitle to be placed above content, below title
shape the Shape used to clip this card, and also used to draw the background and border
color background color of this card
contentColor content color used by components inside content, title, and subtitle
contentPadding the spacing values to apply internally between the container and the content. Note that there is additional padding applied around the content / text / image inside a card, this only affects the outermost content padding.
interactionSource an optional hoisted MutableInteractionSource for observing and emitting Interactions for this card. You can use this to change the card's appearance or preview the card in different states. Note that if null is provided, interactions will still happen internally.
content the main content / body text to display inside this card. This is recommended to be limited to 10 lines of text.

Content updated: