<?xml version="1.0" encoding="utf-8"?>
<page xmlns="http://projectmallard.org/1.0/" xmlns:uix="http://projectmallard.org/experimental/ui/" type="topic" id="drop-down-lists" xml:lang="pt-BR">

  <info>
    <credit type="author">
      <name>Allan Day</name>
      <email>aday@gnome.org</email>
    </credit>

    <link type="guide" xref="ui-elements"/>
    <uix:thumb mime="image/svg" src="figures/ui-elements/drop-down-list.svg"/>

    <include xmlns="http://www.w3.org/2001/XInclude" href="legal.xml"/>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Georges Neto</mal:name>
      <mal:email>georges.stavracas@gmail.com</mal:email>
      <mal:years>2014,</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Rafael Fontenelle</mal:name>
      <mal:email>rafaelff@gnome.org</mal:email>
      <mal:years>2017-2019</mal:years>
    </mal:credit>
  </info>

<title>Listas suspensas</title>

<p>Uma lista suspensa é um elemento de interface do usuário que permite ao usuário selecionar uma lista de opções mutuamente exclusivas. Aparece como um botão que, quando clicado, revela uma lista.</p>

<media type="image" mime="image/svg" src="figures/ui-elements/drop-down-list.svg"/>

<p>Os botões de opção ou uma lista serão muitas vezes preferíveis a uma lista suspensa, pois apresentam todas as opções disponíveis de uma só vez sem qualquer outra interação. Ao mesmo tempo, uma lista suspensa pode ser uma escolha melhor quando:</p>

<list>
<item><p>A quantidade de opções é grande.</p></item>
<item><p>Há pouco espaço disponível.</p></item>
<item><p>A lista de opções podem alterar ao longo do tempo.</p></item>
<item><p>O conteúdo da parte oculta do menu é óbvio a partir do seu rótulo e o item selecionado. Por exemplo, se você tiver um menu de opção denominado “Month:” com o item January” selecionado, o usuário pode razoavelmente inferir que o menu contém os 12 meses do ano sem ter que procurar.</p></item>
</list>

<section id="general-guidelines">
<title>Diretrizes gerais</title>

<list>
<item><p>While GTK does provide a specific combobox widget, it is recommended that drop-down lists are constructed using a combination of a button and a popover. This allows more comfortable scrolling for long lists, and allows search to be integrated into the list. Using this approach also allows the current selected item to always be displayed.</p></item>
<item><p>Se a quantidade de itens for muito grande, forneça uma função de pesquisa que filtre a lista.</p></item>
<item><p>Rotule o botão da lista suspensa com um rótulo de texto acima ou à sua esquerda, usando <link xref="writing-style#capitalization">maiusculização de frase</link>. Forneça uma tecla de acesso no rótulo que permite ao usuário dar foco diretamente à lista suspensa.</p></item>
<item><p>Use <link xref="writing-style#capitalization">maiusculização de frase</link> para itens de lista suspensa, por exemplo <gui>Switched movement</gui>.</p></item>
</list>

</section>

<section id="custom-values">
<title>Valores personalizados</title>

<media type="image" mime="image/svg" src="figures/ui-elements/drop-down-list-custom-values.svg"/>

<p>Uma lista suspensa pode permitir que os valores personalizados sejam adicionados a uma série de predefinições ou pode ser usada para inserir e selecionar apenas valores personalizados.</p>

<list>
<item><p>Certifique-se de que os valores personalizados são ordenados de forma que seja mais útil para os usuários. Ordem alfabética ou de mais recente é comum.</p></item>
<item><p>Quando uma lista suspensa inclui valores predefinidos e personalizados, separe-os em grupos separados dentro da lista.</p></item>
<item><p>Permita que valores personalizados sejam removidos da lista.</p></item>
<item><p>Valide valores personalizados na medida em que eles são inseridos, para evitar erros.</p></item>
<item><p>Se a lista suspensa apenas aceitar valores personalizados e nenhum valor tiver sido inserido anteriormente, apresente a entrada de valor personalizada quando a lisa suspensa for aberta, em vez de exibir uma lista vazia.</p></item>
</list>

</section>

</page>
