javaFX - 화면 이동과 애니메이션 (애니메이션)

애니메이션

 

: 컨트롤 or 컨트롤러의 Property 변화를 주어진 시간동안 진행함으로써 구현.

 

  애니메이션과 관련된 클래스

translateX 속성을 주어진 종료값까지 변화시켜 수평 방향으로 슬라이드하는 애니메이션을 구현한 코드

 

종료값은 x 좌표 값이고, 음수, 0, 양수 모두 가질 수 있음.

 

1.객체 생성 : Timeline tl = new Timeline();

 

2. KeyValue kv = new KeyValue(parent.translateXProperty(), 종료값);

 

3. KeyFrame kf = new KeyFrame(Duration.millis(지속시간), kf);

 

4. tl.getKeyFrames().add(kf);

 

5.tl.play();

 

translateX 속성을 주어진 종료값까지 변화시켜 수평 방향으로 슬라이드하는 애니메이션을 구현한 코드

종료값은 x 좌표 값이고, 음수, 0, 양수 모두 가질 수 있음.

1.객체 생성 : Timeline tl = new Timeline();

2. KeyValue kv = new KeyValue(parent.translateXProperty(), 종료값);

3. KeyFrame kf = new KeyFrame(Duration.millis(지속시간), kf);

4. tl.getKeyFrames().add(kf);

5.tl.play();



예제)

예제)

FXML

<?xml version="1.0" encoding="UTF-8"?>



<?import javafx.scene.layout.*?>

<?import javafx.scene.control.*?>

<?import javafx.geometry.*?>



<StackPane xmlns:fx="http://javafx.com/fxml" 

prefHeight="500" prefWidth="350" 

fx:controller="thisisjava.RootController">

<children>

<BorderPane>

<top>

<BorderPane style="-fx-background-color: #eaeaea;">

<center>

<Label alignment="CENTER" prefWidth="215" text="메인 화면" />

</center>


<right>

<Button fx:id="btnLogin" text="lOGIN"/>

</right>

<padding>

<Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />

</padding>

</BorderPane>

</top>


   <center>

      <VBox style="-fx-background-color: #0057ff;">

      </VBox>

   </center>

</BorderPane>

</children>

</StackPane>



자바1

package thisisjava;



import javafx.application.Application;

import javafx.fxml.FXMLLoader;

import javafx.scene.Parent;

import javafx.scene.Scene;

import javafx.stage.Stage;



public class AppMain extends Application {

@Override

public void start(Stage primaryStage) throws Exception {

primaryStage.setTitle("화면이동과 애니메이션");

Parent root= FXMLLoader.load(getClass().getResource("root.fxml"));

Scene scene = new Scene(root);

primaryStage.setScene(scene);

primaryStage.setWidth(350);       //윈도우의 고정 폭 설정

primaryStage.setHeight(500);      //윈도우의 고정 높이 설정

primaryStage.setResizable(false);   //윈도우 크기를 조정할 수 없도록 함

primaryStage.show();

}


public static void main(String[] args) {

launch(args);

}

}







자바2

package thisisjava;



import java.net.URL;

import java.util.ResourceBundle;



import javafx.animation.KeyFrame;

import javafx.animation.KeyValue;

import javafx.animation.Timeline;

import javafx.event.ActionEvent;

import javafx.fxml.FXML;

import javafx.fxml.FXMLLoader;

import javafx.fxml.Initializable;

import javafx.scene.Parent;

import javafx.scene.control.Button;

import javafx.scene.layout.StackPane;

import javafx.util.Duration;



public class RootController implements Initializable {

@FXML private Button btnLogin;


@Override

public void initialize(URL location, ResourceBundle resources) {

btnLogin.setOnAction(e->handleBtnLogin(e));

}


public void  handleBtnLogin(ActionEvent event) {

try {

Parent login= FXMLLoader.load(getClass().getResource("login.fxml"));

StackPane root = (StackPane) btnLogin.getScene().getRoot();

root.getChildren().add(login);


login.setTranslateX(350);



Timeline timeline = new Timeline();

KeyValue keyValue = new KeyValue(login.translateXProperty(), 0);

KeyFrame keyFrame = new KeyFrame(Duration.millis(100), keyValue);

timeline.getKeyFrames().add(keyFrame);

timeline.play();

} catch(Exception e) {

e.printStackTrace();

}

}

}




FXML2

<?xml version="1.0" encoding="UTF-8"?>



<?import javafx.scene.layout.*?>

<?import javafx.scene.control.*?>

<?import javafx.geometry.*?>



<BorderPane  xmlns:fx="http://javafx.com/fxml" 

fx:id="login" prefHeight="500" prefWidth="350" 

fx:controller="thisisjava.LoginController">

<top>

<BorderPane style="-fx-background-color: #eaeaea;">

<left>

<Button fx:id="btnMain" text="MAIN"/>

</left>

<center>

<Label alignment="CENTER" prefWidth="215" text="로그인 화면" />

</center>

<padding>

<Insets bottom="10.0" left="10.0" right="10.0" top="10.0" />

</padding>

</BorderPane>

</top>


   <center>

      <VBox style="-fx-background-color: #ffff38;">

      </VBox>

   </center>

</BorderPane>



자바3

package thisisjava;



import java.net.URL;

import java.util.ResourceBundle;



import javafx.animation.KeyFrame;

import javafx.animation.KeyValue;

import javafx.animation.Timeline;

import javafx.event.ActionEvent;

import javafx.event.EventHandler;

import javafx.fxml.FXML;

import javafx.fxml.Initializable;

import javafx.scene.control.Button;

import javafx.scene.layout.BorderPane;

import javafx.scene.layout.StackPane;

import javafx.util.Duration;



public class LoginController implements Initializable {

@FXML private BorderPane login;

@FXML private Button btnMain;


@Override

public void initialize(URL location, ResourceBundle resources) {

btnMain.setOnAction(e->handleBtnMain(e));

}


public void handleBtnMain(ActionEvent event) {

try {

StackPane root = (StackPane) btnMain.getScene().getRoot();


login.setTranslateX(0);


Timeline timeline = new Timeline();

KeyValue keyValue = new KeyValue(login.translateXProperty(), 350);

KeyFrame keyFrame = new KeyFrame(

     Duration.millis(100), 

     new EventHandler<ActionEvent>() {

         @Override

         public void handle(ActionEvent event) {

         root.getChildren().remove(login);

         }

        }, 

        keyValue

        );

timeline.getKeyFrames().add(keyFrame);

timeline.play(); //  애니메이션

} catch(Exception e) {

e.printStackTrace();

}

}

}