JavaFX rotate rectangle around its corner

Question

I just started working with JavaFX and have a question. In my project i want to use a rotating rectangle. But the rectangle only rotates about its center and i want it to rotate around its upper left corner.

Like in this picture (from here):

Here some code like in my project:

import javafx.animation.AnimationTimer;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.input.KeyCode;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.scene.shape.Rectangle;

import java.awt.*;
import java.awt.event.KeyEvent;
import java.util.*;

public class Main extends Application {
    @Override
    public void start(Stage stage) throws Exception {
        Group root = new Group();
        Scene scene = new Scene(root, 500, 500);

        //create rectangle
        Rectangle rect = new Rectangle(10, 10, 200, 15);
        rect.setTranslateX(250);
        rect.setTranslateY(250);
        rect.setFill(Color.BLACK);

        root.getChildren().add(rect);

        AnimationTimer timer = new AnimationTimer() {
            @Override
            public void handle(long now) {
                stage.getScene().setOnKeyPressed(e -> {
                    if (e.getCode() == KeyCode.LEFT) {
                        rect.setRotate(rect.getRotate()-5);     //<-- rotate rectangle here
                    } else if (e.getCode() == KeyCode.RIGHT){
                        rect.setRotate(rect.getRotate()+5);     //<-- rotate rectangle here
                    }
                });
            }
        };
        timer.start();

        stage.setScene(scene);
        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

In this case the rectangle rotates if the arrow keys are pressed.

Answer 1

You need to use Transform and Rotate specifically to rotate a node around a custom pivot.

//Create a Rotate Object
Rotate rotate = new Rotate();
rotate.setPivotX(node.getX()); //Pivot X Top-Left corner
rotate.setPivotY(node.getY()); //Pivot Y
rotate.setAngle(angle); //Angle degrees

//Add the transform to the node
node.getTransforms().add(rotate);

In your code

final Rotate rotate = new Rotate();
rect.getTransforms().add(rotate);

AnimationTimer timer = new AnimationTimer() {
    @Override
    public void handle(long now) {
        stage.getScene().setOnKeyPressed(e -> {
           rotate.setPivotX(rect.getX());
           rotate.setPivotY(rect.getY());
           if (e.getCode() == KeyCode.LEFT) {
               rotate.setAngle(rotate.getAngle() - 5);
           } else if (e.getCode() == KeyCode.RIGHT){
               rotate.setAngle(rotate.getAngle() + 5);
           }
        });
    }
};