Vistas de lista

Com um modo de exibição de lista, os usuários podem exibir e interagir com uma coleção de objetos de dados, usando uma seleção única ou múltipla.

Uma exibição de lista típica.

As vistas de lista têm mais flexibilidade e funcionalidade do que as caixas de listagem. Ao contrário das caixas de listagem, elas suportam a alteração de modos de exibição, agrupamento, várias colunas com títulos, classificação por colunas, alteração da largura e da ordem das colunas, ser uma fonte de arrastar ou um destino de soltar e copiar dados de e para a área de transferência.

Será este o controlo correto?

Uma vista de lista é mais do que apenas uma caixa de listagem mais flexível e funcional: a sua funcionalidade extra resulta numa utilização diferente. A tabela a seguir mostra a comparação.

Para decidir se esse é o controle correto, considere estas perguntas:

• A lista apresenta dados, em vez de opções de programa? Caso contrário, considere usar uma caixa de listagem.
• Os usuários precisam alterar modos de exibição, agrupar, classificar por colunas ou alterar a largura e a ordem das colunas? Caso contrário, use uma caixa de listagem.
• O controle precisa ser uma fonte de arrasto ou um destino de soltar? Em caso afirmativo, utilize uma vista de lista.
• Os itens da lista precisam ser copiados ou colados da área de transferência? Em caso afirmativo, utilize uma vista de lista.

Vistas da lista da caixa de verificação

• O controle é usado para escolher zero ou mais itens de uma lista de dados? Para escolher um item, use uma única seleção.
• A seleção múltipla é essencial para a tarefa ou comumente usada? Em caso afirmativo, use uma exibição de lista de caixa de seleção para tornar a seleção múltipla óbvia, especialmente se os usuários-alvo não forem avançados. Caso contrário, use um modo de exibição de lista de seleção múltipla padrão se as caixas de seleção chamarem muita atenção para a seleção múltipla ou resultarem em muita confusão na tela.
• A estabilidade da seleção múltipla é importante? Em caso afirmativo, use uma lista de caixas de seleção , construtor de listas ou adicionar/remover lista porque clicar altera apenas um único item de cada vez. Com uma lista de seleção múltipla padrão, é muito fácil limpar todas as seleções, mesmo por acidente.

Padrões de utilização

Todas as visualizações suportam seleção única, onde os usuários podem selecionar apenas um item de cada vez, e seleção múltipla, onde os usuários podem selecionar qualquer número de itens, incluindo nenhum. As exibições de lista suportam modo de seleção estendido, onde a seleção pode ser estendida arrastando ou com Shift+clique ou Ctrl+clique para selecionar grupos de valores contíguos ou não adjacentes, respectivamente. Ao contrário das caixas de listagem, elas não suportam modo de seleção múltipla, onde clicar em qualquer item alterna seu estado de seleção, independentemente das teclas Shift e Ctrl.

Visualização de lista padrão

O controle de exibição de lista oferece suporte a cinco modos de exibição padrão:

Utilização	Exemplo
Tile Cada item aparece como um ícone médio, com um rótulo e detalhes opcionais à direita.	A vista de mosaico mostra ícones médios com etiquetas e detalhes opcionais à direita.
Ícone grande Cada item aparece como um ícone extra grande, grande ou médio com um rótulo abaixo dele.	O modo de exibição Ícone grande mostra cada item como um ícone grande com um rótulo abaixo dele.
Ícone pequeno Cada item aparece como um pequeno ícone com um rótulo à direita.	O modo de exibição Ícone pequeno mostra cada item como um pequeno ícone com seu rótulo à direita.
Lista Cada item aparece como um pequeno ícone com um rótulo à direita.	No modo de lista, esse modo de exibição ordena os itens em colunas e usa uma barra de rolagem horizontal. Por outro lado, os modos de exibição de ícone ordenam os itens em linhas e usam uma barra de rolagem vertical. O modo de lista mostra cada item como um pequeno ícone com seu rótulo à direita.
Detalhes Cada item aparece como uma linha em um formato tabular. A coluna mais à esquerda contém o ícone e o rótulo opcionais do item, e as colunas subsequentes contêm informações adicionais, como propriedades do item.	Além disso, as colunas podem ser adicionadas ou removidas, reordenadas e redimensionadas. As linhas podem ser agrupadas, ordenadas por coluna. O modo de exibição Detalhes mostra cada item como uma linha em um formato de tabela.

Variações da vista de lista

Rótulo	Valor
Seletor de colunas As exibições de lista às vezes têm tantas colunas que não é prático mostrá-las todas. Nesse caso, a melhor abordagem é exibir as colunas mais úteis por padrão e permitir que os usuários adicionem ou removam colunas conforme necessário.	Clicar com o botão direito do mouse no título da coluna exibe um menu de contexto que permite aos usuários adicionar ou remover colunas. Clicar em Mais no menu de contexto do cabeçalho da coluna exibe a caixa de diálogo Escolher Colunas, que permite aos usuários adicionar ou remover colunas, bem como reordená-las.
Exibição de lista de caixas de seleção Permitir que os usuários selecionem vários itens.	Os modos de exibição de lista de seleção múltipla têm exatamente a mesma aparência que os modos de exibição de lista de seleção única, portanto, não há nenhuma pista visual de que eles suportam seleção múltipla. Uma exibição de lista de caixa de seleção pode ser usada para indicar claramente que a seleção múltipla é possível. Consequentemente, este padrão deve ser usado para tarefas em que a seleção múltipla é essencial ou comumente usada. Neste exemplo, um modo de exibição Ícone Pequeno usa caixas de seleção porque a seleção múltipla é essencial para a tarefa.
Vistas de lista com grupos Organize os dados em grupos.	Embora os modos de exibição Detalhes geralmente ofereçam suporte à classificação dos dados por qualquer uma das colunas, os modos de exibição de lista permitem ainda que os usuários organizem os itens em grupos. Alguns benefícios do agrupamento são: O Groups funciona em todas as visualizações (exceto na lista), portanto, por exemplo, os usuários podem agrupar uma visualização de ícones extra grande de álbuns por artista. Os grupos podem ser coleções de alto nível, que geralmente são mais significativas do que agrupar diretamente dos dados. Por exemplo, os grupos do Windows Explorer datam de Hoje, Ontem, Semana passada, Início deste ano e Há muito tempo. Neste exemplo, o Centro de Boas-vindas do Windows mostra itens agrupados em um modo de exibição de lista.

Orientações

Apresentação

• Classifique os itens da lista em uma ordem lógica. Classifique nomes em ordem alfabética, números em ordem numérica e datas em ordem cronológica.

• Se apropriado, permita que os usuários alterem a ordem de classificação. A classificação do usuário é importante se a lista tiver muitos itens ou se houver cenários em que os itens são encontrados de forma mais eficaz usando uma ordem de classificação diferente do padrão.

• Use o atributo Sempre Mostrar Seleção para que os usuários possam determinar prontamente o item selecionado, mesmo quando o controle não tiver foco.

• Evite apresentar vistas de lista vazias. Se os usuários criarem uma lista, inicialize a lista com instruções ou itens de exemplo que os usuários possam precisar.

  

  Neste exemplo, o modo de exibição Lista de pesquisa apresenta inicialmente instruções.

• Se os usuários puderem alterar modos de exibição, agrupar, classificar por colunas ou alterar colunas e suas larguras e ordem, faça com que essas configurações persistam para que entrem em vigor na próxima vez que a exibição de lista for exibida. Faça com que eles persistam em uma exibição por lista, por usuário.

Interação

• Use um único clique para selecionar o item de lista para o qual o usuário está apontando. Exceção: Para o padrão de lista de links de comando, um clique seleciona o item e fecha a janela ou navega para a próxima página.

• Considere fornecer o comportamento de clique duplo. Clicar duas vezes deve ter o mesmo efeito que selecionar um item e executar seu comando padrão.

• Torne redundante o comportamento de clique duplo. Deve haver sempre um botão de comando ou um comando de menu de contexto que tenha o mesmo efeito.

• Se um item de lista exigir mais explicações, forneça a explicação em uma dica de informações. Use frases completas e pontuação final.

  

  Neste exemplo, uma dica de informação é usada para fornecer mais informações.

• Forneça menus de contexto de comandos relevantes. Esses comandos incluem Recortar, Copiar, Colar, Remover ou Excluir, Renomear e Propriedades.

• Se os usuários puderem alterar a ordem de classificação e o agrupamento, forneça os menus de contexto Classificar por e Agrupar por. O primeiro clique no nome de uma coluna classifica ou agrupa a lista na ordem crescente dessa coluna, o segundo clique classifica ou agrupa em ordem decrescente. Use a ordem anterior (de outra coluna) como a chave secundária.

  

  Neste exemplo, o menu de contexto Classificar por altera a ordem de classificação. Clicar em Nome uma vez classifica por nome em ordem crescente. Clicar em Nome novamente classifica por nome em ordem decrescente.

• Torne o cabeçalho da coluna de exibição de lista acessível usando o teclado.

  • Desenvolvedores: Você pode fazer isso definindo o foco no controle de cabeçalho de coluna. Esse recurso é novo no Windows Vista.

• Ao desativar uma vista de lista, desative também quaisquer etiquetas e botões de comando associados.

• Evite a rolagem horizontal. O modo Lista usa rolagem horizontal. Este modo é geralmente o mais compacto, mas a rolagem horizontal é geralmente mais difícil de usar do que a rolagem vertical. Em vez disso, considere usar o modo de exibição Ícone pequeno se a compacidade não for importante. No entanto, o modo Lista é uma boa escolha quando há muitos itens classificados alfabeticamente e espaço de tela suficiente para um controle amplo.

  Aceitável:

  de controle de modo de lista ampla

  Neste exemplo, o modo Lista é usado porque há muitos itens e muito espaço disponível na tela para um controle amplo.

Listas de seleção múltipla

• Considere exibir o número de itens selecionados abaixo da lista, especialmente se os usuários provavelmente selecionarem vários itens. Estas informações não só fornecem feedback útil, mas também indicam claramente que a vista de lista suporta a seleção múltipla.

  

  Neste exemplo, o número de itens selecionados é exibido abaixo da lista.

• Como alternativa, em vez do número de itens selecionados, você pode fornecer outras métricas de seleção que podem ser mais significativas, como os recursos necessários para as seleções.

  

  Neste exemplo, o espaço em disco necessário para instalar os componentes é mais significativo do que o número de componentes selecionados.

• Para exibições de lista de caixas de seleção, se houver potencialmente muitos itens e selecionar ou limpar todos eles for provável, adicione Selecionar todos e Limpar todos os botões de comando.

• Use caixas de seleção de estado misto para indicar a seleção parcial dos itens em um contêiner. O estado misto não é usado como um terceiro estado para um item individual.

Alterar vistas

Se os utilizadores puderem alterar as vistas:

• Escolha a vista mais conveniente por predefinição. Quaisquer alterações feitas pelos usuários devem ser persistentes por exibição de lista, por usuário.

• Altere a vista utilizando um botão de divisão, um botão de menu ou uma lista pendente. Sempre que possível, use um botão de divisão na barra de ferramentas e altere o rótulo do botão para refletir a exibição atual.

  

  Neste exemplo, um botão de divisão na barra de ferramentas é usado para alterar modos de exibição.

• Forneça um menu de contexto Exibir.

  

Neste exemplo, um menu de contexto Exibir é usado para alterar modos de exibição.

Vistas de detalhes

• Considere o uso do modo de exibição de blocos para melhorar a legibilidade.

  Aceitável:

  

  Neste exemplo, há muitos dados e a janela, a lista e as colunas são muito pequenas, tornando os itens da lista difíceis de ler.

  Melhor:

  

  Neste exemplo, o modo de exibição Bloco exibe os dados sem truncamento.

• Escolha as larguras de coluna padrão apropriadas para os dados mais longos. As vistas de lista truncam automaticamente dados longos com reticências, pelo que as larguras das colunas são apropriadas se forem apresentadas poucas reticências por predefinição. Embora os usuários possam redimensionar colunas, prefira outras soluções:

  • Dimensione cada largura de coluna para ajustar seus dados.
  • Dimensione a largura do controle para ajustar suas colunas, além de quaisquer barras de rolagem prováveis.
  • Se necessário, use a rolagem horizontal.
  • Ter dados truncados apenas para itens de tamanho ímpar ou como último recurso.

  Se os dados de tamanho normal tiverem de ser truncados por predefinição, torne a vista de janela e de lista redimensionável. Inclua 30% adicionais (até 200% para texto mais curto) para qualquer texto (mas não números) que será localizado.

  Incorreto:

  

  Neste exemplo, a maioria dos dados é truncada. As muitas reticências indicam claramente que as larguras de controle e coluna são muito pequenas para os dados.

  Incorreto:

  

  Neste exemplo, os dados são truncados sem motivo.

• Escolha uma ordem de coluna padrão apropriada. Geralmente, ordene as colunas da seguinte forma:

  • Primeiro, o nome do item ou dados de identificação.
  • Em seguida, outros dados úteis para diferenciar os itens da lista.
  • Em seguida, os dados mais úteis (de preferência de comprimento curto ou fixo).
  • Em seguida, dados menos úteis (de preferência de comprimento curto ou fixo).
  • Dados últimos, longos e de comprimento variável.

  Dados longos e de comprimento variável são colocados nas últimas colunas para reduzir a necessidade de rolagem horizontal. Dentro dessas categorias, coloque as informações relacionadas juntas em uma sequência lógica.

• Quando apropriado, permita que os usuários adicionem e removam colunas, bem como alterem a ordem. Exiba as colunas mais úteis por padrão. Isso é conseguido com o atributo Header Drag Drop.

• Escolha um alinhamento apropriado para os dados. Use as seguintes regras:

  • Alinhe números, moedas e horários à direita.
  • Texto alinhado à esquerda, IDs (mesmo que numéricos) e datas.

• Para cabeçalhos de coluna classificáveis, o primeiro clique em um título classifica a lista em ordem crescente para a coluna, o segundo clique classifica em ordem decrescente. Use a ordem de classificação anterior (de outra coluna) como a chave de classificação secundária.

  

  Neste exemplo, a coluna Nome foi clicada primeiro e, em seguida, a coluna Tipo. Como resultado, Tipo em ordem crescente é a chave de classificação primária e Nome em ordem crescente é o secundário.

• Use o atributo Seleção de linha completa para que os usuários possam determinar prontamente os itens selecionados em todas as colunas.

• Não use um cabeçalho de coluna classificável a menos que os dados possam ser classificados.

• Não use um cabeçalho de coluna se houver apenas uma coluna e não houver necessidade de reverter a classificação. Em vez disso, use um rótulo para identificar os dados.

  Incorreto:

  

  Correto:

  de controle

  No exemplo correto, um rótulo é usado em vez de um cabeçalho de coluna.

Dimensionamento e espaçamento recomendados

Dimensionamento e espaçamento recomendados para exibições de lista.

• Escolha uma altura de exibição de lista que exiba um número integral de itens. Evite truncar itens verticalmente.
• Escolha um tamanho de vista de lista que elimine a deslocação vertical e horizontal desnecessária em todas as vistas suportadas. Os modos de exibição de lista devem exibir entre 3 e 20 itens. Considere tornar uma exibição de lista um pouco maior se isso eliminar uma barra de rolagem. Listas com potencialmente muitos itens devem exibir pelo menos cinco itens para facilitar a rolagem, mostrando mais itens de cada vez e tornando a barra de rolagem mais fácil de posicionar.
• Se os usuários se beneficiarem de tornar o modo de exibição de lista maior, torne o modo de exibição de lista e sua janela pai redimensionáveis. Isso permite que os usuários ajustem o tamanho da exibição de lista conforme necessário. No entanto, as exibições de lista redimensionáveis devem exibir pelo menos três itens.

Rótulos

Etiquetas de controlo

• Todas as vistas de lista precisam de etiquetas. Escreva o rótulo como uma palavra ou frase, não como uma frase, terminando com dois pontos usando texto estático.

• Atribua um de chave de acesso exclusivo para cada rótulo. Para obter diretrizes, consulte Keyboard.

• Use de maiúsculas no estilo de frase.

• Posicione o rótulo acima do controle e alinhe-o com a borda esquerda do controle.

• Para exibições de lista de seleção múltipla, escreva o rótulo que indica claramente que a seleção múltipla é possível. Os rótulos de exibição de lista de caixa de seleção podem ser menos explícitos.

  Correto:

  

  Neste exemplo, o rótulo indica claramente que a seleção múltipla é possível.

  Incorreto:

  

  Neste exemplo, o rótulo não fornece informações sobre seleção múltipla.

  Aceitável:

  de complementos

  Neste exemplo, as caixas de seleção indicam claramente que a seleção múltipla é possível, portanto, o rótulo não precisa ser explícito.

• Você pode especificar unidades (segundos, conexões e assim por diante) entre parênteses após o rótulo.

Rótulos de título

• Mantenha os rótulos de título breves (três palavras ou menos).
• Use um único substantivo ou frase nominal sem pontuação final.
• Use de maiúsculas no estilo de frase.
• Alinhe o título da mesma forma que os dados.

Agrupar rótulos

• Use os seguintes rótulos de grupo para coleções de alto nível:
  • Nomes: use a primeira letra do nome ou intervalos de letras.
  • Tamanhos: Não especificado, 0 KB, 0-10 KB, 10-100 KB, 100 KB - 1 MB, 1-16 MB, 16-128 MB
  • Datas: Hoje, Ontem, Semana passada, Início deste ano e Há muito tempo.
• Caso contrário, os rótulos de grupo usam o texto exato dos dados que estão sendo agrupados, incluindo maiúsculas e pontuação.

Texto dos dados

• Use de maiúsculas no estilo de frase.

Texto instrucional

• Se você precisar adicionar texto instrutivo sobre um modo de exibição de lista, adicione-o acima do rótulo. Use frases completas com pontuação final.
• Use de maiúsculas no estilo de frase.
• As informações adicionais que são úteis, mas não necessárias, devem ser mantidas curtas. Coloque esta informação entre parênteses entre o rótulo e os dois pontos ou sem parênteses abaixo do controlo.

Documentação

Ao se referir a modos de exibição de lista:

• Use o texto exato do rótulo, incluindo sua maiúscula, mas não inclua o sublinhado da chave de acesso ou dois pontos, e inclua a lista de palavras. Não se refira a uma caixa de listagem como uma caixa de listagem, modo de exibição de lista ou campo.
• Para dados de lista, use o texto exato dos dados, incluindo suas maiúsculas.
• Consulte os modos de exibição de lista como modos de exibição de lista somente em programação e outra documentação técnica. Em todos os outros lugares use a lista.
• Para descrever a interação do usuário, use selecionar para os dados e clique nos títulos.
• Sempre que possível, formate as opções de rótulo e lista usando texto em negrito. Caso contrário, coloque o rótulo e as opções entre aspas apenas se necessário para evitar confusões.

Exemplo: Na lista Programas e serviços, selecione Compartilhamento de arquivos e impressoras .

Ao fazer referência a caixas de seleção em um modo de exibição de lista:

• Use o texto exato do rótulo, incluindo sua maiúscula, e inclua a caixa de seleção da palavra. Não inclua o sublinhado da chave de acesso.
• Para descrever a interação do usuário, use selecionar e limpar.
• Sempre que possível, formate o rótulo usando texto em negrito. Caso contrário, coloque o rótulo entre aspas apenas se necessário para evitar confusão.

Exemplo: Marque a caixa de seleção Sublinhado.