Itens de lista no Jetpack Compose Glimmer

Dispositivos XR relevantes
Estas orientações ajudam você a criar experiências para esses tipos de dispositivos XR.
Saiba mais sobre esses dispositivos →
Óculos de exibição
Saiba mais sobre esses dispositivos →

No Glimmer do Jetpack Compose, o ListItem é o componente padrão para mostrar uma única linha de conteúdo. Os itens de lista são projetados para a interação baseada em foco dos óculos de exibição. Por isso, eles oferecem uma resposta visual integrada ao ganhar foco.

O componente tem duas sobrecargas: uma com um parâmetro onClick para itens que acionam ações e uma versão somente para foco para conteúdo informativo que não exige uma ação de clique.

Figura 1. Exemplo de duas listas com diferentes estilos de itens de lista no Glimmer do Jetpack Compose.

Uso em listas

Os itens de lista são a principal opção para linhas em uma lista, mas as listas também podem hospedar outros componentes, como um Card ou TitleChip, para fornecer ênfases visuais diferentes.

Os itens de lista usam o slot headlineContent para o texto principal, alinhando-se aos componentes Card e TitleChip usados para outros itens.

Exemplo: item da lista com um rótulo e ícones de suporte

O código a seguir cria um item de lista com um rótulo de suporte e ícones iniciais e finais:

@Composable
private fun ListItemWithSupportingLabelAndIcons() {
    ListItem(
        supportingLabel = { Text("Supporting Label") },
        leadingIcon = { Icon(FavoriteIcon, "Localized description") },
        trailingIcon = { Icon(FavoriteIcon, "Localized description") },
    ) {
        Text("Primary Label")
    }
}