90. Translate + Rotate

A node can undergo multiple transformations. Here we first translate and then rotate.

The three rectangles of different colors are at the same location and with the same size. The green one is moved right and then rotated by 45. The blue one is moved down and then rotated by 45.

---

package ex90;

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.transform.Rotate;
import javafx.scene.transform.Translate;
import javafx.stage.Stage;

public class Ex90 extends Application {
    public static void main(String[] args) {
        Application.launch(args);
    }

    @Override
    public void start(Stage stage) {
        Rectangle rect1 = new Rectangle(50, 50, 100, 50);
        rect1.setFill(Color.rgb(255, 0, 0));

        Rectangle rect2 = new Rectangle(50, 50, 100, 50);
        rect2.setFill(Color.rgb(0, 255, 0));
        
        Rectangle rect3 = new Rectangle(50, 50, 100, 50);
        rect3.setFill(Color.rgb(0, 0, 255));
        
        Translate translateX = new Translate(150,0);
        Translate translateY = new Translate(0,150);
        Rotate rotate = new Rotate(45, 50, 75);
        
        rect2.getTransforms().addAll(translateX, rotate);
        rect3.getTransforms().addAll(translateY, rotate);
        
        Group root = new Group(rect1, rect2, rect3);
        Scene scene = new Scene(root, 350, 400, Color.GAINSBORO);
        
        stage.setScene(scene);
        stage.setTitle("Example 90. Translate + Rotate");
        stage.show();
    }
}

---

This is the output:

---