[java] JFoenix를 이용한 게임 대시보드 디자인

29 Nov 2023

java

이번에는 JavaFX로 게임 대시보드를 디자인하는 방법에 대해 알아보겠습니다. JavaFX는 사용자 인터페이스를 만들기 위한 풍부한 라이브러리이며, JFoenix는 JavaFX의 장점을 살려 더욱 멋진 디자인을 구현할 수 있는 라이브러리입니다.

JFoenix 소개

JFoenix는 JavaFX와 Material Design을 결합한 라이브러리로, Google의 Material Design을 따르는 UI 컴포넌트를 제공합니다. JFoenix를 사용하면 게임 대시보드와 같은 멋진 인터페이스를 쉽게 구현할 수 있습니다.

JFoenix 설치

JFoenix를 사용하기 위해서는 먼저 Maven 또는 Gradle과 같은 의존성 관리 도구를 사용하여 프로젝트에 JFoenix를 추가해야 합니다. 아래의 예시는 Maven을 사용하는 경우입니다.

<dependencies>
    <dependency>
        <groupId>com.jfoenix</groupId>
        <artifactId>jfoenix</artifactId>
        <version>9.0.9</version>
    </dependency>
</dependencies>

의존성을 추가한 후에는 프로젝트를 다시 빌드해주어야 합니다. Maven을 사용하는 경우에는 mvn install 명령어를 실행하면 됩니다.

게임 대시보드 디자인

이제 실제로 JFoenix를 사용하여 게임 대시보드를 디자인해보겠습니다.

import com.jfoenix.controls.JFXButton;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class GameDashboard extends Application {

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

    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Game Dashboard");
        
        JFXButton startButton = new JFXButton("Start Game");
        startButton.getStyleClass().add("start-button");
        
        VBox vbox = new VBox();
        vbox.getChildren().add(startButton);
        
        Scene scene = new Scene(vbox, 400, 300);
        scene.getStylesheets().add(getClass().getResource("dashboard.css").toExternalForm());
        
        primaryStage.setScene(scene);
        primaryStage.show();
    }
}

위의 코드는 하나의 버튼이 있는 간단한 게임 대시보드 예시입니다. JFXButton은 JFoenix의 커스텀 버튼으로, getStyleClass() 메서드를 통해 CSS 스타일을 지정할 수 있습니다.

CSS 스타일링

게임 대시보드를 보다 멋지게 만들기 위해서는 CSS 스타일링을 적용해야 합니다. CSS 파일인 dashboard.css를 프로젝트에 추가하고 다음과 같은 내용을 작성해보세요.

.start-button {
    -fx-background-color: #00b894;
    -fx-text-fill: white;
    -fx-font-size: 14px;
    -jfx-button-type: RAISED;
}

위의 CSS 파일은 시작 버튼을 녹색 배경에 흰색 텍스트로 스타일링하는 예시입니다.

실행 결과

게임 대시보드 애플리케이션을 실행하면 아래와 같이 멋진 인터페이스가 생성됩니다.

Game Dashboard

JFoenix의 다양한 컴포넌트를 사용하여 게임 대시보드 디자인을 마무리할 수 있습니다. JFoenix의 공식 문서에서 더 많은 정보와 예시를 찾아볼 수 있습니다.

참고 자료

JFoenix 공식 문서: https://github.com/jfoenixadmin/JFoenix
JavaFX 공식 문서: https://openjfx.io/javadoc/