Javafx continuously rotate object using mouse drag to accelerate - animation

Question

I have a project i'm trying to develop controls for. I need to be able to continuously rotate the object from a single mouse click and drag and release. After releasing I wish the object to continue rotating from its initial point to the position where i released the mouse.(provided the object has not already reached this position.) I've seen applications previously that worked in this manner and I cant seem to find any code online to show how that was implemented. I am using this below code to test my mouse controls before adding them to my project. It contains simple drag and release mechanics already. However I would appreciate some input as to how to go about adding the continuous rotation. I want the mouse to be able to control the speed of the rotation of the object along any axis. As i have it set up it rotates along any axis. But I would like a drag to instead of rotate the object, cause the object to spin(recursively rotate) at a velocity proportional to distance the mouse was dragged. This would increase velocity as distance increased. If I drag the same direction twice the same distance, the velocity should double, the object then rotating twice as fast.
package javafxapplication3;
import javafx.application.Application;
import static javafx.application.Application.launch;
import javafx.geometry.Point3D;
import javafx.scene.DepthTest;
import javafx.scene.Group;
import javafx.scene.PerspectiveCamera;
import javafx.scene.Scene;
import javafx.scene.input.MouseEvent;
import javafx.scene.paint.Color;
import javafx.scene.paint.PhongMaterial;
import javafx.scene.shape.Box;
import javafx.scene.shape.Sphere;
import javafx.scene.transform.Rotate;
import javafx.scene.transform.Transform;
import javafx.scene.transform.Translate;
import javafx.stage.Stage;
public class trafo extends Application {
final Group root = new Group();
final XformWorld world = new XformWorld();
final PerspectiveCamera camera = new PerspectiveCamera(true);
final XformCamera cameraXform = new XformCamera();
private static final double CAMERA_INITIAL_DISTANCE = -1000;
private static final double CAMERA_NEAR_CLIP = 0.1;
private static final double CAMERA_FAR_CLIP = 10000.0;
double mousePosX, mousePosY, mouseOldX, mouseOldY, mouseDeltaX, mouseDeltaY;
double mouseFactorX, mouseFactorY;
#Override
public void start(Stage primaryStage) {
root.getChildren().add(world);
root.setDepthTest(DepthTest.ENABLE);
buildCamera();
buildBodySystem();
Scene scene = new Scene(root, 800, 600, true);
scene.setFill(Color.GREY);
handleMouse(scene);
primaryStage.setTitle("TrafoTest");
primaryStage.setScene(scene);
primaryStage.show();
scene.setCamera(camera);
mouseFactorX = 180.0 / scene.getWidth();
mouseFactorY = 180.0 / scene.getHeight();
}
private void buildCamera() {
root.getChildren().add(cameraXform);
cameraXform.getChildren().add(camera);
camera.setNearClip(CAMERA_NEAR_CLIP);
camera.setFarClip(CAMERA_FAR_CLIP);
camera.setTranslateZ(CAMERA_INITIAL_DISTANCE);
}
private void buildBodySystem() {
PhongMaterial whiteMaterial = new PhongMaterial();
whiteMaterial.setDiffuseColor(Color.WHITE);
whiteMaterial.setSpecularColor(Color.LIGHTBLUE);
Box box = new Box(400, 200, 100);
box.setMaterial(whiteMaterial);
PhongMaterial redMaterial = new PhongMaterial();
redMaterial.setDiffuseColor(Color.DARKRED);
redMaterial.setSpecularColor(Color.RED);
Sphere sphere = new Sphere(5);
sphere.setMaterial(redMaterial);
sphere.setTranslateX(200.0);
sphere.setTranslateY(-100.0);
sphere.setTranslateZ(-50.0);
world.getChildren().addAll(box);
world.getChildren().addAll(sphere);
}
private void handleMouse(Scene scene) {
scene.setOnMousePressed((MouseEvent me) -> {
mousePosX = me.getSceneX();
mousePosY = me.getSceneY();
mouseOldX = me.getSceneX();
mouseOldY = me.getSceneY();
});
scene.setOnMouseDragged((MouseEvent me) -> {
mouseOldX = mousePosX;
mouseOldY = mousePosY;
mousePosX = me.getSceneX();
mousePosY = me.getSceneY();
mouseDeltaX = (mousePosX - mouseOldX);
mouseDeltaY = (mousePosY - mouseOldY);
if (me.isPrimaryButtonDown()) {
cameraXform.ry(mouseDeltaX * 180.0 / scene.getWidth());
cameraXform.rx(-mouseDeltaY * 180.0 / scene.getHeight());
} else if (me.isSecondaryButtonDown()) {
camera.setTranslateZ(camera.getTranslateZ() + mouseDeltaY);
}
});
}
public static void main(String[] args) {
launch(args);
}
}
class XformWorld extends Group {
final Translate t = new Translate(0.0, 0.0, 0.0);
final Rotate rx = new Rotate(0, 0, 0, 0, Rotate.X_AXIS);
final Rotate ry = new Rotate(0, 0, 0, 0, Rotate.Y_AXIS);
final Rotate rz = new Rotate(0, 0, 0, 0, Rotate.Z_AXIS);
public XformWorld() {
super();
this.getTransforms().addAll(t, rx, ry, rz);
}
}
class XformCamera extends Group {
Point3D px = new Point3D(1.0, 0.0, 0.0);
Point3D py = new Point3D(0.0, 1.0, 0.0);
Rotate r;
Transform t = new Rotate();
public XformCamera() {
super();
}
public void rx(double angle) {
r = new Rotate(angle, px);
this.t = t.createConcatenation(r);
this.getTransforms().clear();
this.getTransforms().addAll(t);
}
public void ry(double angle) {
r = new Rotate(angle, py);
this.t = t.createConcatenation(r);
this.getTransforms().clear();
this.getTransforms().addAll(t);
}
}

Answer 1

So the way I see it, you want to calculate the arc that the drag made from the middle of the object that you want to rotate, and rotate the whenever that object is not rotated correctly, it will rotate at a constants speed until it reaches the desired rotation. I've never done something like that, so I don't know if my answer will actually work, but I can at least try, because I think I know the solution. Now the code below may or may not work, please tell me if anything is not correct, I'll try to fix it.
public class RotationNode extends Pane {
double startMouseAngle, goalAngle = 0.0, angleBeforeRotation;
boolean currentlyRotating = false;
public RotationNode(double angle) {
//Parameter angle is to give this Pane a start angle if you want to
super();
//This can all change to whatever you want it to be
setTranslateX(400.0);
setTranslateY(200.0);
setPrefSize(100.0, 100.0);
setRotationAxis(new Point3D(0.0, 0.0, 360.0));
//This is just to show something is actually rotating
Rectangle r = new Rectangle(0, 0, 100, 100);
r.setFill(Color.BLUE);
getChildren().add(r);
setRotate(angle);
angleBeforeRotation = 0.0;
addEventHandler(MouseEvent.MOUSE_PRESSED, ov -> {
if(ov.getButton() == MouseButton.PRIMARY) {
double x = ov.getX();
double y = ov.getY();
startMouseAngle = Math.toDegrees(Math.atan2(x, y));
angleBeforeRotation = currentlyRotating ? goalAngle : getRotate();
ov.consume();
}
});
addEventHandler(MouseEvent.MOUSE_DRAGGED, ov -> {
if(ov.getButton() == MouseButton.PRIMARY) {
double x = ov.getX();
double y = ov.getY();
double a = Math.toDegrees(Math.atan2(x, y));
double deltaAngle = startMouseAngle - a;
goalAngle = angleBeforeRotation + deltaAngle;
if(!currentlyRotating) {
new changeRotation();
}
ov.consume();
}
});
}
private class changeRotation {
private final long TIME_STEP = 25;
private final double ANGLE_PER_SECOND = 90;
public changeRotation() {
final ScheduledExecutorService service = Executors.newSingleThreadScheduledExecutor();
Runnable changeWidthCmd = () -> {
double rotationDelta = ANGLE_PER_SECOND / (1000.0 / TIME_STEP);
rotationDelta *= getRotate() > goalAngle ? -1 : 1;
setRotate(getRotate() + rotationDelta);
if(getRotate() - goalAngle < ANGLE_PER_SECOND / (1000.0 / TIME_STEP) && getRotate() - goalAngle > -ANGLE_PER_SECOND / (1000.0 / TIME_STEP)) {
setRotate(goalAngle);
currentlyRotating = false;
service.shutdown();
}
};
currentlyRotating = true;
service.scheduleAtFixedRate(changeWidthCmd, 0, TIME_STEP, TimeUnit.MILLISECONDS);
}
}
}
I hope this helps you,
Lenardjee
EDIT :
Updated the code, it now works kind of. The rotation based on mouse drag works, but the centre point is weird and doesn't work that well. I will try try to improve this and update this answer
IMPORTANT EDIT :
I forgot to mention that this answer contains code that uses an external library. To add it, add this to the projects pom file:
<dependencies>
<dependency>
<groupId>io.reactivex.rxjava2</groupId>
<artifactId>rxjava</artifactId>
<version>2.1.14</version>
</dependency>
</dependencies>
or download the library fromhttps://jar-download.com/?detail_search=g%3A%22io.reactivex.rxjava2%22&g=io.reactivex.rxjava2&p=1and add that jar to the projects dependencies.