RemoteTitleCard

Functions summary

Unit

@RemoteComposable
@Composable
RemoteTitleCard(
    onClick: Action,
    title: @Composable @RemoteComposable () -> Unit,
    modifier: RemoteModifier,
    enabled: RemoteBoolean,
    time: (@Composable @RemoteComposable () -> Unit)?,
    subtitle: (@Composable @RemoteComposable () -> Unit)?,
    shape: RemoteShape,
    colors: RemoteCardColors,
    contentPadding: RemotePaddingValues,
    content: (@Composable @RemoteComposable () -> Unit)?
)

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

Unit

@RemoteComposable
@Composable
RemoteTitleCard(
    onClick: Action,
    containerPainter: RemotePainter,
    title: @Composable @RemoteComposable () -> Unit,
    modifier: RemoteModifier,
    enabled: RemoteBoolean,
    time: (@Composable @RemoteComposable () -> Unit)?,
    subtitle: (@Composable @RemoteComposable () -> Unit)?,
    shape: RemoteShape,
    colors: RemoteCardColors,
    contentPadding: RemotePaddingValues,
    content: (@Composable @RemoteComposable () -> Unit)?
)

Opinionated Wear Material 3 RemoteCard that offers a specific layout to show interactive information about an application, e.g. a message, with a background image.

Functions

RemoteTitleCard

Artifact: androidx.wear.compose.remote:remote-material3

View Source

Added in 1.0.0-alpha12

@RemoteComposable
@Composable
fun RemoteTitleCard(
    onClick: Action,
    title: @Composable @RemoteComposable () -> Unit,
    modifier: RemoteModifier = RemoteModifier,
    enabled: RemoteBoolean = true.rb,
    time: (@Composable @RemoteComposable () -> Unit)? = null,
    subtitle: (@Composable @RemoteComposable () -> Unit)? = null,
    shape: RemoteShape = RemoteCardDefaults.shape,
    colors: RemoteCardColors = RemoteCardDefaults.cardColors(),
    contentPadding: RemotePaddingValues = RemoteCardDefaults.ContentPadding,
    content: (@Composable @RemoteComposable () -> Unit)? = null
): Unit

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

import androidx.compose.remote.creation.compose.action.Action
import androidx.compose.remote.creation.compose.modifier.RemoteModifier
import androidx.compose.remote.creation.compose.modifier.padding
import androidx.compose.remote.creation.compose.state.rdp
import androidx.compose.remote.creation.compose.state.rs
import androidx.wear.compose.remote.material3.RemoteText
import androidx.wear.compose.remote.material3.RemoteTitleCard

RemoteTitleCard(
    onClick = Action.Empty,
    title = { RemoteText("Title Card Title".rs) },
    time = { RemoteText("now".rs) },
    modifier = RemoteModifier.padding(16.rdp),
    subtitle = { RemoteText("Card Subtitle here".rs) },
) {
    RemoteText("This is a sample Title Card.".rs)
}

Parameters
`onClick: Action`	Will be called when the user clicks the card
`title: @Composable @RemoteComposable () -> Unit`	A slot for displaying the title of the card
`modifier: RemoteModifier = RemoteModifier`	Modifier to be applied to the card
`enabled: RemoteBoolean = true.rb`	Controls the enabled state of the card. When false, this component will not respond to user input
`time: (@Composable @RemoteComposable () -> Unit)? = null`	An optional slot for displaying the time relevant to the contents of the card
`subtitle: (@Composable @RemoteComposable () -> Unit)? = null`	An optional slot for displaying the subtitle of the card
`shape: RemoteShape = RemoteCardDefaults.shape`	Defines the card's shape.
`colors: RemoteCardColors = RemoteCardDefaults.cardColors()`	`RemoteCardColors` that will be used to resolve the colors used for this card.
`contentPadding: RemotePaddingValues = RemoteCardDefaults.ContentPadding`	The spacing values to apply internally between the container and the content
`content: (@Composable @RemoteComposable () -> Unit)? = null`	The optional body content of the card.

RemoteTitleCard

Artifact: androidx.wear.compose.remote:remote-material3

View Source

Added in 1.0.0-alpha12

@RemoteComposable
@Composable
fun RemoteTitleCard(
    onClick: Action,
    containerPainter: RemotePainter,
    title: @Composable @RemoteComposable () -> Unit,
    modifier: RemoteModifier = RemoteModifier,
    enabled: RemoteBoolean = true.rb,
    time: (@Composable @RemoteComposable () -> Unit)? = null,
    subtitle: (@Composable @RemoteComposable () -> Unit)? = null,
    shape: RemoteShape = RemoteCardDefaults.shape,
    colors: RemoteCardColors = RemoteCardDefaults.cardWithContainerPainterColors(),
    contentPadding: RemotePaddingValues = RemoteCardDefaults.CardWithContainerPainterContentPadding,
    content: (@Composable @RemoteComposable () -> Unit)? = null
): Unit

Opinionated Wear Material 3 RemoteCard that offers a specific layout to show interactive information about an application, e.g. a message, with a background image.

An Image background is a means to reinforce the meaning of information in a Card, e.g. to help to contextualize the information. Cards should have a content color that contrasts with the background image and scrim. This RemoteTitleCard takes containerPainter for the container image background to be drawn (the RemoteCardColors containerColor property is ignored). It is recommended to use RemoteCardDefaults.containerPainter to create the painter so that a scrim is drawn on top of the container image, ensuring that any content above the background is legible.

import androidx.compose.remote.creation.compose.action.Action
import androidx.compose.remote.creation.compose.modifier.RemoteModifier
import androidx.compose.remote.creation.compose.modifier.padding
import androidx.compose.remote.creation.compose.state.rdp
import androidx.compose.remote.creation.compose.state.rememberNamedRemoteImageBitmap
import androidx.compose.remote.creation.compose.state.rs
import androidx.compose.ui.graphics.asImageBitmap
import androidx.wear.compose.remote.material3.RemoteCardDefaults
import androidx.wear.compose.remote.material3.RemoteText
import androidx.wear.compose.remote.material3.RemoteTitleCard
import androidx.wear.compose.remote.material3.previews.utils.createImage

val backgroundImage =
    rememberNamedRemoteImageBitmap(name = "backgroundImage") {
        createImage(200, 200).asImageBitmap()
    }
val containerPainter = RemoteCardDefaults.containerPainter(backgroundImage)
RemoteTitleCard(
    onClick = Action.Empty,
    containerPainter = containerPainter,
    title = { RemoteText("Title Card".rs) },
    time = { RemoteText("now".rs) },
    modifier = RemoteModifier.padding(16.rdp),
    subtitle = { RemoteText("Card Subtitle".rs) },
) {
    RemoteText("Card with background image.".rs)
}

Parameters
`onClick: Action`	Will be called when the user clicks the card
`containerPainter: RemotePainter`	The `RemotePainter` to use to draw the container image of the `RemoteTitleCard`, such as returned by `RemoteCardDefaults.containerPainter`.
`title: @Composable @RemoteComposable () -> Unit`	A slot for displaying the title of the card
`modifier: RemoteModifier = RemoteModifier`	Modifier to be applied to the card
`enabled: RemoteBoolean = true.rb`	Controls the enabled state of the card. When false, this component will not respond to user input
`time: (@Composable @RemoteComposable () -> Unit)? = null`	An optional slot for displaying the time relevant to the contents of the card
`subtitle: (@Composable @RemoteComposable () -> Unit)? = null`	An optional slot for displaying the subtitle of the card
`shape: RemoteShape = RemoteCardDefaults.shape`	Defines the card's shape.
`colors: RemoteCardColors = RemoteCardDefaults.cardWithContainerPainterColors()`	`RemoteCardColors` that will be used to resolve the colors used for this card.
`contentPadding: RemotePaddingValues = RemoteCardDefaults.CardWithContainerPainterContentPadding`	The spacing values to apply internally between the container and the content
`content: (@Composable @RemoteComposable () -> Unit)? = null`	The optional body content of the card.