Boutons d'image que l'utilisateur ne peut sélectionner qu'un des JavaFX


Je travaille sur une application Mood Journal et pour le moment, elle demande à l'utilisateur de noter son humeur sur une échelle de 1 à 5 avant d'enregistrer son 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 en fasse simplement action; au contraire, je veux que l'utilisateur ne puisse en sélectionner qu'un à la fois (comme un bouton radio). Comment puis-je accomplir?

entrez la description de l'image ici

Author: GOXR3PLUS, 2017-06-04

1 answers

Suggestion 1:

Vous pouvez utiliser ControlsFX SegmentedButton (Défini comme graphique du bouton que vous avez utilisé imoji):

entrez la description de l'image ici

Du doc:

Le SegmentedButton est un contrôle simple qui force ensemble un groupe d'instances de ToggleButton de telle sorte qu'elles apparaissent comme un seul 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 petite API sur ce contrôle, vous créez essentiellement des instances ToggleButton comme d'habitude (et ne prenez pas la peine de les mettre dans un ToggleGroup, car cela est fait par le SegmentedButton lui-même), puis vous placez ces boutons dans la liste des boutons. La manière longue de coder ceci 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 passer 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 Évaluation :

entrez la description de l'image ici

Du Doc:

Un contrôle permettant aux utilisateurs de fournir une note. Ce contrôle prend en charge les évaluations partielles (c'est-à-dire pas des nombres entiers et dépend de l'endroit où l'utilisateur clique dans le contrôle) et la mise à jour de la notation en survol.

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 horizontale par défaut. Pour créer un contrôle d'évaluation vertical, il suffit de modifier orientation, en tant que telle:

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

Vous pouvez continuer la lecture dudoc ...


Suggestion 3:(Pas De Troisième Bibliothèque Nécessaire)

Vous pouvez créer une barre d'outils personnalisée avec 5 Button, chacun aura une PseudoClass(selected) et chaque fois que l'un d'eux est pressé , les autres auront la Pseudoclass(selected=false), de sorte que l'utilisateur peut voir lequel est sélectionné.

, de Sorte que vous pouvez faire quelque chose de similaire à : entrez la description de l'image ici

Lisez ceci article si vous voulez l'implémenter - > http://fxexperience.com/2012/02/customized-segmented-toolbar-buttons/

 1
Author: GOXR3PLUS, 2017-06-04 17:27:48