Acessibilidade no Jetpack Compose

A acessibilidade é essencial para criar apps inclusivos que possam ser usados por todos. O Compose oferece uma base para a criação de IUs acessíveis que tornam seus apps utilizáveis para todas as pessoas em qualquer lugar.

Principais conceitos

  • Semântica:o sistema de representação do significado de elementos da interface para serviços de acessibilidade. Isso inclui propriedades como descrições, estados e ações que um usuário pode realizar.

  • Travessia:a ordem em que serviços de acessibilidade, como o TalkBack, navegam pelos elementos na tela. É possível personalizar essa ordem para melhorar a experiência do usuário.

  • Ações de acessibilidade:ações específicas que um usuário pode realizar em um elemento da interface, como clicar, rolar e dispensar. Seu app as comunica aos serviços de acessibilidade.

Começar

A base do modelo e das ferramentas de acessibilidade do Compose é a semântica. Consulte o guia Semântica no Compose para mais informações.

Ao desenvolver seu app, lembre-se destas etapas importantes desde o início para melhorar a acessibilidade do app Compose:

  • Considere tamanhos mínimos de área de toque:confira se os elementos clicáveis e interativos têm pelo menos 48 dp. Isso segue as diretrizes de acessibilidade do Material Design.
  • Adicionar rótulos de clique:descreva o comportamento de clique com o modificador clickable ou semantics se você não tiver acesso direto a clickable.
  • Descrever elementos visuais:use o parâmetro contentDescription para descrever textualmente ícones e imagens. Defina contentDescription como null para elementos decorativos.
  • Definir cabeçalhos:use a propriedade modificadora semantics para marcar elementos como cabeçalhos e facilitar a navegação.
  • Ordem de travessia de controle:use isTraversalGroup para marcar grupos de elementos que serão lidos juntos. Use traversalIndex para personalizar ainda mais a ordem dos elementos nesses grupos.

Para saber mais, consulte o guia dedicado Etapas principais para melhorar a acessibilidade do Compose.

Ferramentas

  • TalkBack:leitor de tela do Google para Android. Ative-a para testar como a semântica do app funciona para usuários que dependem de tecnologias adaptativas.
  • Layout Inspector:visualize e depure a árvore semântica do seu app.
  • APIs de teste do Compose:escreva testes que interagem com elementos semânticos para declarar a acessibilidade das suas interfaces do Compose.

Codelab

Para saber mais sobre como oferecer suporte à acessibilidade no seu código do Compose, faça o codelab Acessibilidade no Jetpack Compose.

Outros recursos