JavaFX | JavaFX 애니메이션 기능 | Timeline으로 애니메이션 표시


만든 Timeline에는 애니메이션에 관한 다양한 설정을 위한 메소드가 제공되고 있다. 그 메소드들을 사용하여 필요한 정보를 조립하고 있다. 주요 메소드가 정리해 두자.

오토 리버스 설정

"Timeline".setAutoReverse("boolean");

애니메이션을 왕복 재생하는 것디다. true로 하면 오토 리버스가 설정된다.

재생 횟수 설정

"Timeline".setCycleCount("int");

애니메이션의 재생 횟수를 정수로 지정한다.

KeyFrame을 관리하는 List 얻기

"Timeline".getKeyFrames ();

Timeline에 설정되어 있는 KeyFrame는 List (ObservableList) 인스턴스에 정리해 Timeline에 보관되어 있다. 이 List를 얻는하는 것은 getKeyFrames이다.

KeyFrame 추가

"ObservableList".add("KeyFrame");

Timeline에 KeyFrame을 설정하려면, getKeyFrames에서 List를 얻어 “add"메소드로 추가한다. 이것으로 KeyFrame이 추가된다.

그럼, 실제로 Timeline을 사용하여 애니메이션을 샘플을 만들어 보자. 아래에 createShape 메소드를 재 작성하였다.

// import javafx.animation.*;
// import javafx.util.Duration;
 
public void createShape(Pane root){
    Rectangle r = new Rectangle(20, 20, 100, 50);
    r.setFill(Color.CYAN);
    root.getChildren().add(r);
     
    Timeline tl = new Timeline();
    tl.setAutoReverse(true);
    tl.setCycleCount(10);
 
    // 가로 작업 KeyFrame 작성
    KeyFrame key_a1 = new KeyFrame(
        new Duration(0),
        new KeyValue(r.widthProperty(),100));
    KeyFrame key_a2 = new KeyFrame(
        new Duration(2500),
        new KeyValue(r.widthProperty(),200));
 
    // 채우기 색 작업 KeyFrame 작성
    KeyFrame key_b1 = new KeyFrame(
        new Duration(0),
        new KeyValue(r.fillProperty(),Color.rgb(255, 0, 0)));
    KeyFrame key_b2 = new KeyFrame(
        new Duration(2500),
        new KeyValue(r.fillProperty(),Color.rgb(0, 0, 255)));
    tl.getKeyFrames().add(key_a1);
    tl.getKeyFrames().add(key_a2);
    tl.getKeyFrames().add(key_b1);
    tl.getKeyFrames().add(key_b2);
    tl.play();
}

이것을 실행해 보면, 사각형의 색상이 빨강 ~ 파랑 사이에서 변화하면서 폭이 늘었다가 줄여든다.

여기에서는 Rectangle의 폭 속성을 얻기 위하여 “widthProperty"라는 메소드를 사용한다. 이것은 “DoubleProperty"라는 double 값의 속성을 얻어온다.

또한 채우기 색을 얻기 위하여 “fillProperty"라는 메소드를 사용한다. 이것은 “ColorProperty"이라는 Color를 값으로 하는 Property이다. 인수에는 Color 클래스의 “rgb"라는 메소드를 사용하여 RGB 각 밝기를 인수로 지정한 색을 설정하고 있다.

Timeline을 잘 다룰 수있게 되면, 다양한 속성의 값을 자유롭게 조작하고 움직일 수 있게 한다. Node에 어떤 조작 가능한 속성이 있는지 알아 보면 재미있을 것이다.