ListeView

Une vue liste est un contrôle qui remplit essentiellement la même fonction qu'une zone de liste déroulante, mais elle permet à l'utilisateur de choisir une ou plusieurs valeurs.

La figure ci-dessous répertorie plusieurs propriétés et constructeurs fréquemment utilisés dans ListView. ListView est défini comme une classe générique. Le type générique T spécifie le type d'élément pour les éléments stockés dans une vue liste.

La méthode getSelectionModel() renvoie une instance de SelectionModel, qui contient les méthodes permettant de définir un mode de sélection et d'obtenir les indices et les éléments sélectionnés. Le mode de sélection est défini dans l'une des deux constantes SelectionMode.MULTIPLE et SelectionMode.SINGLE, qui indique si un seul élément ou plusieurs éléments peuvent être sélectionnés. La valeur par défaut est SelectionMode.SINGLE. La figure ci-dessous (a) montre une seule sélection et les figures ci-dessous (b) et (c) montrent plusieurs sélections.

Les instructions suivantes créent une vue de liste de six éléments avec plusieurs sélections autorisées.

ObservableList articles =
FXCollections.observableArrayList("Article 1", "Article 2",
"Article 3", "Article 4", "Article 5", "Article 6");
ListView lv = new ListView<>(éléments);
lv.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

Le modèle de sélection dans une vue de liste possède la propriété selectedItemProperty, qui est une instance de Observable. Vous pouvez ajouter un écouteur à cette propriété pour gérer le changement de propriété comme suit :

`lv.getSelectionModel().selectedItemProperty().addListener(
nouveau InvalidationListener() {
public void invalidé (Observable ov) {
System.out.println("Indices sélectionnés : "

• lv.getSelectionModel().getSelectedIndices()); System.out.println("Éléments sélectionnés : "
• lv.getSelectionModel().getSelectedItems()); } });`

Cette classe interne anonyme peut être simplifiée à l'aide d'une expression lambda comme suit :

`lv.getSelectionModel().selectedItemProperty().addListener(ov -> {
System.out.println("Indices sélectionnés : "

• lv.getSelectionModel().getSelectedIndices()); System.out.println("Éléments sélectionnés : "
• lv.getSelectionModel().getSelectedItems()); });`

Le code ci-dessous donne un programme qui permet aux utilisateurs de sélectionner les pays dans une vue de liste et affiche les drapeaux des pays sélectionnés dans les vues d'images. La figure ci-dessous montre un exemple d'exécution du programme.

Voici les grandes étapes du programme :

1. Créez l'interface utilisateur. Créez une vue de liste avec neuf noms de pays comme valeurs de sélection et placez la vue de liste dans un volet déroulant. Placez le volet de défilement à gauche d'un volet de bordure. Créez neuf vues d’images à utiliser pour afficher les images des drapeaux des pays. Créez un volet de flux pour contenir les vues d'images et placez le volet au centre du volet de bordure.
2. Traitez l'événement. Créez un écouteur pour implémenter la méthode invalidated dans l'interface InvalidationListener afin de placer les vues des images de drapeau des pays sélectionnés dans le volet.

package application;
import javafx.application.Application;
import javafx.stage.Stage;
import javafx.collections.FXCollections;
import javafx.scene.Scene;
import javafx.scene.control.ListView;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.SelectionMode;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.FlowPane;

public class ListViewDemo extends Application {
    // Declare an array of Strings for flag titles
    private String[] flagTitles = {"Canada", "China", "Denmark", "France", "Germany", "India", "Norway", "United Kingdom", "United States of America"};

    // Declare an ImageView array for the national flags of 9 countries
    private ImageView[] ImageViews = {new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"), 
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/lo.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),
            new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"), new ImageView("file:/C:/Users/Paul/development/MyJavaFX/src/application/image/ke.jpg"),};

    @Override // Override the start method in the Application class
    public void start(Stage primaryStage) {
        ListView<String> lv = new ListView<>(FXCollections.observableArrayList(flagTitles));
        lv.setPrefSize(400, 400);
        lv.getSelectionModel().setSelectionMode(SelectionMode.MULTIPLE);

        // Create a pane to hold image views
        FlowPane imagePane = new FlowPane(10, 10);
        BorderPane pane =  new BorderPane();
        pane.setLeft(new ScrollPane(lv));
        pane.setCenter(imagePane);

        lv.getSelectionModel().selectedIndexProperty().addListener(ov -> {
            imagePane.getChildren().clear();
            for(Integer i: lv.getSelectionModel().getSelectedIndices()) {
                imagePane.getChildren().add(ImageViews[i]);
            }
        });

        // Create a scene and place it in the stage
        Scene scene = new Scene(pane, 450, 170);
        primaryStage.setTitle("ListViewDemo"); // Set the stage title
        primaryStage.setScene(scene); // Place the scene in the stage
        primaryStage.show(); // Display the stage
    }

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

Le programme crée un tableau de chaînes pour les pays (lignes 15) et un tableau de neuf vues d'images pour afficher les images des drapeaux de neuf pays (lignes 18 à 25) dans le même ordre que dans le tableau des pays. Les éléments de la vue liste proviennent du tableau de pays (ligne 29). Ainsi, l'index 0 du tableau de vue image correspond au premier pays dans la vue liste.

La vue liste est placée dans un volet de défilement (ligne 36) afin de pouvoir la faire défiler lorsque le nombre d'éléments dans la liste s'étend au-delà de la zone de visualisation.

Par défaut, le mode de sélection de la vue liste est unique. Le mode de sélection pour la vue liste est défini sur multiple (ligne 31), ce qui permet à l'utilisateur de sélectionner plusieurs éléments dans la vue liste. Lorsque l'utilisateur sélectionne des pays dans la vue liste, le gestionnaire de l'auditeur (lignes 39 à 44) est
exécuté, qui obtient les index des éléments sélectionnés et ajoute leurs vues d'image correspondantes au volet de flux.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!