[java] JavaFX 타임라인과 애니메이션 이벤트

15 Nov 2023

java

JavaFX는 Rich User Interface를 구축하기 위한 강력한 플랫폼입니다. 이 중에서도 타임라인과 애니메이션 이벤트는 사용자 인터랙션 및 시각적인 요소를 제어하는데 매우 유용합니다. 이 글에서는 JavaFX에서 타임라인과 애니메이션 이벤트를 어떻게 사용할 수 있는지 알아보겠습니다.

타임라인 (Timeline)

타임라인은 일련의 KeyFrame 객체를 사용하여 애니메이션을 조절하는 클래스입니다. KeyFrame은 시간 지점과 해당 시간에 실행될 액션 인터페이스를 포함합니다.

아래의 예제 코드에서는 타임라인을 사용하여 사각형이 x축으로 이동하는 애니메이션을 만듭니다.

import javafx.animation.Animation;
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Main extends Application {
    public void start(Stage primaryStage) {
        // 사각형 생성
        Rectangle rectangle = new Rectangle(100, 100, Color.BLUE);

        // Pane 생성
        Pane pane = new Pane(rectangle);
        pane.setPrefSize(200, 200);

        // 타임라인 생성
        Timeline timeline = new Timeline(
                new KeyFrame(Duration.seconds(0), new KeyValue(rectangle.xProperty(), 0)),
                new KeyFrame(Duration.seconds(2), new KeyValue(rectangle.xProperty(), 100))
        );
        timeline.setCycleCount(Animation.INDEFINITE); // 반복 실행

        // Scene 생성
        Scene scene = new Scene(pane);

        // 타임라인 시작
        timeline.play();

        // Stage 설정
        primaryStage.setScene(scene);
        primaryStage.show();
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

위의 코드에서는 Timeline 객체를 생성하고, KeyFrame 객체를 사용하여 애니메이션을 정의합니다. Duration은 애니메이션의 진행 시간을 설정하고, KeyValue은 속성의 값 변화를 정의합니다. setCycleCount 메소드로 반복 실행 여부를 설정한 후 play 메소드로 타임라인을 시작합니다.

애니메이션 이벤트 (Animation Event)

애니메이션이 시작되었을 때, 정지되었을 때, 혹은 반복되었을 때 원하는 동작을 수행해야 할 때가 있습니다. 이럴 때는 애니메이션 이벤트를 사용할 수 있습니다. Timeline 객체에서는 setOnFinished 메소드를 사용하여 애니메이션 종료 후 실행될 동작을 정의할 수 있습니다.

아래의 예제 코드에서는 타임라인이 반복되는 동안 사각형의 색상을 변화시키는 애니메이션을 만듭니다.

import javafx.animation.Animation;
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;

public class Main extends Application {
    public void start(Stage primaryStage) {
        // 사각형 생성
        Rectangle rectangle = new Rectangle(100, 100, Color.BLUE);

        // Pane 생성
        Pane pane = new Pane(rectangle);
        pane.setPrefSize(200, 200);

        // 타임라인 생성
        Timeline timeline = new Timeline(
                new KeyFrame(Duration.seconds(0), new KeyValue(rectangle.fillProperty(), Color.BLUE)),
                new KeyFrame(Duration.seconds(2), new KeyValue(rectangle.fillProperty(), Color.RED)),
                new KeyFrame(Duration.seconds(4), new KeyValue(rectangle.fillProperty(), Color.YELLOW))
        );
        timeline.setCycleCount(Animation.INDEFINITE); // 반복 실행
        timeline.setOnFinished(event -> {
            System.out.println("애니메이션 완료!");
        });

        // Scene 생성
        Scene scene = new Scene(pane);

        // 타임라인 시작
        timeline.play();

        // Stage 설정
        primaryStage.setScene(scene);
        primaryStage.show();
    }
    
    public static void main(String[] args) {
        launch(args);
    }
}

코드에서는 Timeline 객체를 생성하고, KeyFrame 객체와 KeyValue 객체를 사용하여 색상 변화를 정의합니다. 그리고 setOnFinished 메소드를 사용하여 애니메이션이 종료되면 실행될 동작을 정의합니다.

결론

JavaFX에서 타임라인과 애니메이션 이벤트를 사용하면 손쉽게 동적인 애니메이션 효과를 구현할 수 있습니다. 타임라인을 사용하여 애니메이션을 제어하고, 애니메이션이 종료되었을 때 추가적인 동작을 수행할 수 있습니다. 이를 활용하여 더 화려하고 상호작용성 있는 애플리케이션을 개발할 수 있습니다.

타임라인 (Timeline)

애니메이션 이벤트 (Animation Event)

결론

참고 자료