JavaFX - Hoạt ảnh

Nói chung, tạo hoạt ảnh cho một đối tượng ngụ ý tạo ra ảo ảnh về chuyển động của nó bằng cách hiển thị nhanh. Trong JavaFX, một nút có thể được làm động bằng cách thay đổi thuộc tính của nó theo thời gian. JavaFX cung cấp một gói có tênjavafx.animation. Gói này chứa các lớp được sử dụng để tạo hoạt ảnh cho các nút. Animation là lớp cơ sở của tất cả các lớp này.

Sử dụng JavaFX, bạn có thể áp dụng các hoạt ảnh (chuyển tiếp) chẳng hạn như Fade Transition, Fill Transition, Rotate Transition, Scale Transition, Stroke Transition, Translate Transition, Path Transition, Sequential Transition, Pause Transition, Parallel Transition, Vân vân.

Tất cả các chuyển đổi này được đại diện bởi các lớp riêng lẻ trong gói javafx.animation.

Để áp dụng một hoạt ảnh cụ thể cho một nút, bạn phải làm theo các bước dưới đây:

  • Tạo một nút yêu cầu bằng cách sử dụng lớp tương ứng.

  • Khởi tạo lớp chuyển tiếp (hoạt ảnh) tương ứng sẽ được áp dụng

  • Đặt các thuộc tính của quá trình chuyển đổi và

  • Cuối cùng chơi chuyển đổi bằng cách sử dụng play() phương pháp của Animation lớp học.

Trong chương này, chúng ta sẽ thảo luận về các ví dụ về chuyển đổi cơ bản (Xoay, Chia tỷ lệ, Dịch).

Xoay chuyển đổi

Sau đây là chương trình thể hiện Chuyển đổi Xoay trong JavaFX. Lưu mã này trong một tệp có tênRotateTransitionExample.java.

import javafx.animation.RotateTransition; 
import javafx.application.Application; 
import static javafx.application.Application.launch; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Polygon; 
import javafx.stage.Stage; 
import javafx.util.Duration; 
         
public class RotateTransitionExample extends Application { 
   @Override 
   public void start(Stage stage) {      
      //Creating a hexagon 
      Polygon hexagon = new Polygon();        
      
      //Adding coordinates to the hexagon 
      hexagon.getPoints().addAll(new Double[]{        
         200.0, 50.0, 
         400.0, 50.0, 
         450.0, 150.0,          
         400.0, 250.0, 
         200.0, 250.0,                   
         150.0, 150.0, 
      }); 
      //Setting the fill color for the hexagon 
      hexagon.setFill(Color.BLUE); 
       
      //Creating a rotate transition    
      RotateTransition rotateTransition = new RotateTransition(); 
      
      //Setting the duration for the transition 
      rotateTransition.setDuration(Duration.millis(1000)); 
      
      //Setting the node for the transition 
      rotateTransition.setNode(hexagon);       
      
      //Setting the angle of the rotation 
      rotateTransition.setByAngle(360); 
      
      //Setting the cycle count for the transition 
      rotateTransition.setCycleCount(50); 
      
      //Setting auto reverse value to false 
      rotateTransition.setAutoReverse(false); 
      
      //Playing the animation 
      rotateTransition.play(); 
         
      //Creating a Group object   
      Group root = new Group(hexagon); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);   
      
      //Setting title to the Stage 
      stage.setTitle("Rotate transition example "); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }      
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

javac RotateTransitionExample.java 
java RotateTransitionExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như hình dưới đây.

Chuyển đổi quy mô

Sau đây là chương trình thể hiện Chuyển đổi quy mô trong JavaFX. Lưu mã này trong một tệp có tênScaleTransitionExample.java.

import javafx.animation.ScaleTransition; 
import javafx.application.Application; 
import static javafx.application.Application.launch; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Circle; 
import javafx.stage.Stage; 
import javafx.util.Duration; 
         
public class ScaleTransitionExample extends Application {  
   @Override 
   public void start(Stage stage) {      
      //Drawing a Circle 
      Circle circle = new Circle(); 
      
      //Setting the position of the circle 
      circle.setCenterX(300.0f); 
      circle.setCenterY(135.0f); 
      
      //Setting the radius of the circle 
      circle.setRadius(50.0f); 
      
      //Setting the color of the circle 
      circle.setFill(Color.BROWN); 
      
      //Setting the stroke width of the circle 
      circle.setStrokeWidth(20); 
       
      //Creating scale Transition 
      ScaleTransition scaleTransition = new ScaleTransition(); 
      
      //Setting the duration for the transition 
      scaleTransition.setDuration(Duration.millis(1000)); 
      
      //Setting the node for the transition 
      scaleTransition.setNode(circle); 
      
      //Setting the dimensions for scaling 
      scaleTransition.setByY(1.5); 
      scaleTransition.setByX(1.5); 
      
      //Setting the cycle count for the translation 
      scaleTransition.setCycleCount(50); 
      
      //Setting auto reverse value to true 
      scaleTransition.setAutoReverse(false); 
      
      //Playing the animation 
      scaleTransition.play(); 
         
      //Creating a Group object  
      Group root = new Group(circle); 
         
      //Creating a scene object  
      Scene scene = new Scene(root, 600, 300); 
      
      //Setting title to the Stage 
      stage.setTitle("Scale transition example"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }      
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

javac ScaleTransitionExample.java 
java ScaleTransitionExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như hình dưới đây.

Dịch chuyển đổi

Sau đây là chương trình minh họa Chuyển đổi dịch trong JavaFX. Lưu mã này trong một tệp có tênTranslateTransitionExample.java.

import javafx.animation.TranslateTransition; 
import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Circle; 
import javafx.stage.Stage; 
import javafx.util.Duration; 
         
public class TranslateTransitionExample extends Application { 
   @Override 
   public void start(Stage stage) {  
      //Drawing a Circle 
      Circle circle = new Circle(); 
      
      //Setting the position of the circle 
      circle.setCenterX(150.0f); 
      circle.setCenterY(135.0f); 
      
      //Setting the radius of the circle 
      circle.setRadius(100.0f); 
      
      //Setting the color of the circle 
      circle.setFill(Color.BROWN); 
      
      //Setting the stroke width of the circle 
      circle.setStrokeWidth(20); 
       
      //Creating Translate Transition 
      TranslateTransition translateTransition = new TranslateTransition(); 
      
      //Setting the duration of the transition  
      translateTransition.setDuration(Duration.millis(1000)); 
      
      //Setting the node for the transition 
      translateTransition.setNode(circle); 
      
      //Setting the value of the transition along the x axis. 
      translateTransition.setByX(300); 
      
      //Setting the cycle count for the transition 
      translateTransition.setCycleCount(50); 
      
      //Setting auto reverse value to false 
      translateTransition.setAutoReverse(false); 
      
      //Playing the animation 
      translateTransition.play(); 
         
      //Creating a Group object  
      Group root = new Group(circle); 
         
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage 
      stage.setTitle("Translate transition example"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }      
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Biên dịch và thực thi tệp java đã lưu từ dấu nhắc lệnh bằng các lệnh sau.

javac TranslateTransitionExample.java 
java TranslateTransitionExample

Khi thực thi, chương trình trên tạo một cửa sổ JavaFX như hình dưới đây.

Ngoài những điều này, JavaFX cung cấp các lớp để áp dụng nhiều chuyển tiếp hơn trên các nút. Sau đây là các loại chuyển đổi khác được hỗ trợ bởi JavaFX.

  • Các chuyển đổi ảnh hưởng đến các thuộc tính của các nút Fade, Fill, Stroke

  • Chuyển đổi bao gồm nhiều hơn một chuyển đổi cơ bản Tuần tự, Song song, Tạm dừng

  • Chuyển đổi dịch đối tượng dọc theo đường dẫn được chỉ định Chuyển đổi đường dẫn