Tornando as exibições de lista acessíveis

Applies to Windows and Windows Phone

Um controle do Tempo de Execução do Windows ListView é acessível por padrão. Para HTML, você precisa definir apenas o nome acessível para a lista div de nível superior que representa o controle ListView e mapear as propriedades de acessibilidade para os dados, se necessário. Para XAML, os itens ListViewItem no controle ListView que são criados de um ItemTemplate usam a promoção de valores para os valores associados a dados nesses itens.

Nenhum trabalho adicional é necessário para definir nomes acessíveis para itens da lista. A plataforma automaticamente define os nomes acessíveis reutilizando o texto dos itens da lista.

Veja como os nomes acessíveis para itens de exibição de lista aparecem na ferramenta Inspect:

Como os nomes acessíveis para itens de exibição de lista aparecem na ferramenta Inspect

Este exemplo mostra o HTML que gera o item de lista no exemplo anterior:


<div class="itemtemplate" data-win-control="WinJS.Binding.Template">
    <img class="item-image" src="#" data-win-bind="src: backgroundImage; alt: title" />
    <div class="item-info">
        <h4 class="item-title" data-win-bind="textContent: title"></h4>
        <h6 class="item-subtitle win-type-ellipsis" data-win-bind="textContent: subtitle"></h6>
        <h4 class="item-description" data-win-bind="textContent: description"></h4>
    </div>
</div>

Se quiser substituir os nomes acessíveis dos itens de lista, ou se os itens de lista não tiverem conteúdo de texto, você precisará definir explicitamente os nomes acessíveis para os objetos de item de lista. Para HTML, use as técnicas descritas em Expondo informações básicas sobre elementos da interface do usuário (HTML). Para XAML, você pode usar a propriedade anexada AutomationProperties.Name, usar as técnicas descritas Expondo informações básicas sobre elementos da interface do usuário (XAML) ou talvez usar um par de itens personalizados para os seus itens.

Como alternativa para os itens de lista que não têm conteúdo de texto, você pode adicioná-lo com as mesmas cores de primeiro plano e de plano de fundo em CSS (Folhas de Estilos em Cascata) (para HTML) ou no caso em que um valor de texto Foreground é igual ao Background do contêiner (para XAML), para manter a aparência inicial e ainda ter um elemento de texto na árvore de automação da interface do usuário.

Observação  Ocultar um elemento de texto em CSS ou com o atributo aria-hidden faz com que ele seja removido da árvore de automação da interface do usuário.

Tópicos relacionados

Guia de início rápido: adicionando um ListView (HTML)
Adicionando ListView e GridView (XAML)
Expondo informações básicas sobre elementos da interface do usuário (HTML)
Expondo informações básicas sobre elementos da interface do usuário (XAML)

 

 

Mostrar:
© 2014 Microsoft