<?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="es">

  <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>Daniel Mustieles</mal:name>
      <mal:email>daniel.mustieles@gmail.com</mal:email>
      <mal:years>2011 - 2016</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Alex Puchades</mal:name>
      <mal:email>alex94puchades@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Nicolás Satragno</mal:name>
      <mal:email>nsatragno@gnome.org</mal:email>
      <mal:years>2013</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Benjamín Valero Espinosa</mal:name>
      <mal:email>benjavalero@gmail.com</mal:email>
      <mal:years>2011</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Jorge González</mal:name>
      <mal:email>jorgegonz@svn.gnome.org</mal:email>
      <mal:years>2009</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Rosa Elena Pérez</mal:name>
      <mal:email>rozydicemiau@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>Oscar Rafael Arachi</mal:name>
      <mal:email>arachi910@gmail.com</mal:email>
      <mal:years>2014 - 2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Miguel Ajuech</mal:name>
      <mal:email>miguel.ann.28@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>Adrián Pérez Domínguez</mal:name>
      <mal:email>adrian@aztli.org</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Celina Osorio Ochoa</mal:name>
      <mal:email>chelinoska@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Dario Amigon Espinoza</mal:name>
      <mal:email>daramigon@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Yenisei Ramírez Pérez</mal:name>
      <mal:email>yeniseirape@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>José Roberto Ramíres Mendoza</mal:name>
      <mal:email>aczella@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Bernardo Sánchez Romero</mal:name>
      <mal:email>b.sanchez.rom@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Emmanuel Márquez Juárez</mal:name>
      <mal:email>resident3333@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>David Romero Serrano</mal:name>
      <mal:email>lemi136@hotmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Omar Garcia Guzman</mal:name>
      <mal:email>garciag.omar91@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  
    <mal:credit xmlns:mal="http://projectmallard.org/1.0/" type="translator copyright">
      <mal:name>Edilberto Huerta Niño</mal:name>
      <mal:email>edilberto.huerta0290@gmail.com</mal:email>
      <mal:years>2015</mal:years>
    </mal:credit>
  </info>

<title>Listas desplegables</title>

<p>Una lista desplegable es un elemento de la interfaz de usuario que le permite seleccionar de una lista opciones mutuamente excluyentes. Aparece como un botón que, cuando se pulsa, muestra una lista.</p>

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

<p>Los botones de radio o una lista a menudo ofrecen una lista despegable preferible, ya que presentan todas las opciones disponibles de una vez, sin más interacciones. También una lista desplegable puede ser la mejor opción cuando:</p>

<list>
<item><p>El número de opciones es grande.</p></item>
<item><p>Hay poco espacio disponible.</p></item>
<item><p>La lista de opciones puede cambiar en el tiempo.</p></item>
<item><p>El contenido de la parte oculta del menú es obvia a partir su etiqueta y del elemento seleccionado. Por ejemplo, si tiene una opción de menú etiquetada como «Mes:» con el elemento «Enero» seleccionado, el usuario puede pensar razonablemente que el menú contiene los 12 meses del año sin tener que comprobarlo.</p></item>
</list>

<section id="general-guidelines">
<title>Guías Generales</title>

<list>
<item><p>Aunque GTK+ proporciona un qidget de caja combinada específico, se recomienda que las listas desplegables se construyan usando una combinación de un botón y una ventana emergente. Esto permite un desplazamiento más cómodo en listas largas y permite integrar búsquedas en la lista. Usar este enfoque también permite mostrar siempre el elemento seleccionado.</p></item>
<item><p>Si el número de elementos es muy grande, ofrezca una función de búsqueda que filtre la lista.</p></item>
<item><p>Etiquete el botón de la lista desplegable con un texto por encima o a su izquierda, usando <link xref="writing-style#capitalization">mayúsculas</link>. Proporcione una tecla de acceso en la etiqueta que permita al usaurio dar el foco directamente a la lista desplegable.</p></item>
<item><p>Use <link xref="writing-style#capitalization">mayúsculas en las frases</link> para los elementos de las lista desplegables, por ejemplo <gui>Movimiento desplazado</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>Una lista desplegable puede permitir que se añadan valores personalizados a un número de configuración prestablecidas, o se puede usar para introducir y seleccionar desde valores personalizados aislados.</p>

<list>
<item><p>Asegúrese de que los valores personalizados se ordenan de una manera útil para la mayoría de los usuarios. Alfabéticamente o más recientes son las ordenaciones más comunes.</p></item>
<item><p>Cuando una lista desplegable incluya valores prestablecidos y valores personalizados, sepárelos en grupos dentro de la lista.</p></item>
<item><p>Permita que los valores personalizados se eliminen de la lista.</p></item>
<item><p>Valide los valores personalizados a medida que se introducen, con el fin de evitar errores.</p></item>
<item><p>Si el desplegable sólo acepta valores personalizados, y no se han introducido valores previamente, muestre el valor de la entrada personalizada cuando el desplegable se abra, en lugar de mostrar una lista vacía.</p></item>
</list>

</section>

</page>
