JavaFX - Verhalten ComboBox

[mihe7]

Es geht um eine eigentlich ganz simple Sache. Ich habe eine List<Person> und aus der soll der Anwender eine Person aussuchen. Person sieht so aus:

record Person(String name, String firstName) {}

Für solche Zwecke verwende ich normalerweise eine ComboBox. Also mal schnell eingebaut, dann noch einen Converter spendiert und was stelle ich fest? Das Ding verhält sich nicht wie eine ComboBox, bei der man einen Buchstaben (oder eine Folge von Buchstaben) eintippen kann, um mal schnell zu einem Eintrag zu springen. Das Teil reagiert überhaupt nicht (Pfeiltasten etc. funktionieren)

Frage 1: mache ich was falsch?

Das ist aber eigentlich Nebensache, denn ich wollte eine ComboBox mit Autovervollständung. Heißt: der Anwender sieht, was er eintippt und die Auswahlliste wird entsprechend gefiltert.

Frage 2: sehe ich das richtig, dass das standardmäßig nicht vorgesehen ist?

Das will ich gar nicht glauben aber wenn ich mich im Netz umschaue, dann ist das ernsthaft so gedacht, dass ich dafür jetzt seitenweise Code einbauen soll. Dazu hatte ich jetzt keine Lust, also nehme ich die SearchableComboBox von ControlsFX, mit der komme ich der Sache schon etwas näher. Allerdings wird der ausgewählte Wert nicht übernommen und dann wäre da noch die Frage, wie ich die Liste nach meinen Vorstellungen filtern kann. Von Haus aus wird anscheinend mit einem contains gefiltert, ich bräuchte ein startsWith.

Versionen:

        <java.version>21</java.version>
        <javafx.version>23.0.2</javafx.version>
        <controlsfx.version>11.2.2</controlsfx.version>

Wäre schön, wenn jemand die Antworten kurz aus dem Ärmel schütteln könnte, aber bitte keinen Aufwand betreiben.

 

[KonradN]

Also nicht direkt zu Frage1 und Frage2 aber evtl. eine Möglichkeit bezüglich:

dann wäre da noch die Frage, wie ich die Liste nach meinen Vorstellungen filtern kann. Von Haus aus wird anscheinend mit einem contains gefiltert, ich bräuchte ein startsWith.

Ja, die Controls sind alle etwas blöd. Das ist einfach ein gutes Beispiel für schlecht durchdachte Controls. Es wäre doch eigentlich trivial, da etwas wie ein setPredicate einzuführen, das dann eine eigene Filter Routine enthalten kann und das halt per default ein Check auf contains hat beim angezeigten Text. Aber das könnte ja auch viel Komplexer gewünscht sein ...

Aber ok, hier muss man dann vermutlich selbst etwas Hand anlegen. Evtl. wäre etwas in der Art hilfreich (Ungeprüft von ChatGPT ... ist hoffentlich nicht erstunken und erlogen ):

AutoCompletePopup<String> popup = new AutoCompletePopup<>();
popup.getSuggestions().addAll("Apfel", "Ananas", "Banane", "Birne");

popup.setFilter((suggestion, text) ->
    suggestion.toLowerCase().startsWith(text.toLowerCase())
);

TextField editor = new TextField();
popup.setAutoFix(true);
popup.setHideOnEscape(true);
popup.setHideOnClickOutside(true);

editor.textProperty().addListener((obs, oldText, newText) -> {
    if (newText.isEmpty()) {
        popup.hide();
    } else {
        popup.show(editor);
    }
});

Aber da hat man dann nicht die Möglichkeiten, die man sonst so gerne haben möchte beim Verhalten....

Eine andere Idee wäre, bei der ComboBox<T> einfach die Liste der Elemente zu pflegen. Du reagierst also auf Eingaben und entfernst Einträge bzw. fügst diese wieder hinzu ... Das hat ChatGPT mir mal so als Code entwickelt:

// ===== FilterComboBoxExample.java =====
import javafx.application.Application;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Scene;
import javafx.scene.control.ComboBox;
import javafx.scene.control.TextField;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class FilterComboBoxExample extends Application {

    @Override
    public void start(Stage stage) {
        // Master-Liste (alle Elemente)
        ObservableList<String> masterList = FXCollections.observableArrayList(
            "Apfel", "Ananas", "Banane", "Birne", "Avocado", "Orange"
        );

        // ComboBox mit leerer Startliste
        ComboBox<String> comboBox = new ComboBox<>();
        comboBox.setEditable(true);
        comboBox.getItems().setAll(masterList); // Initial alle anzeigen

        TextField editor = comboBox.getEditor();

        // Reagiere auf Texteingabe
        editor.textProperty().addListener((obs, oldText, newText) -> {
            String lower = newText.toLowerCase();
            comboBox.getItems().setAll(
                masterList.filtered(item -> item.toLowerCase().startsWith(lower))
            );
            comboBox.show(); // Zeige aktualisierte Dropdown-Liste
        });

        // Stelle sicher, dass die Liste zurückgesetzt wird, wenn ein Eintrag ausgewählt wurde
        comboBox.valueProperty().addListener((obs, oldVal, newVal) -> {
            if (newVal != null) {
                comboBox.getItems().setAll(masterList);
            }
        });

        VBox root = new VBox(10, comboBox);
        Scene scene = new Scene(root, 300, 200);
        stage.setScene(scene);
        stage.setTitle("Filter-ComboBox (startsWith)");
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

Und um dann doch noch meine Sicht auf Frage 1 und 2 kurz zu schildern:
Ja - leider läuft es hier wohl auf sowas hinaus. Du machst da aus meiner Sicht nichts falsch. Wenn Du beruflich mit JavaFX UIs erstellen musst, dann wäre es vermutlich sogar hilfreich, einfach mal eine eigene Library mit Controls zu erstellen. Alleine schon das Thema Grids ist in meinen Augen ein Horror ....
Und da fehlt dann auch ein einfacher Weg, sowas zu bewerkstelligen. Ich würde mir hier nicht nur Controls sondern Komponenten wünschen, wie man es von anderen Frameworks (die nicht auf Java basieren!) kennt.

 

[mihe7]

Erstmal vielen Dank.

ist hoffentlich nicht erstunken und erlogen

Zumindest gibt es kein setFilter 🤣 TextFields.bindAutoCompletion funktioniert. Allerdings sollte man vorher alles in Strings umwandeln, sonst sieht das am Ende so aus:



und nach der Auswahl:

Eine andere Idee wäre, bei der ComboBox<T> einfach die Liste der Elemente zu pflegen.

Das scheint mir doch wesentlich praktischer zu sein.



Die Namen sind natürlich fitkiv.

Doch halt... Hat man einmal ein Element ausgewählt und löscht dann wieder Text, so dass man wieder mehrer Matches hat, sieht es so aus:




Das bekommt man weg, indem man noch comboBox.autosize() vor combobox.show() einfügt.

Aber es kommt noch "besser": wenn man einmal etwas ausgewählt hat und dann Änderungen vornimmt, gibt es lustige Exceptions. ArrayIndexOutOfBoundsException, oder "Exception in thread "JavaFX Application Thread" java.lang.IllegalArgumentException: The start must be <= the end"

Und ganz lustig: wenn man noch nichts ausgewählt hat, funktionieren die Pfeiltasten nach oben bz.w unten nicht. Hat man aber einmal etwas ausgewählt, bearbeitet dann den Text erneut und drückt auf eine dieser Pfeiltasten, dann wird die Liste ersetzt - die enthält dann nur noch den ursprünglich ausgewählten Eintrag.

Wenn Du beruflich mit JavaFX UIs erstellen musst

Dann müsste ich mich erschießen.

 

[KonradN]

Es ist erstaunlich, wie ChatGPT neue APIs erfindet ... Das sehe ich jetzt nicht das erste Mal. Sorry, dass ich diese erste Idee nicht genauer geprüft habe ...

Die Probleme bei der zweiten Lösung sind natürlich blöd. An die Fälle hatte ich nicht gedacht und das macht die Erstellung des Controls dann noch deutlich komplexer. Man muss halt dann noch die Tasten selbst verwalten:

• Man muss einen eigenen Filter-Text verwalten, der halt nur angepasst wird, wenn der User die Eingabe aktiv verändert hat (Also die Änderung nicht durch die Pfeiltaste erfolgt ist).
• Bei der Anpassung des Filters muss die Selektion aktiv angepasst werden (Mich wundert, dass dies nicht bereits im Control enthalten ist. Das ist doch eigentlich ein Standard Verhalten, das jederzeit auftreten könnte. Man hat ein Binding zu einer ObservableList und dann ändert sich die Liste während ein Element selektiert war ... Hier wäre meine Erwartungshaltung, dass der Fall bereits berücksichtig wäre ...)

 

[mihe7]

Sorry

Kein Problem. Man kennt das ja von ChatGPT

Ich mache das jetzt mit einem TextField als Filter für eine stinknormale ListView. Das ist ja alles ein Witz. Hoffentlich brauche ich das nicht noch an einer anderen Stelle...

Hintergrund: das wird für einen Bekannten ein kleines Erfassungstool für einen Wettbewerb; der Teilnehmerkreis ist vorab bekannt, die Leute kommen und erhalten einen Laufzettel mit Nummer (handschriftlich). Die Zuordnung der Laufnummer zum Teilnehmer muss dann zunächst erfasst werden und um Fehler möglichst auszuschließen, soll auf die bereits bekannten Teilnehmer zurückgegrifen werden. Eine Liste alleine ist allerdings zu wenig, da sucht man sich bei 80 bis 100 Teilnehmern ggf. einen Wolf. Nach der Teilnahme werden die Ergebnisse eingetragen und am Ende soll wenigstens eine Auswertung, sortiert nach Laufnummer, gedruckt werden. Nichts großes, deshalb dachte ich mir, das sollte ja mit FX kein Problem sein...

 

[KonradN]

Hoffentlich brauche ich das nicht noch an einer anderen Stelle...

Dann müssen wir die "Java Forum FX Controls Library" als Projekt starten

Nichts großes, deshalb dachte ich mir, das sollte ja mit FX kein Problem sein...

Ja, das kann ich gut nachvollziehen. Aber sowas ist halt immer ein Problem, so lange keine guten Controls vorhanden sind. Das zurückgreifen auf Basis Controls ist da wohl mit das Beste denke ich mal. Ich bin immer froh über gute Control Libraries und mache das zu einem extrem wichtigen Punkt bei der Auswahl von UI Grundlagen. Alles Andere wird sonst sehr schnell zu einer extremen Tortur.

 

[Robert Zenz]

Es koennte sein dass die FXCustomComboBox die Probleme loest, insbesondere der FXCustomComboBoxSkin. Aber ich weisz nicht mehr was genau ich da implementiert hatte, weil der Hauptanwendungszweck war die Anzeige einer Tabelle als Auswahlliste.

In Aktion sieht man die in der JVx Kitchensink.