Lists

Abrir en ChatGPT

info

Esta sección describe características comunes de todos los componentes de lista, y no es una clase que se pueda instanciar o usar directamente.

Hay tres tipos de listas disponibles para su uso dentro de tus aplicaciones: ListBox, ChoiceBox y ComboBox. Estos componentes muestran una lista de elementos clave-valor, y proporcionan métodos para agregar, eliminar, seleccionar y gestionar los elementos dentro de la lista.

Esta página describe las características y el comportamiento compartidos de todos los componentes de lista, mientras que los detalles específicos para cada uno se cubren en sus respectivas páginas.

Usando ListItem

Los componentes de lista están compuestos por ListItem objetos, que representan elementos individuales dentro de una lista. Cada ListItem está asociado con una clave única y un texto para mostrar. Las características importantes de la clase ListItem incluyen:

• Un ListItem encapsula una clave única Object y un texto String que se muestra dentro del componente de lista.
• Puedes construir un ListItem proporcionando una clave y un texto, o especificando solo el texto para que se genere una clave aleatoria.

Gestionando objetos ListItem con la API

Los diversos componentes de lista ofrecen varios métodos para gestionar la lista de elementos y mantener un estado consistente entre la lista y el cliente. Al usar estos métodos, puedes gestionar efectivamente los elementos dentro de la lista. La API te permite interactuar y manipular la lista para satisfacer los requisitos de tu aplicación.

Agregar elementos

• Agregar un elemento:

  • Para agregar un ListItem a la lista, puedes usar el add(ListItem item) método.
  • También puedes agregar un nuevo ListItem especificando la clave y el texto usando el add(Object key, String text) o add(String text) método.

• Insertar un elemento en un índice específico:

  • Para insertar un elemento en un índice específico, usa el insert(int index, ListItem item) método.
  • Puedes insertar un elemento con clave y texto usando el insert(int index, Object key, String text) o insert(int index, String text) método.

• Insertar múltiples elementos:

  • Puedes insertar múltiples elementos en un índice especificado usando el insert(int index, List< ListItem > items) método.

sugerencia

Para optimizar el rendimiento, en lugar de activar un mensaje de servidor a cliente cada vez que usas el método add(), es más eficiente crear primero una lista de ListItem objetos. Una vez que tengas esta lista, puedes agregarlos todos de una vez usando el método insert(int index, List<ListItem> items). Este enfoque reduce la comunicación entre el servidor y el cliente, mejorando la eficiencia general. Para pautas detalladas sobre esto y otras mejores prácticas en la arquitectura webforJ, consulta Interacción Cliente/Servidor.

Eliminando elementos

• Eliminar un elemento:

  • Para eliminar un elemento de la lista, usa el remove(int index) o remove(Object key) método.

• Eliminar todos los elementos:

  • Puedes eliminar todos los elementos de la lista usando removeAll().

Seleccionando elementos

Todos los tipos de lista implementan la interfaz SelectableList. Esta interfaz permite múltiples formas diferentes de seleccionar el ListItem actual.

Con un ListItem dado

select(ListItem item) toma un ListItem como parámetro para seleccionar.

List demoList = new List();
ListItem demoItem = new ListItem("demo","Elemento de Demostración");
demoList.add(demoItem);
demoList.select(demoItem);

Con una clave dada de un ListItem

selectKey(Object key) toma una clave de un ListItem como parámetro para seleccionar.

List demoList = new List();
demoList.add("demo","Elemento de Demostración");
demoList.selectKey("demo");

Con un índice dado de un ListItem

selectIndex(int index) toma un índice de un ListItem como parámetro para seleccionar.

List demoList = new List();
demoList.add("demo","Elemento de Demostración");
demoList.selectKey(0);

Otras operaciones de lista

• Accediendo y actualizando elementos:

  • Para acceder a elementos por clave o índice, usa getByKey(Object key) o getByIndex(int index).
  • Puedes actualizar el texto de un elemento usando el setText(String text) método dentro de la clase ListItem.

• Recuperando información sobre la lista:

  • Puedes obtener el tamaño de la lista usando el size() método.
  • Para verificar si la lista está vacía, usa el isEmpty() método.

Iterando sobre listas

Todos los componentes de lista implementan la interfaz Java Iteratable, proporcionando una manera eficiente e intuitiva de iterar a través de los contenidos de una lista. Con esta interfaz, puedes recorrer fácilmente cada ListItem, lo que hace simple acceder, modificar o realizar acciones en cada elemento con un esfuerzo mínimo. La interfaz Iterable es un patrón estándar del lenguaje Java, asegurando que tu código sea familiar y mantenible para cualquier desarrollador de Java.

El siguiente fragmento de código demuestra dos formas sencillas de iterar a través de una lista:

list.forEach(item -> {
   item.setText("Modificado: " + item.getText());
});

for (ListItem item : list) {
   item.setText("Modificado2: " + item.getText());
}

Propiedades compartidas de lista

Etiqueta

Todos los componentes de lista pueden recibir una etiqueta, que es un texto descriptivo o título asociado con el componente. Las etiquetas proporcionan una breve explicación o indicación para ayudar a los usuarios a entender el propósito o la selección esperada para esa lista en particular. Además de su importancia para la usabilidad, las etiquetas de lista también juegan un papel crucial en la accesibilidad, permitiendo que los lectores de pantalla y las tecnologías asistidas proporcionen información precisa y faciliten la navegación por teclado.

Texto de ayuda

Cada componente de lista puede mostrar texto de ayuda debajo de la lista usando el método setHelperText(). Este texto de ayuda ofrece contexto adicional o explicaciones sobre las opciones disponibles, asegurando que los usuarios tengan la información necesaria para hacer selecciones informadas.

Alineación horizontal

Todos los componentes de lista implementan la interfaz HasHorizontalAlignment, dándote control sobre cómo se alinean el texto y el contenido dentro del componente.

Usa el método setHorizontalAlignment() para establecer la alineación:

• HorizontalAlignment.LEFT (por defecto)
• HorizontalAlignment.MIDDLE
• HorizontalAlignment.RIGHT

ListBox<String> listBox = new ListBox<>();
listBox.setHorizontalAlignment(HorizontalAlignment.LEFT);

Para obtener la alineación actual:

HorizontalAlignment alignment = listBox.getHorizontalAlignment();

Expansiones

Todos los componentes de lista en webforJ también implementan la interfaz HasExpanse, permitiéndote ajustar el tamaño general y el peso visual del componente. Esto es útil para adaptar el componente a varios contextos de UI, como formularios, diálogos, barras laterales, etc.

Usa el método setExpanse() para establecer el nivel de expansión. Las opciones incluyen:

• Expanse.NONE
• Expanse.XSMALL
• Expanse.SMALL
• Expanse.MEDIUM (por defecto)
• Expanse.LARGE
• Expanse.XLARGE

ListBox<String> listBox = new ListBox<>();
listBox.setExpanse(Expanse.LARGE);

Puedes recuperar la configuración actual usando:

Expanse current = listBox.getExpanse();

Temas

📄️ ChoiceBox

El componente ChoiceBox es un elemento de interfaz de usuario diseñado para presentar a los usuarios una lista de opciones o elecciones. Los usuarios pueden seleccionar una sola opción de esta lista, normalmente haciendo clic en el ChoiceBox, lo que activa la visualización de una lista desplegable que contiene las opciones disponibles. Los usuarios también pueden interactuar con el ChoiceBox utilizando las teclas de flecha. Cuando un usuario realiza una selección, la opción elegida se muestra en el botón del ChoiceBox.

📄️ ComboBox

El componente ComboBox es un elemento de interfaz de usuario diseñado para presentar a los usuarios una lista de opciones o elecciones, así como un campo para ingresar sus propios valores personalizados. Los usuarios pueden seleccionar una única opción de esta lista, normalmente haciendo clic en el ComboBox, lo que desencadena la visualización de una lista desplegable que contiene las opciones disponibles, o escribir un valor personalizado. Los usuarios también pueden interactuar con el ComboBox usando las teclas de flecha. Cuando un usuario hace una selección, la opción elegida se muestra en el ComboBox.

📄️ ListBox

El componente ListBox es un elemento de interfaz de usuario diseñado para mostrar una lista desplazable de objetos y permite a los usuarios seleccionar uno o varios elementos de la lista. Los usuarios también pueden interactuar con el ListBox utilizando las teclas de flecha.