Mostrar itens de rolagem aninhados em uma lista
Mantenha tudo organizado com as coleções
Salve e categorize o conteúdo com base nas suas preferências.
É possível mostrar itens de rolagem aninhados em uma lista para apresentar layouts complexos,
como catálogos de produtos, galerias de mídia, feeds de notícias e muito mais.
Compatibilidade de versões
Essa implementação exige que o minSDK do projeto seja definido como nível 21 da API ou
mais recente.
Dependências
O código a seguir produz uma lista que rola em duas direções. As linhas da lista
são roladas horizontalmente; a lista como um todo, uma única coluna, é rolada verticalmente.
@Composable
fun NestedScrollingRowsList(urls: List<String>) {
LazyColumn {
items(10) {
LazyRow {
item { Text("Row: $it") }
items(urls.size) { index ->
// AsyncImage provided by Coil.
AsyncImage(
model = urls[index],
modifier = Modifier.size(150.dp),
contentDescription = null
)
}
}
}
}
}
Resultados
O vídeo a seguir mostra os comportamentos resultantes de listas horizontais aninhadas
em uma lista de rolagem vertical.
Coleções que contêm este guia
Este guia faz parte destas coleções selecionadas de guias rápidos que abrangem
metas mais amplas de desenvolvimento para Android:
Mostrar uma lista ou grade
As listas e as grades permitem que o app exiba coleções de uma
forma agradável e fácil de consumir pelos usuários.
Mostrar componentes interativos
Aprenda como as funções combináveis podem permitir que você crie
componentes de interface bonitos com base no sistema de design
do Material Design.
Noções básicas do Compose (coleção de vídeos)
Esta série de vídeos apresenta várias APIs do Compose,
mostrando rapidamente o que está disponível e como usá-las.
O conteúdo e os exemplos de código nesta página estão sujeitos às licenças descritas na Licença de conteúdo. Java e OpenJDK são marcas registradas da Oracle e/ou suas afiliadas.
Última atualização 2025-02-06 UTC.
[[["Fácil de entender","easyToUnderstand","thumb-up"],["Meu problema foi resolvido","solvedMyProblem","thumb-up"],["Outro","otherUp","thumb-up"]],[["Não contém as informações de que eu preciso","missingTheInformationINeed","thumb-down"],["Muito complicado / etapas demais","tooComplicatedTooManySteps","thumb-down"],["Desatualizado","outOfDate","thumb-down"],["Problema na tradução","translationIssue","thumb-down"],["Problema com as amostras / o código","samplesCodeIssue","thumb-down"],["Outro","otherDown","thumb-down"]],["Última atualização 2025-02-06 UTC."],[],[]]