JavaFX - Animazioni
In generale, animare un oggetto implica creare l'illusione del suo movimento mediante una visualizzazione rapida. In JavaFX, un nodo può essere animato modificandone la proprietà nel tempo. JavaFX fornisce un pacchetto denominatojavafx.animation. Questo pacchetto contiene classi utilizzate per animare i nodi. L'animazione è la classe base di tutte queste classi.
Utilizzando JavaFX, puoi applicare animazioni (transizioni) come Fade Transition, Fill Transition, Rotate Transition, Scale Transition, Stroke Transition, Translate Transition, Path Transition, Sequential Transition, Pause Transition, Parallel Transition, eccetera.
Tutte queste transizioni sono rappresentate da singole classi nel pacchetto javafx.animation.
Per applicare una particolare animazione a un nodo, devi seguire i passaggi indicati di seguito:
Crea un nodo richiesto utilizzando la rispettiva classe.
Istanziare la rispettiva classe di transizione (animazione) che deve essere applicata
Imposta le proprietà della transizione e
Infine riproduci la transizione usando il play() metodo del Animation classe.
In questo capitolo discuteremo esempi di transizioni di base (rotazione, scala, traslazione).
Ruota transizione
Di seguito è riportato il programma che mostra Rotate Transition in JavaFX. Salva questo codice in un file con il nomeRotateTransitionExample.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);
}
}
Compilare ed eseguire il file java salvato dal prompt dei comandi utilizzando i seguenti comandi.
javac RotateTransitionExample.java
java RotateTransitionExample
All'esecuzione, il programma di cui sopra genera una finestra JavaFX come mostrato di seguito.
Transizione di scala
Di seguito è riportato il programma che mostra Scale Transition in JavaFX. Salva questo codice in un file con il nomeScaleTransitionExample.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);
}
}
Compilare ed eseguire il file java salvato dal prompt dei comandi utilizzando i seguenti comandi.
javac ScaleTransitionExample.java
java ScaleTransitionExample
All'esecuzione, il programma di cui sopra genera una finestra JavaFX come mostrato di seguito.
Traduci transizione
Di seguito è riportato il programma che mostra Translate Transition in JavaFX. Salva questo codice in un file con il nomeTranslateTransitionExample.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);
}
}
Compilare ed eseguire il file java salvato dal prompt dei comandi utilizzando i seguenti comandi.
javac TranslateTransitionExample.java
java TranslateTransitionExample
All'esecuzione, il programma di cui sopra genera una finestra JavaFX come mostrato di seguito.
Oltre a questi, JavaFX fornisce classi per applicare più transizioni sui nodi. I seguenti sono gli altri tipi di transizioni supportati da JavaFX.
Transizioni che influenzano gli attributi dei nodi Fade, Fill, Stroke
Transizione che coinvolge più di una transizione di base Sequenziale, Parallela, Pausa
Transizione che trasporta l'oggetto lungo il percorso specificato Path Transition