Image Boutons que l'utilisateur ne peut sélectionner que l'un des JavaFX

Question

Je travaille sur une application Mood Journal et pour l'instant, il demande à l'utilisateur d'évaluer leur humeur sur une échelle de 1-5 avant d'enregistrer leur entrée comme indiqué sur l'image ci-dessous.

Je veux remplacer cela par 5 petits boutons disposés horizontalement avec des images emoji respectives comme arrière-plan. J'ai déjà choisi les images que je voudrais utiliser, et j'ai cherché à implémenter un bouton FX normal ou un ImageView, mais avec ceux-ci, il semble que cliquer sur le bouton fait simplement une action; Je veux plutôt que l'utilisateur ne puisse en sélectionner qu'un seul à la fois (comme un bouton radio). Comment puis-je accomplir cela?

Answer 1

Suggestion 1:

Vous pouvez utiliser ControlsFX SegmentedButton (Définir comme graphique du bouton PRÉFÉRÉ imoji):

De la doc :

Le SegmentedButton est un contrôle simple qui force ensemble un groupe d'instances ToggleButton de sorte qu'elles apparaissent comme un bouton collectif (avec des sous-boutons) plutôt que comme des boutons individuels. Ceci est mieux clarifié avec une image:

Il y a très peu API sur ce contrôle, vous créez essentiellement ToggleButton instances comme à l'habitude (et fais comme cela se fait par lui-même SegmentedButton pas pris la peine de les mettre dans un ToggleGroup,) , puis vous placez ces boutons dans la liste des boutons. La façon la main de temps à coder est la suivante:

ToggleButton b1 = new ToggleButton("day"); 
ToggleButton b2 = new ToggleButton("week"); 
ToggleButton b3 = new ToggleButton("month"); 
ToggleButton b4 = new ToggleButton("year"); 

SegmentedButton segmentedButton = new SegmentedButton();  
segmentedButton.getButtons().addAll(b1, b2, b3, b4); 

Une façon légèrement plus courte de le faire est de transmettre les instances ToggleButton dans le constructeur varargs, en tant que tel:

SegmentedButton segmentedButton = new SegmentedButton(b1, b2, b3, b4); 

---

Suggestion 2:

Vous pouvez utiliser ControlsFX Rating:

Du Doc:

Un contrôle pour permettre aux utilisateurs de fournir une note. Ce contrôle prend en charge les notations partielles (c'est-à-dire les nombres entiers et non dépendants de l'endroit où l'utilisateur clique dans le contrôle) et la mise à jour de la note sur le vol stationnaire.

Pour créer un contrôle de notation qui ressemble à ceci est simple:

final Rating rating = new Rating(); 

Cela crée un contrôle de notation par défaut horizontale.Pour créer un contrôle vertical de notation, il suffit de changer l'orientation, en tant que tel:

final Rating rating = new Rating(); 
rating.setOrientation(Orientation.VERTICAL); 

Vous pouvez continuer à lire de la doc ...

---

Suggestion 3: (Pas de troisième bibliothèque Needed)

Vous pouvez faire un ToolBar personnalisé avec 5 Button, chacun aura une pseudoClasse (selected) et chaque fois que l'un d'entre eux est pressé les autres seront avoir le Pseudoclass (selected=false), de sorte que l'utilisateur peut voir lequel est sélectionné.

, vous pouvez faire quelque chose de similaire à:

Lire cet article si vous voulez mettre en œuvre ->http://fxexperience.com/2012/02/customized-segmented-toolbar-buttons/