JavaFX Accordion

分手后的思念是犯贱 2023-10-15 14:26 12阅读 0赞

The *JavaFX* *Accordion* control is a container control which can contain several sections internally, each of which can have their content expanded or collapsed. The Accordion control is implemented by the JavaFX class `javafx.scene.control.Accordion`. The section displayed inside it are made up of [JavaFX TitledPane][] controls. Here is a screenshot of a JavaFX `Accordion` control:

![d15b2a0ebd0d4858aa3407eb6983cdec.png][]

Notice that none of the sections are expanded. You can expand a section by clicking on the little triangle next to the title for each section. Expanding a section will reveal its content. Here is a screenshot of a JavaFX `Accordion` with a section expanded:

![a0b73f99a4ff48d29abd66b0678a8a17.png][]

### JavaFX Accordion Example ###

Here is a full JavaFX `Accordion` example so you can quickly get an overview of what its usage looks like:

import javafx.application.Application;
    import javafx.scene.Scene;
    import javafx.scene.control.Accordion;
    import javafx.scene.control.Label;
    import javafx.scene.control.TitledPane;
    import javafx.scene.layout.VBox;
    import javafx.stage.Stage;
    
    public class AccordionExample extends Application {
    
        public static void main(String[] args) {
            launch(args);
        }
    
        public void start(Stage primaryStage) {
    
            Accordion accordion = new Accordion();
    
            TitledPane pane1 = new TitledPane("Boats" , new Label("Show all boats available"));
            TitledPane pane2 = new TitledPane("Cars"  , new Label("Show all cars available"));
            TitledPane pane3 = new TitledPane("Planes", new Label("Show all planes available"));
    
            accordion.getPanes().add(pane1);
            accordion.getPanes().add(pane2);
            accordion.getPanes().add(pane3);
    
            VBox vBox = new VBox(accordion);
            Scene scene = new Scene(vBox);
    
            primaryStage.setScene(scene);
            primaryStage.show();
        }
    }

### Create an Accordion ###

Before you can use the JavaFX `Accordion` control you must first instantiate it. You instantiate it simply using the Java `new` command, like this:

Accordion accordion = new Accordion();

### Add TitledPane Objects to Accordion ###

Each section displayed inside a JavaFX `Accordion` is represented by a [JavaFX TitledPane][]. To add sections to the `Accordion` control, you create on `TitledPane` per section, and add it to the `Accordion`. Here is an example of adding `TitledPane` sections to a JavaFX `Accordion`:

Accordion accordion = new Accordion();
    
    TitledPane pane1 = new TitledPane("Boats" , new Label("Show all boats available"));
    TitledPane pane2 = new TitledPane("Cars"  , new Label("Show all cars available"));
    TitledPane pane3 = new TitledPane("Planes", new Label("Show all planes available"));
    
    accordion.getPanes().add(pane1);
    accordion.getPanes().add(pane2);
    accordion.getPanes().add(pane3);

### Add Accordion to Scene Graph ###

To make a JavaFX `Accordion` visible, you must add it to the [scene graph][]. Here is an example of adding a JavaFX `Accordion` to the JavaFX scene graph:

Accordion accordion = new Accordion();
    
    VBox vBox = new VBox(accordion);
    Scene scene = new Scene(vBox);
    
    primaryStage.setScene(scene);
    
    primaryStage.show();

[JavaFX TitledPane]: https://jenkov.com/tutorials/javafx/titledpane.html
[d15b2a0ebd0d4858aa3407eb6983cdec.png]: https://img-blog.csdnimg.cn/d15b2a0ebd0d4858aa3407eb6983cdec.png
[a0b73f99a4ff48d29abd66b0678a8a17.png]: https://img-blog.csdnimg.cn/a0b73f99a4ff48d29abd66b0678a8a17.png
[scene graph]: https://jenkov.com/tutorials/javafx/scene.html#the-scene-graph