Listas são índices verticais e contínuos de elementos. Use ScalingLazyColumn para criar listas no Wear OS.
A ScalingLazyColumn é uma personalização do LazyColumn criada especificamente para o Wear OS. As listas oferecem escalonamento e transparência, o que permite que o conteúdo seja encolhido e esmaecido nas partes de cima e de baixo da tela para ajudar os usuários a ver no que se concentrar. As listas são fixadas no centro da tela, o que dá mais ênfase aos itens no meio da lista.
As listas podem conter itens de altura fixa ou variável. O conteúdo da lista precisa ter margem suficiente para acomodar telas redondas.
Padding
Paddings padronizados são usados ao criar uma lista dependendo do elemento. Se for necessário mais preenchimento vertical para listas mais complexas, o espaçamento será definido em múltiplos de 4 dp para manter a consistência.
Entre as seções
O espaçamento entre as seções superior, central e inferior deve ser definido como 16 dp.
Entre títulos e conteúdo
O espaçamento entre as seções superior, central e inferior deve ser definido como 12 dp.
Entre os slots
O padding entre os slots na seção do meio precisa ser definido como 16 dp.
Entre os grupos
O padding entre grupos em um slot precisa ser definido como 8 dp.
Entre os elementos
O padding entre elementos de um grupo precisa ser definido como 4 dp.
Comportamento de ajuste
Para dar ênfase a um item da lista ao rolar, use o ajuste. Use o ajuste quando os itens forem altos, mas não mais altos do que a tela.
O comportamento de ajuste tem duas formas. ItemCenter usa o centro do item como ponto de referência. ItemStart usa a borda do item como um ponto de referência. Use o primeiro para centralizar um item na tela e o segundo para centralizar dois itens. Defina esse comportamento usando o parâmetro anchorType.
Para ter mais controle sobre o comportamento de ajuste em uma lista, defina
flingBehavior a ScalingLazyColumnDefaults.snapFlingBehavior
e rotaryScrollableBehavior para RotaryScrollableDefaults.snapBehavior.
Uso
Confira os exemplos abaixo de como usar listas em relógios.
Layouts adaptáveis
As imagens abaixo mostram vários exemplos de layouts adaptáveis. Para orientações de implementação, visite a página Desenvolver para diferentes tamanhos de tela.
Comportamento responsivo
Lista os componentes se esticam para preencher a largura disponível em telas maiores.
Margens superiores
As margens superiores variam de acordo com os elementos que estão na seção superior.
A lista começa com um título
A lista começa com um ou dois botões
A lista começa com outros elementos
Margens inferiores
As margens inferiores variam de acordo com os elementos que estão na seção inferior.
A lista termina com botões
A lista termina com outros elementos
Margens laterais
As margens laterais usam uma porcentagem padrão de 5,2% em todos os tipos de lista para garantir escalonabilidade em telas maiores.
Margens internas
Títulos
Há uma margem interna de 7,3% adicionada para garantir que os títulos não sejam cortados.
Botões de baixo
Os botões inferiores preenchem a largura disponível após o ponto de interrupção de 225. Para manter a hierarquia visual, foi adicionado um padding interno de 14,56% em telas maiores.