Concrete Logo
Hamburger button

Android: Como testar o leitor de tela (TalkBack) durante o desenvolvimento

  • Blog
  • 6 de Fevereiro de 2019

A questão da acessibilidade tem chamado a atenção de grandes empresas (com razão), seja por ser uma parcela do público que antigamente não era vista como consumidora ou por mera questão humanitária. De qualquer forma, a iniciativa é louvável.

No campo da tecnologia não é diferente. Cada vez mais temos a necessidade de tornar nossos aplicativos preparados para todas as pessoas, independente de suas necessidades especiais. Afinal, cerca de 15% da população mundial possui algum tipo de necessidade especial, segundo o The World Bank, e não vamos querer deixar esses usuários de fora das nossas aplicações, certo?

Neste caminho, surgiram algumas opções de facilitadores. Um deles é o TalkBack, disponibilizado pelo Google, um leitor de tela que oferece feedback por voz   sem a necessidade de que a pessoa esteja efetivamente olhando para a tela, ou seja, um cenário que contempla aqueles que possuem necessidades especiais de visão. Além dos facilitadores, também podemos usar ferramentas de análise para identificar pontos em que é possível melhorar a acessibilidade durante o desenvolvimento das nossas telas, e algumas opções de configuração de desenvolvedor resolvem isso rapidinho.

Neste post, vamos falar sobre dois pontos que ajudam a testar o TalkBack durante o desenvolvimento:

– O Speech Output, que exibe na UI o texto que será dito pelo leitor de tela; e

– Node tree debugging, que exibe no logcat a informações da view.

O serviço de acessibilidade do sistema operacional usa uma representação separada da UI para operar. Durante a depuração é possível habilitar essas duas opções para exibir o conteúdo daquilo que será dito pelo leitor de telas e visualizar a hierarquia das views e os atributos dos elementos da UI.

Como instalar o TalkBack no emulador

Como o aplicativo, por regra, não é instalado nos emuladores, o primeiro passo é… instalá-lo!

Meu conselho é que, dentre os emuladores que você use, você tenha sempre um com o TalkBack instalado e ativado. Pode ser um diferente daquele que você usa no dia-a-dia, separe um com essa finalidade, escolhendo até um nome de fácil memorização. Assim, quando precisar validar acessibilidade, já tem um pronto e você ganha tempo.

Depois disso, clone o projeto: https://github.com/google/talkback e atenda aos pré-requisitos (consequentemente o projeto vai estar compilando).
Instale o apk do projeto: “./gradlew installDebug”

Para ativar o TalkBack

 

1. Abra o Settings.;
2. Navegue até Accessibility e selecione Talkback;
3. No topo da tela, pressione On/Off para ligar e desligar o TalkBack;
4. Para confirmar, selecione o botão OK.

 

 

 

 

 

 

Para ativar o Speech output

 

 

 

Em TalkBack Settings > Developer settings, selecione Display speech output.

 

 

 

 

 

 

Para ativar o Node Tree Debugging

 

 

 

 

 

1. Em TalkBack Settings > Developer settings, selecione Enable node tree debugging;

2. Em TalkBack Settings > Developer settings, selecione em “Log output level” o valor Verbose;

3. Configure o gesture do TalkBack para que a node tree seja impressa no logcat;
– Em Talkback Settings > vá até Gesture;
– Selecione qualquer gesture. Pode ser utilizado qualquer um, mesmo, por exemplo o swipe right to up;
– Selecione Print node tree.

 

 

 

Nota: Conforme é apontado pelo próprio Google, a ativação e configuração do TalkBlack pode variar por diferentes motivos, de acordo com a fabricante do aparelho, versão do Android, versão do TalkBack, etc.

Como usar o Speech output

Após ativar o Speech output, ao selecionar algum item da UI vai aparecer um Toast com a informação que será lida pelo TalkBack. Com isso, é possível validar a acessibilidade de todos os elementos da view. O uso do Speech output veio de uma necessidade do dia-a-dia, eu precisei validar e ajustar a acessibilidade em uma tela complexa, e com o prazo apertado ficar prestando atenção no que era dito pelo leitor de tela acabaria consumindo muito do meu tempo. Usar o Speech output me ajudou bastante, porque o foco passou a ser em ler apenas o que era exibido no Toast.

 

Como usar o Node tree debugging

Após ativar o Node Tree Debugging e configurar o Gesture desejado é possível ver no logcat as informações sobre a view que recebeu o gesture. É ideal que você use um filtro no logcat, como o valor “TalkBack”, por exemplo.

No exemplo de captura abaixo há informações do botão ‘Hello’ (id=material_button_hello). O logcat não exibe essas informações de forma muito legível, mas é possível (com um pouco de paciência) extrair as informações:

perform action=64=ACTION_ACCESSIBILITY_FOCUS with args=null on node=android.support.v4.view.accessibility.AccessibilityNodeInfoCompat@7477;
boundsInParent: Rect(0, 0–231, 126);
boundsInScreen: Rect(425, 939–656, 1065);
packageName: me.tmonteiro.talkback;
className: android.widget.Button;
text: HELLO;
contentDescription: hello, click here;

viewId: me.tmonteiro.talkback:id/material_button_hello; 
checkable: false;
checked: false;
focusable: true;
focused: true;
selected: false;
clickable: true;
longClickable: false;
enabled: true;
password: false;
scrollable: false;
[ACTION_CLEAR_FOCUS, ACTION_SELECT, ACTION_CLEAR_SELECTION, ACTION_CLICK, ACTION_CLEAR_ACCESSIBILITY_FOCUS, ACTION_NEXT_AT_MOVEMENT_GRANULARITY, ACTION_PREVIOUS_AT_MOVEMENT_GRANULARITY, ACTION_SET_SELECTION] for event=type:EVENT_TYPE_ACCESSIBILITY subtype:TYPE_VIEW_HOVER_ENTER time:9382403

 

Com isso, temos informações da view que são bastante relevantes para análise:

– Valor do ‘contentDescription’;
– Valor do ‘text’;
– Valor do ‘id’;
– Indicador ‘focused’ marcando se pode ou não receber foco;
– Indicador ‘clickable’ marcando se pode ou não ser ser clicado;
– Ação recebida: [ACTION_ACCESSIBILITY_FOCUS];
– Ações suportadas: [ACTION_CLEAR_FOCUS, ACTION_CLICK, ACTION_CLEAR_ACCESSIBILITY_FOCUS, etc].

 

Para as capturas, eu usei o seguinte layout:

Quer saber mais? Aqui tem um link com as referências que usei para o post. Tem alguma dúvida ou observação? Aproveite os campos abaixo! Até a próxima!