Mostrar itens de rolagem aninhados em uma lista

É 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

Implementar rolagem horizontal aninhada na lista vertical

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:

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.
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.
Esta série de vídeos apresenta várias APIs do Compose, mostrando rapidamente o que está disponível e como usá-las.

Tem dúvidas ou feedback?

Acesse a página de perguntas frequentes e saiba mais sobre os guias rápidos ou entre em contato e conte o que você pensa.