Combobox qui efface ses items

Version imprimable

Bonjour à tous,
J'ai donc une combobox avec des items (des labels pour être précis) que j'ai créé via FXML.
Mon problème est que quand je clique sur un des labels, ce dernier se "vide" de son texte et impossible de le ré-afficher!
L'évènement "onMousePressed" se déroule comme prévu.
Ci-dessous le code de la création de la comboBox et de l'évènement:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <ComboBox fx:id="detailsComboBox" layoutX="207.0" layoutY="142.0" prefHeight="25.0" prefWidth="174.0"> <items> <FXCollections fx:factory="observableArrayList"> <Label onMousePressed="#detailsClick" textFill="BLACK" text="Quitter"> <graphic> <StackPane prefWidth="50"> <children> <ImageView fitHeight="32" preserveRatio="true"> <image> <Image preserveRatio="false" smooth="false" url="/application/quitter.png" /> </image> </ImageView> </children> </StackPane> </graphic> </Label> ... ... ... </ComboBox>
Code:

1 2 3 4 5 @FXML protected void detailsClick(MouseEvent event) { Label l = (Label)event.getSource(); detailsTextField.setText(l.getText()); }
Je vous remercie d'avance!
A bientôt.

12/07/2015, 04h27
bouye

Ton problème vient du fait, je pense, que tu as des composants graphiques en tant qu'élément de ta combo. Soit, mais du coup ça pose quelques soucis. Un nœud ne peux être qu'une seule fois inséré dans la scène. Ici, par défaut chaque Label se trouve placé dans la liste déroulante de la combo. Mais quand tu cliques dessus, ton nœud est retiré de la liste déroulante pour être placé dans la partie bouton de la combo (attention il n'est cependant pas retiré de la liste items car il y a une distinction entre la liste des éléments qui est une liste logique et la liste visible à l'écran qui est sa représentation graphique). Il n'est jamais replacé après dans la liste déroulante d'où le fait qu'il "disparaisse".

Il te faut donc changer ta manière de procéder. Ce ne sont pas des instances de Label que tu dois mettre dans ta combo, mais une structure perso qui contient le texte, l'Image (et non pas l'ImageView pour exactement la même raison) ainsi que le nom ou la référence de la méthode à invoquer. Il te faut ensuite fournir un cellule pour la liste déroulante de la combo et une autre pour la partie bouton qui vont se décorer avec l'objet sélectionné lorsque la méthode updateItem() est invoquée.

Re,
Merci de ta réponse je vais chercher dans ce sens de suite!
En revanche, n'étant pas resté à rien faire, j'ai changé mon fusil d'épaule pour insérer ma comboBox par programmation.
La comboBox ne changera jamais (ce sont des choix fixes) et pour l'aspect général je voulais insérer des icons devant les items (comme je le faisait en C#)!
Mais voilà, nouvelle méthode = nouveau problème... Icic quand je clique sur un item, une exception est générée: Exception in thread "JavaFX Application Thread" java.lang.NullPointerException
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 //Création liste d'item + comboBox ObservableList<String> options = FXCollections.observableArrayList("1", "2", "3", "4"); ComboBox<String> myComboBox = new ComboBox<String>(options); myComboBox.setLayoutX(491.0); myComboBox.setLayoutY(382.0); myComboBox.setPrefWidth(176.5); //gestion de l'évènement ---> pour println ça marche parfaitement myComboBox.setOnAction((event) -> { String selectedChoice = myComboBox.getSelectionModel().getSelectedItem(); detailsTextField.setText(selectedChoice); //System.out.println("ComboBox Action (selected: " + selectedChoice.toString() + ")"); });
En bref, j'ai de nouveau besoin d'un coup de main!
Merci d'avance et à bientôt!

Re (encore),
Après quelques test je suis arrivé à ce que je veux sauf le problème d'exception précédent...
Petit détail supplémentaire, j'ai essayé avec une listView (presque au mot près) et ça fonctionne (sans la fameuse exception)!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
//comboBox
 
ComboBox<SplitPane> myComboBox = new ComboBox<SplitPane>();
myComboBox.setLayoutX(491.0);
myComboBox.setLayoutY(382.0);
myComboBox.setPrefWidth(176.5);
 
 
//liste d'items  (ComBoxItemPerso est une classe avec des variables et les propriétés qui vont avec)
//une variable "nomItem" par exemple "1" ou "2" etc
//une variable "urlIcon" par exemple "application/1.png" etc.
 
ObservableList<ComBoxItemPerso> options = FXCollections.observableArrayList(new ComBoxItemPerso("1", "application/1.png"), new ComBoxItemPerso("2", "application/2.png"), new ComBoxItemPerso("3", "application/3.png"));	
SplitPane splitItem;
Label rightLabel;		
ImageView leftImage;
 
for(ComBoxItemPerso cIP: options)
{
	splitItem = new SplitPane();
	rightLabel = new Label();
	leftImage = new ImageView();
 
	splitItem.setOrientation(Orientation.HORIZONTAL);
	splitItem.setPrefHeight(25);
 
	rightLabel.setText(cIP.getNomItem());                             //propriété qui récupère le nom de l'item (classe ComBoxItemPerso)
	rightLabel.setOnMousePressed(this::itemClickEvent);
	leftImage.setImage(new Image(cIP.getUrlIcon()));	        //propriété qui récupère l'url de l'icon de l'item (classe ComBoxItemPerso)			
	splitItem.getItems().addAll(leftImage, rightLabel);
	myComboBox.getItems().add(splitItem);
}
 
root.getChildren().add(myComboBox);           //Group root = FXMLLoader...
 
 
//Evènement
 
protected void itemClickEvent(MouseEvent event)
{		
	Label l = (Label)event.getSource();
        //println(...); //fonctionne très bien	
	detailsTextField.setText(l.getText());	//exception ic!!!
}

Et donc si quelqu'un a une idée... Merci d'avance et bon week-end!

Bwaaaaah, y en a partout, ca change tout le temps et y a jamais d'exemple directement lançable sans devoir bidouiller derrière ni essayer de comprendre comment cela fonctionne. La combo avec les SplitPane risque de reposer le meme soucis a longue -> cellule, cellule, cellule, CELLULE !!!!!!!!!

Ensuite, plutôt que de bidouiller le actionPerformed de la combo (qui ne sera pas appelé lorsque la valeur sélectionnée change via le code par exemple), pourquoi ne pas écouter la propriété selectedItem du selectionModel ou alors la propriete value de la comboBox a la place ?

En plus, je ne vois pas trop bien l’intérêt de mettre un SplitPane ici sachant que ce dernier a, en plus tendance à intercepter les événements souris et donc a rendre la sélection difficile. Donc j'ai du bidouiller un peu les écouteurs de souris pour que la sélection se fasse correctement :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
package combotest;
 
import javafx.application.Application;
import javafx.beans.InvalidationListener;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.ComboBox;
import javafx.scene.control.Label;
import javafx.scene.control.ListCell;
import javafx.scene.control.SplitPane;
import javafx.scene.control.TextField;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;
 
public class Main extends Application {
 
    private static final class ComBoxItemPerso {
 
        private final String value;
        private final Image icon;
 
        public ComBoxItemPerso(final String value, final String iconUrl) {
            this.value = value;
            this.icon = new Image(iconUrl);
        }
 
        public String getValue() {
            return value;
        }
 
        public Image getIcon() {
            return icon;
        }
    }
 
    private static final class ComBoxItemPersoListCell extends ListCell<ComBoxItemPerso> {
 
        private final ComboBox<ComBoxItemPerso> parent;
        private final Label rightLabel = new Label();
        private final ImageView leftImage = new ImageView();
        private final SplitPane splitPane = new SplitPane(leftImage, rightLabel);
 
        public ComBoxItemPersoListCell(final ComboBox<ComBoxItemPerso> parent) {
            super();
            // Oblige de rajouter tout ce qui suit a cause du splitpane.
            this.parent = parent;
            leftImage.setOnMousePressed(this::selectInCombo);
//            rightLabel.setStyle("-fx-border-color: green;");
            rightLabel.setMaxWidth(Double.MAX_VALUE);
            rightLabel.setOnMousePressed(this::selectInCombo);
        }
 
        private ComBoxItemPerso lastItem;
 
        @Override
        protected void updateItem(final ComBoxItemPerso item, final boolean empty) {
            super.updateItem(item, empty);
            lastItem = item;
            Node graphic = null;
            leftImage.setImage(null);
            rightLabel.setText(null);
            if (!empty && item != null) {
                leftImage.setImage(item.getIcon());
                rightLabel.setText(item.getValue());
                graphic = splitPane;
            }
            setGraphic(graphic);
            setText(null);
        }
 
        private void selectInCombo(final MouseEvent mouseEvent) {
            if (parent != null) {
                parent.getSelectionModel().select(lastItem);
            }
        }
    }
 
    private final TextField detailsTextField = new TextField();
    private final ComboBox<ComBoxItemPerso> myComboBox = new ComboBox<>();
 
    @Override
    public void start(Stage primaryStage) {
        detailsTextField.setEditable(false);
        //comboBox        
        myComboBox.setPrefWidth(176.5);
        final ObservableList<ComBoxItemPerso> options = FXCollections.observableArrayList(new ComBoxItemPerso("1", getClass().getResource("1.png").toExternalForm()),
                new ComBoxItemPerso("2", getClass().getResource("2.png").toExternalForm()),
                new ComBoxItemPerso("3", getClass().getResource("3.png").toExternalForm()));
        myComboBox.setItems(options);
        myComboBox.setButtonCell(new ComBoxItemPersoListCell(null));
        myComboBox.setCellFactory(listView -> new ComBoxItemPersoListCell(myComboBox));
        myComboBox.valueProperty().addListener(valueInvalidationListener);
        final StackPane center = new StackPane();
        center.getChildren().add(myComboBox);
        final BorderPane root = new BorderPane(center, detailsTextField, null, null, null);
        final Scene scene = new Scene(root, 300, 250);
        primaryStage.setTitle("Test");
        primaryStage.setScene(scene);
        primaryStage.show();
    }
 
    private final InvalidationListener valueInvalidationListener = observable -> {
        final ComBoxItemPerso item = myComboBox.getValue();
        final String text = (item == null) ? null : item.getValue();
        detailsTextField.setText(text);
    };
 
    public static void main(String[] args) {
        launch(args);
    }
 
}

18/07/2015, 19h42
moi411732

Re,
Désolé pour le retard!
Donc je viens d'essayer ta solution et effectivement ça fonctionne comme je le veux, les items ne s'effacent plus; Bref je n'ai plus adapter à mon application!
Pour info le splitPane c'est juste parce que... j'aime bien, c'est tout!
Voilà je te remercie et bon week-end...