Zum Hauptinhalt springen

Listen

In ChatGPT öffnen
Info

Dieser Abschnitt beschreibt die gemeinsamen 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 skizziert die geteilten Merkmale und das Verhalten aller Listenkomponenten, während spezifische Details für jede Komponente in ihren jeweiligen Seiten behandelt werden.

Verwendung von ListItem​

Listenkomponenten bestehen aus ListItem-Objekten, die einzelne Elemente innerhalb einer Liste repräsentieren. Jedes ListItem ist mit einem einzigartigen Schlüssel und einem Anzeigetext verbunden. 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 Text angeben oder indem Sie nur den Text angeben, sodass ein zufälliger Schlüssel generiert wird.

Verwalten von ListItem-Objekten mit der API​

Die verschiedenen Listenkomponenten bieten mehrere Methoden zum Verwalten der Liste von Elementen und zur Beibehaltung 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 diese so zu manipulieren, dass sie den Anforderungen Ihrer App entspricht.

Hinzufügen von Elementen​

Tipp

Um die Leistung zu optimieren, ist es effizienter, eine Liste von ListItem-Objekten zuerst zu erstellen, anstatt bei jedem Aufruf der add()-Methode eine Server-zu-Client-Nachricht auszulösen. Sobald Sie diese Liste haben, können Sie 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 bitte auf Client/Server-Interaktion.

Entfernen von Elementen​

Auswählen von Elementen​

Alle Listentypen implementieren die SelectableList-Schnittstelle. Diese Schnittstelle ermöglicht verschiedene Möglichkeiten zur Auswahl des aktuellen ListItem.

Mit einem gegebenen ListItem​

select(ListItem item) benötigt ein ListItem als Parameter zur Auswahl.

List demoList = new List();
ListItem demoItem = new ListItem("demo","Demo Item");
demoList.add(demoItem);
demoList.select(demoItem);

Mit einem gegebenen Schlüssel eines ListItem​

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

List demoList = new List();
demoList.add("demo","Demo Item");
demoList.selectKey("demo");

Mit einem gegebenen Index eines ListItem​

selectIndex(int index) benötigt einen Index zu einem ListItem als Parameter zur Auswahl.

List demoList = new List();
demoList.add("demo","Demo Item");
demoList.selectKey(0);

Andere Listenoperationen​

  • Zugriff und Aktualisierung von Elementen:

  • Abrufen von Informationen über die Liste:

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

Über Listen iterieren​

Alle Listenkomponenten implementieren die Java Iteratable-Schnittstelle, die einen effizienten und intuitiven Weg bietet, durch den Inhalt einer Liste zu iterieren. Mit dieser Schnittstelle können Sie mühelos durch jedes ListItem schleifen und jedes Element mit minimalem Aufwand zugreifen, ändern oder Aktionen durchführen. Die Iterable-Schnittstelle ist ein standardmäßiges Muster der Programmiersprache Java, das sicherstellt, dass Ihr Code vertraut und wartbar für jeden Java-Entwickler ist.

Der folgende Code zeigt zwei einfache Möglichkeiten, um 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 verfügen über ein eingebettetes Suchfeld, das die Elemente anhand ihres Textes filtert. Das Feld ist standardmäßig deaktiviert. Verwenden Sie getSearch(), um auf die Suchkonfiguration zuzugreifen, und dann setFieldVisible(true), um das Feld oben in der Liste der Komponente anzuzeigen.

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

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

Das Filtern blendet nur die Elemente aus, die nicht übereinstimmen. Die Elementeindizes und die aktuelle Auswahl bleiben unberührt, sodass getSelectedIndex() weiterhin auf die vollständige Liste verweist und nicht auf die aktuell sichtbaren Elemente.

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

Konfigurieren des Feldes​

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

  • setEmptyMessage() legt die Nachricht fest, die angezeigt wird, wenn eine Suche keine Ergebnisse zurückgibt. Der Standardwert ist Keine Daten zum Anzeigen.

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

Filtern aus dem Code heraus​

setTerm() legt den Suchbegriff fest 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 Suchoberfläche angezeigt wird.

listBox.getSearch().setTerm("apfel");
getTerm() und das Suchfeld

Das Tippen in das Suchfeld schreibt den Begriff nicht in die Konfiguration zurück. getTerm() gibt den letzten Wert zurück, der an setTerm() übergeben wurde, und nicht das, was der Benutzer eingegeben hat.

Gemeinsame Listenproperties​

Etikett​

Alle Listenkomponenten können ein Etikett zugewiesen werden, das ein beschreibender Text oder Titel ist, der mit der Komponente verbunden ist. Etiketten 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 Wichtigkeit für die Benutzerfreundlichkeit spielen Listenetiketten auch eine entscheidende Rolle in der Barrierefreiheit, da sie Bildschirmlesegeräten und unterstützenden Technologien ermöglichen, genaue Informationen bereitzustellen und die Tastaturnavigation zu erleichtern.

Hilfetext​

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

Horizontale Ausrichtung​

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

Verwenden Sie die Methode setHorizontalAlignment(), um die Ausrichtung festzulegen:

  • HorizontalAlignment.LEFT (Standard)
  • HorizontalAlignment.MIDDLE
  • HorizontalAlignment.RIGHT
ListBox<String> listBox = new ListBox<>();
listBox.setHorizontalAlignment(HorizontalAlignment.LEFT);

Um die aktuelle Ausrichtung zu erhalten:

HorizontalAlignment alignment = listBox.getHorizontalAlignment();

Expanses​

Alle Listenkomponenten in webforJ implementieren auch die HasExpanse-Schnittstelle, die 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 anzupassen, wie Formulare, Dialoge, Seitenleisten usw.

Verwenden Sie die Methode setExpanse(), um die Expansionsstufe festzulegen. Optionen sind:

  • Expanse.NONE
  • Expanse.XSMALL
  • Expanse.SMALL
  • Expanse.MEDIUM (Standard)
  • Expanse.LARGE
  • Expanse.XLARGE
ListBox<String> listBox = new ListBox<>();
listBox.setExpanse(Expanse.LARGE);

Sie können die aktuelle Einstellung mit folgender Methode abrufen:

Expanse current = listBox.getExpanse();

Themen​