Listen

In ChatGPT öffnen

Info

Dieser Abschnitt beschreibt gemeinsame Funktionen aller Listenkomponenten und ist keine Klasse, die instanziiert oder direkt verwendet werden kann.

Es stehen drei Typen von Listen zur Verwendung in Ihren Apps zur Verfügung: ListBox, ChoiceBox und ComboBox. Diese Komponenten zeigen alle eine Liste von Schlüssel-Wert-Elementen an und bieten Methoden zum Hinzufügen, Entfernen, Auswählen und Verwalten der Elemente innerhalb der Liste.

Diese Seite beschreibt die gemeinsamen Merkmale und das Verhalten aller Listenkomponenten, während spezifische Details für jede auf ihren jeweiligen Seiten behandelt werden.

Verwendung von ListItem

Listenkomponenten bestehen aus ListItem-Objekten, die individuelle Elemente innerhalb einer Liste darstellen. Jedes ListItem ist mit einem einzigartigen Schlüssel und einem Anzeige-Text verknüpft. Wichtige Merkmale der ListItem-Klasse umfassen:

• Ein ListItem kapselt einen einzigartigen Schlüssel Object und einen Text String, der innerhalb der Listenkomponente angezeigt wird.
• Sie können ein ListItem erstellen, indem Sie einen Schlüssel und einen Text angeben oder nur den Text angeben, der auch als Schlüssel verwendet wird.

Schlüssel müssen innerhalb einer Liste einzigartig sein. Das Hinzufügen eines zweiten, nur textbasierten Elements mit demselben Text löst eine IllegalArgumentException aus. Um doppelte Beschriftungen anzuzeigen, geben Sie unterschiedliche Schlüssel für diese Elemente an.

Verwaltung von ListItem-Objekten mit der API

Die verschiedenen Listenkomponenten bieten mehrere Methoden zur Verwaltung der Liste von Elementen und zur Aufrechterhaltung eines konsistenten Zustands zwischen der Liste und dem Client. Durch die Verwendung dieser Methoden können Sie die Elemente innerhalb der Liste effektiv verwalten. Die API ermöglicht es Ihnen, mit der Liste zu interagieren und sie zu manipulieren, um die Anforderungen Ihrer App zu erfüllen.

Hinzufügen von Elementen

• Hinzufügen eines Elements:

  • Um ein ListItem zur Liste hinzuzufügen, können Sie die Methode add(ListItem item) verwenden.
  • Sie können auch ein neues ListItem erstellen, indem Sie den Schlüssel und den Text mit der add(Object key, String text) oder add(String text) Methode angeben.

• Einfügen eines Elements an einem bestimmten Index:

  • Um ein Element an einem bestimmten Index einzufügen, verwenden Sie die insert(int index, ListItem item) Methode.
  • Sie können ein Element mit Schlüssel und Text mit der insert(int index, Object key, String text) oder insert(int index, String text) Methode einfügen.

• Einfügen mehrerer Elemente:

  • Sie können mehrere Elemente an einem angegebenen Index einfügen, indem Sie die insert(int index, List< ListItem > items) Methode verwenden.

Tipp

Um die Leistung zu optimieren, ist es anstelle der Auslösung einer Server-zu-Client-Nachricht bei jedem Aufruf der add()-Methode effizienter, zunächst eine Liste von ListItem-Objekten zu erstellen. Sobald Sie diese Liste haben, können Sie alle auf einmal mit der Methode insert(int index, List<ListItem> items) hinzufügen. Dieser Ansatz reduziert die Kommunikation zwischen Server und Client und verbessert die Gesamteffizienz. Für detaillierte Richtlinien zu diesem und anderen Best Practices in der webforJ-Architektur verweisen Sie auf Client/Server-Interaktion.

Entfernen von Elementen

• Entfernen eines Elements:

  • Um ein Element aus der Liste zu entfernen, verwenden Sie die remove(int index) oder remove(Object key) Methode.

• Entfernen aller Elemente:

  • Sie können alle Elemente aus der Liste mit removeAll() entfernen.

Auswählen von Elementen

Alle Listentypen implementieren das SelectableList-Interface. Dieses Interface ermöglicht mehrere verschiedene Arten, das aktuelle ListItem auszuwählen.

Mit einem bestimmten ListItem

select(ListItem item) nimmt ein ListItem als Parameter zur Auswahl.

ListBox demoList = new ListBox();
ListItem demoItem = new ListItem("demo","Demo Element");
demoList.add(demoItem);
demoList.select(demoItem);

Mit einem bestimmten Schlüssel eines ListItem

selectKey(Object key) nimmt einen Schlüssel zu einem ListItem als Parameter zur Auswahl.

ListBox demoList = new ListBox();
demoList.add("demo","Demo Element");
demoList.selectKey("demo");

Mit einem bestimmten Index eines ListItem

selectIndex(int index) nimmt einen Index zu einem ListItem als Parameter zur Auswahl.

ListBox demoList = new ListBox();
demoList.add("demo","Demo Element");
demoList.selectIndex(0);

Andere Listenoperationen

• Zugriff auf und Aktualisierung von Elementen:

  • Um auf Elemente nach Schlüssel oder Index zuzugreifen, verwenden Sie getByKey(Object key) oder getByIndex(int index).
  • Sie können den Text eines Elements mit der setText(String text) Methode innerhalb der ListItem-Klasse aktualisieren.

• Informationen über die Liste abrufen:

  • Sie können die Größe der Liste mit der size() Methode abrufen.
  • Um zu überprüfen, ob die Liste leer ist, verwenden Sie die isEmpty() Methode.

Über Listen iterieren

Alle Listenkomponenten implementieren das Java Iterable Interface. Verwenden Sie forEach() oder eine for-Schleife, um auf jedes ListItem zuzugreifen oder es zu ändern.

Der folgende Codeausschnitt zeigt zwei einfache Möglichkeiten, durch eine Liste zu iterieren:

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

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

Suchen 26.02

Alle Listenkomponenten haben ein eingebettetes Suchfeld, das die Elemente nach ihrem Text filtert. Das Feld ist standardmäßig ausgeschaltet. Verwenden Sie getSearch(), um auf die Suchkonfiguration zuzugreifen, und verwenden Sie dann setFieldVisible(true), um das Feld oben in der Liste der Komponente anzuzeigen.

ComboBox comboBox = new ComboBox("Obst");
comboBox.insert("Apfel", "Banane", "Kirsche", "Aprikose", "Ananas");

comboBox.getSearch()
  .setFieldVisible(true)
  .setPlaceholder("Obst suchen")
  .setEmptyMessage("Keine Früchte gefunden");

Das Filtern blendet nur die Elemente aus, die nicht übereinstimmen. Die Indizes der Elemente und die aktuelle Auswahl bleiben unberührt, sodass getSelectedIndex() weiterhin auf die gesamte Liste verweist und nicht auf die derzeit sichtbaren Elemente.

Das Suchfeld kann wieder mit setFieldVisible(false) ausgeblendet werden.

Konfigurieren des Feldes

• setPlaceholder() setzt den Platzhaltertext des Suchfelds. Der Standardwert ist Suchen.

• setEmptyMessage() setzt die Nachricht, die angezeigt wird, wenn eine Suche keine Ergebnisse zurückgibt. Der Standardwert ist Keine Daten anzuzeigen.

Jede Einstellung hat einen passenden Getter: isFieldVisible(), getPlaceholder(), getEmptyMessage(), und getTerm().

Filtern aus dem Code heraus

setTerm() setzt den Suchbegriff und filtert die Liste. Es funktioniert unabhängig davon, ob das Feld sichtbar ist oder nicht, sodass eine Liste gefiltert werden kann, ohne dass eine Suchbenutzeroberfläche angezeigt wird.

listBox.getSearch().setTerm("apfel");

getTerm() und das Suchfeld

Eingaben im Suchfeld werden nicht zurück in die Konfiguration geschrieben. getTerm() gibt den letzten Wert zurück, der an setTerm() übergeben wurde, nicht das, was der Benutzer eingegeben hat.

Gemeinsame Listenattribute

Beschriftung

Alle Listenkomponenten können mit einer Beschriftung versehen werden, die einem beschreibenden Text oder Titel zugeordnet ist. Beschriftungen bieten eine kurze Erklärung oder Aufforderung, um den Benutzern zu helfen, den Zweck oder die erwartete Auswahl für diese bestimmte Liste zu verstehen. Neben ihrer Bedeutung für die Benutzerfreundlichkeit spielen Listenbeschriftungen auch eine entscheidende Rolle für die Barrierefreiheit, indem sie Screenreadern und unterstützenden Technologien ermöglichen, genaue Informationen bereitzustellen und die Navigation mit der Tastatur zu erleichtern.

Hilfetext

Jede Listenkomponente kann Hilfetext unter der Liste mithilfe der Methode setHelperText() anzeigen. Dieser Hilfetext bietet zusätzlichen Kontext oder Erklärungen zu den verfügbaren Optionen, um sicherzustellen, dass die Benutzer die notwendigen Informationen haben, um informierte Entscheidungen zu treffen.

Horizontale Ausrichtung

Alle Listenkomponenten implementieren das HasHorizontalAlignment Interface, das Ihnen die Kontrolle darüber gibt, wie Text und Inhalte innerhalb der Komponente ausgerichtet sind.

Verwenden Sie die Methode setHorizontalAlignment() mit dem HasHorizontalAlignment.Alignment-Enum, um die Ausrichtung festzulegen:

• Alignment.LEFT (Standard)
• Alignment.MIDDLE
• Alignment.RIGHT

ListBox listBox = new ListBox();
listBox.setHorizontalAlignment(Alignment.LEFT);

Um die aktuelle Ausrichtung zu erhalten:

Alignment alignment = listBox.getHorizontalAlignment();

Größenanpassung

Alle Listenkomponenten in webforJ implementieren ebenfalls das HasExpanse Interface, das es Ihnen ermöglicht, die Gesamtgröße und das visuelle Gewicht der Komponente anzupassen. Dies ist nützlich, um die Komponente an verschiedene UI-Kontexte wie Formulare, Dialoge, Seitenleisten usw. anzupassen.

Verwenden Sie die Methode setExpanse(), um das Ausmaß festzulegen. Optionen umfassen:

• Expanse.NONE
• Expanse.XSMALL
• Expanse.SMALL
• Expanse.MEDIUM (Standard)
• Expanse.LARGE
• Expanse.XLARGE

ListBox listBox = new ListBox();
listBox.setExpanse(Expanse.LARGE);

Sie können die aktuelle Einstellung mit folgendem Befehl abrufen:

Expanse current = listBox.getExpanse();

Themen

📄️ChoiceBox

Pick a single value from a fixed set with the ChoiceBox dropdown, including dropdown type styling, max row count, and keyboard navigation.

📄️ComboBox

Combine a dropdown list with a text input in the ComboBox to let users select preset items or type custom values with placeholder support.

📄️ListBox

Show a scrollable, always-visible list with the ListBox component, supporting single or multiple selection and keyboard navigation.

Weiterlernen

ArtikelMulti-select in Java UI: ListBox and ChoiceBox with webforJArtikelComboBox in Java: preset items and custom values