CardKt

public final class CardKt


Summary

Public methods

static final @Composable void
AppCard(
    @NonNull Function0<Unit> onClick,
    @NonNull Function0<Unit> appName,
    @NonNull Function0<Unit> time,
    @NonNull Function0<Unit> title,
    @NonNull Function0<Unit> body,
    @NonNull Modifier modifier,
    @Nullable Function0<Unit> appImage,
    @NonNull Painter backgroundPainter,
    @NonNull Color appColor,
    @NonNull Color timeColor,
    @NonNull Color titleColor,
    @NonNull Color bodyColor
)

Opinionated Wear Material Card that offers a specific 5 slot layout to show information about an application, e.g.

static final @Composable void
Card(
    @NonNull Function0<Unit> onClick,
    @NonNull Modifier modifier,
    @NonNull Painter backgroundPainter,
    @NonNull Color contentColor,
    boolean enabled,
    @NonNull PaddingValues contentPadding,
    @NonNull Shape shape,
    @NonNull MutableInteractionSource interactionSource,
    @Nullable Role role,
    @NonNull Function0<Unit> content
)

Base level Wear Material Card that offers a single slot to take any content.

static final @Composable void
TitleCard(
    @NonNull Function0<Unit> onClick,
    @NonNull Function0<Unit> title,
    @NonNull Function0<Unit> body,
    @NonNull Modifier modifier,
    @Nullable Function0<Unit> time,
    @NonNull Painter backgroundPainter,
    @NonNull Color titleColor,
    @NonNull Color timeColor,
    @NonNull Color bodyColor
)

Opinionated Wear Material Card that offers a specific 3 slot layout to show interactive information about an application, e.g.

Public methods

AppCard

@Composable
@NonNull
public static final @Composable void AppCard(
    @NonNull Function0<Unit> onClick,
    @NonNull Function0<Unit> appName,
    @NonNull Function0<Unit> time,
    @NonNull Function0<Unit> title,
    @NonNull Function0<Unit> body,
    @NonNull Modifier modifier,
    @Nullable Function0<Unit> appImage,
    @NonNull Painter backgroundPainter,
    @NonNull Color appColor,
    @NonNull Color timeColor,
    @NonNull Color titleColor,
    @NonNull Color bodyColor
)

Opinionated Wear Material Card that offers a specific 5 slot layout to show information about an application, e.g. a notification. AppCards are designed to show interactive elements from multiple applications. They will typically be used by the system UI, e.g. for showing a list of notifications from different applications. However it could also be adapted by individual application developers to show information about different parts of their application.

The first row of the layout has three slots, 1) a small optional application Image or Icon of size CardDefaults.AppImageSizexCardDefaults.AppImageSize dp, 2) an application name (emphasised with the CardColors.appColor() color), it is expected to be a short start aligned Text composable, and 3) the time that the application activity has occurred which will be shown on the top row of the card, this is expected to be an end aligned Text composable showing a time relevant to the contents of the Card.

The second row shows a title, this is expected to be a single row of start aligned Text.

The rest of the Card contains the body content which can be either Text or an Image.

Parameters
@NonNull Function0<Unit> onClick

Will be called when the user clicks the card

@NonNull Function0<Unit> appName

A slot for displaying the application name, expected to be a single line of text of Typography.title3

@NonNull Function0<Unit> time

A slot for displaying the time relevant to the contents of the card, expected to be a short piece of end aligned text.

@NonNull Function0<Unit> body

A slot for displaying the details of the Card, expected to be either Text (single or multiple-line) or an Image

@NonNull Modifier modifier

Modifier to be applied to the card

@Nullable Function0<Unit> appImage

A slot for a small (CardDefaults.AppImageSizexCardDefaults.AppImageSize ) Image or Icon associated with the application.

@NonNull Painter backgroundPainter

A painter used to paint the background of the card. A card will normally have a gradient background. Use CardDefaults.cardBackgroundPainter() to obtain an appropriate painter

@NonNull Color appColor

The default color to use for appName() and appImage() slots unless explicitly set.

@NonNull Color timeColor

The default color to use for time() slot unless explicitly set.

@NonNull Color titleColor

The default color to use for title() slot unless explicitly set.

@NonNull Color bodyColor

The default color to use for body() slot unless explicitly set.

Card

@Composable
@NonNull
public static final @Composable void Card(
    @NonNull Function0<Unit> onClick,
    @NonNull Modifier modifier,
    @NonNull Painter backgroundPainter,
    @NonNull Color contentColor,
    boolean enabled,
    @NonNull PaddingValues contentPadding,
    @NonNull Shape shape,
    @NonNull MutableInteractionSource interactionSource,
    @Nullable Role role,
    @NonNull Function0<Unit> content
)

Base level Wear Material Card that offers a single slot to take any content.

Is used as the container for more opinionated Card components that take specific content such as icons, images, titles, subtitles and labels.

The Card is Rectangle shaped rounded corners by default.

Cards can be enabled or disabled. A disabled card will not respond to click events.

Parameters
@NonNull Function0<Unit> onClick

Will be called when the user clicks the card

@NonNull Modifier modifier

Modifier to be applied to the card

@NonNull Painter backgroundPainter

A painter used to paint the background of the card. A card will normally have a gradient background. Use CardDefaults.cardBackgroundPainter() to obtain an appropriate painter

@NonNull Color contentColor

The default color to use for content() unless explicitly set.

boolean enabled

Controls the enabled state of the card. When false, this card will not be clickable

@NonNull PaddingValues contentPadding

The spacing values to apply internally between the container and the content

@NonNull Shape 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

@NonNull MutableInteractionSource 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.

@Nullable Role role

The type of user interface element. Accessibility services might use this to describe the element or do customizations

TitleCard

@Composable
@NonNull
public static final @Composable void TitleCard(
    @NonNull Function0<Unit> onClick,
    @NonNull Function0<Unit> title,
    @NonNull Function0<Unit> body,
    @NonNull Modifier modifier,
    @Nullable Function0<Unit> time,
    @NonNull Painter backgroundPainter,
    @NonNull Color titleColor,
    @NonNull Color timeColor,
    @NonNull Color bodyColor
)

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 (emphasised with the titleColor and expected to be start aligned text). 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 body content which is expected to be Text or a contained Image.

Overall the title and body text should be no more than 5 rows of text combined.

Parameters
@NonNull Function0<Unit> onClick

Will be called when the user clicks the card

@NonNull Function0<Unit> title

A slot for displaying the title of the card, expected to be one or two lines of text of Typography.button

@NonNull Function0<Unit> body

A slot for displaying the details of the Card, expected to be either Text (single or multiple-line) or an Image. If Text then it is expected to be a maximum of 4 lines of text of Typography.body1

@NonNull Modifier modifier

Modifier to be applied to the card

@Nullable Function0<Unit> 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.

@NonNull Painter backgroundPainter

A painter used to paint the background of the card. A title card can have either a gradient background or an image background, use CardDefaults.cardBackgroundPainter() or CardDefaults.imageBackgroundPainter() to obtain an appropriate painter

@NonNull Color titleColor

The default color to use for title() slot unless explicitly set.

@NonNull Color timeColor

The default color to use for time() slot unless explicitly set.

@NonNull Color bodyColor

The default color to use for body() slot unless explicitly set.