[java] JavaFX 탭과 아코디언 구현하기

15 Nov 2023

java

이번에는 JavaFX 라이브러리를 사용하여 UI에서 탭과 아코디언을 구현하는 방법에 대해 알아보겠습니다. 탭은 여러 개의 패널을 탭 단위로 구분하여 사용자가 필요한 정보를 확인할 수 있는 방법이며, 아코디언은 여러 개의 패널을 접었다 폈다 할 수 있는 UI 요소입니다.

1. 탭 구현하기

JavaFX에서 탭을 구현하기 위해서는 TabPane과 Tab 클래스를 사용합니다. TabPane은 여러 개의 Tab을 담을 수 있는 컨테이너 역할을 하며, 각 Tab은 독립적인 패널을 가질 수 있습니다.

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Tab;
import javafx.scene.control.TabPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class TabExample extends Application {
    public void start(Stage primaryStage) {
        TabPane tabPane = new TabPane();

        Tab tab1 = new Tab("Tab 1");
        tab1.setContent(new VBox()); // 탭1에 표시할 UI 요소들을 담을 VBox 생성
        tabPane.getTabs().add(tab1);

        Tab tab2 = new Tab("Tab 2");
        tab2.setContent(new VBox()); // 탭2에 표시할 UI 요소들을 담을 VBox 생성
        tabPane.getTabs().add(tab2);

        Scene scene = new Scene(tabPane, 400, 300);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

위의 예제 코드는 TabPane에 두 개의 Tab을 추가하는 예제입니다. 각 Tab은 setContent() 메서드를 사용하여 해당하는 패널을 설정할 수 있습니다. 위의 예제에서는 VBox를 사용하여 각각의 Tab에 표시할 UI 요소들을 담았습니다.

2. 아코디언 구현하기

JavaFX에서 아코디언을 구현하기 위해서는 Accordion과 TitledPane 클래스를 사용합니다. Accordion은 여러 개의 TitledPane을 담을 수 있는 컨테이너 역할을 하며, 각 TitledPane은 제목과 내용을 가집니다.

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Accordion;
import javafx.scene.control.TitledPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class AccordionExample extends Application {
    public void start(Stage primaryStage) {
        Accordion accordion = new Accordion();

        TitledPane pane1 = new TitledPane();
        pane1.setText("Pane 1");
        pane1.setContent(new VBox()); // 패널1에 표시할 UI 요소들을 담을 VBox 생성
        accordion.getPanes().add(pane1);

        TitledPane pane2 = new TitledPane();
        pane2.setText("Pane 2");
        pane2.setContent(new VBox()); // 패널2에 표시할 UI 요소들을 담을 VBox 생성
        accordion.getPanes().add(pane2);

        Scene scene = new Scene(accordion, 400, 300);
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

위의 예제 코드는 Accordion에 두 개의 TitledPane을 추가하는 예제입니다. 각각의 TitledPane은 setText() 메서드로 제목을 설정하고, setContent() 메서드로 해당하는 패널을 설정할 수 있습니다. 위의 예제에서는 VBox를 사용하여 각각의 TitledPane에 표시할 UI 요소들을 담았습니다.

결론

JavaFX를 사용하여 탭과 아코디언을 구현하는 방법에 대해 알아보았습니다. TabPane을 사용하여 여러 개의 탭을 구현하고, Accordion을 사용하여 여러 개의 아코디언을 구현할 수 있습니다. 이러한 UI 요소들을 적절히 활용하면 보다 다양하고 사용자 친화적인 인터페이스를 개발할 수 있습니다.

참고 자료: