← Back to Wear Material Core
TitleCard
Overview
Code Examples
Video
Opinionated Wear Material Card that offers a specific 3 slot layout to show interactive information about an application, e.g. a message. TitleCards are designed for use within an application.
The first row of the layout has two slots. 1. a start aligned title. The title text is expected to be a maximum of 2 lines of text. 2. An optional time that the application activity has occurred shown at the end of the row, expected to be an end aligned Text composable showing a time relevant to the contents of the Card.
The rest of the Card contains the content which is expected to be Text or a contained Image.
If the content is text it can be single or multiple line and is expected to be Top and Start aligned.
Overall the title and content text should be no more than 5 rows of text combined.
If more than one composable is provided in the content slot it is the responsibility of the caller to determine how to layout the contents, e.g. provide either a row or a column.
@param onClick Will be called when the user clicks the card @param modifier Modifier to be applied to the card @param enabled Controls the enabled state of the card. When false, this card will not be clickable and there will be no ripple effect on click. Wear cards do not have any specific elevation or alpha differences when not enabled - they are simply not clickable. @param border A BorderStroke object which is used for the outline drawing. Can be null - then outline will not be drawn @param contentPadding The spacing values to apply internally between the container and the content @param containerPainter A Painter which is used for background drawing. @param interactionSource The MutableInteractionSource representing the stream of Interactions for this card. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this card in different Interactions. @param shape Defines the card's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material Theme @param title A slot for displaying the title of the card, expected to be one or two lines of text. @param time An optional slot for displaying the time relevant to the contents of the card, expected to be a short piece of end aligned text. @param content A main slot for a content of this card.
Overloads
TitleCard
@RestrictTo(RestrictTo.Scope.LIBRARY_GROUP)
@Composable
public fun TitleCard(
onClick: () -> Unit,
modifier: Modifier,
enabled: Boolean,
border: BorderStroke?,
contentPadding: PaddingValues,
containerPainter: Painter,
interactionSource: MutableInteractionSource,
shape: Shape,
title: @Composable RowScope.() -> Unit,
time: @Composable (RowScope.() -> Unit)?,
content: @Composable ColumnScope.() -> Unit,
)
Parameters
Name | Description |
---|---|
onClick | Will be called when the user clicks the card |
modifier | Modifier to be applied to the card |
enabled | Controls the enabled state of the card. When false, this card will not be clickable and there will be no ripple effect on click. Wear cards do not have any specific elevation or alpha differences when not enabled - they are simply not clickable. |
border | A BorderStroke object which is used for the outline drawing. Can be null - then outline will not be drawn |
contentPadding | The spacing values to apply internally between the container and the content |
containerPainter | A Painter which is used for background drawing. |
interactionSource | The MutableInteractionSource representing the stream of Interactions for this card. You can create and pass in your own remembered MutableInteractionSource if you want to observe Interactions and customize the appearance / behavior of this card in different Interactions. |
shape | Defines the card's shape. It is strongly recommended to use the default as this shape is a key characteristic of the Wear Material Theme |
title | A slot for displaying the title of the card, expected to be one or two lines of text. |
time | An optional slot for displaying the time relevant to the contents of the card, expected to be a short piece of end aligned text. |
content | A main slot for a content of this card |