We Keep Coding

Fan Orientation Animation Javafx

import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.shape.ArcType;
import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.shape.Arc;
import javafx.scene.paint.Color;
import javafx.scene.control.Button;
import javafx.scene.Group;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.animation.PathTransition;
import javafx.util.Duration;
import javafx.scene.shape.Ellipse;
public class MovingFourFans extends Application
{
private Button btPause = new Button("Pause");
private Button btResume = new Button("Resume");
private Button btReverse = new Button("Reverse");
private Circle fanPanel;
private Ellipse fanPath;
private Arc fan1;
private Arc fan2;
private Arc fan3;
private Arc fan4;
private BorderPane uiContainer;
private HBox buttonContainer;
private PathTransition pt = new PathTransition();
#Override
public void start(Stage primaryStage)
{
BorderPane pane = new BorderPane();
Scene scene = new Scene(pane, 400, 500);
buttonContainer = new HBox(btPause, btResume, btReverse);
buttonContainer.setAlignment(Pos.CENTER);
Group group = new Group();
pane.setCenter(group);
pane.setBottom(buttonContainer);
// include a path transition with a circle inside instead
fanPanel = new Circle(Math.min(pane.getWidth(), pane.getHeight()) / 4);
fanPanel.setFill(Color.WHITE);
fanPanel.setStroke(Color.BLACK);
fanPath = new Ellipse(fanPanel.getRadius() / 100, fanPanel.getRadius() / 100);
fanPath.setVisible(true);
fanPath.setFill(Color.WHITE);
fanPath.setStroke(Color.BLACK);
fan1 = new Arc();
fan1.setType(ArcType.ROUND);
fan1.setRadiusX(fanPanel.getRadius() - 10);
fan1.setRadiusY(fanPanel.getRadius() - 10);
fan1.setStartAngle(80);
fan1.setLength(-10);
fan1.setFill(Color.RED);
group.getChildren().addAll(fanPanel, fanPath, fan1);
pt.setPath(fanPath);
pt.setNode(fan1);
pt.setCycleCount(Timeline.INDEFINITE);
pt.setOrientation(PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
pt.setDuration(Duration.seconds(3));
pt.setAutoReverse(false);
pt.play();
btPause.setOnAction(e -> pt.pause());
btResume.setOnAction(e -> pt.play());
primaryStage.setTitle("Control Moving Fan");
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args)
{
Application.launch(args);
}
}
I'm having a problem trying to create an animation of a fan with four wings with Javafx. I know how to make the buttons work but for the animation every time I start it, the fans moving along the circle path that I created with its middle section not the tip of the section. Because of this the animation doesn't look correct. Does anyone know a fix to this or what method I can use to create the correct animation for this? In this code I only made one wing for test and there are 3 wings left. The screenshot for what I currently have is below.

JavaFX: position text inside Group at the bottom of shape

I have simple code that draws a circle and prints Hello World! text. Currently the text is inside the circle, while I want it to be below it. Both circle and text are inside a Group.
import javafx.application.Application;
import javafx.geometry.Orientation;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.ScrollPane;
import javafx.scene.layout.FlowPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Arc;
import javafx.scene.shape.ArcType;
import javafx.scene.shape.Circle;
import javafx.scene.text.Text;
import javafx.stage.Stage;
public class CircleArc extends Application {
#Override
public void start(Stage applicationStage) {
ScrollPane scrollPane = new ScrollPane();
scrollPane.setFitToWidth(true);
FlowPane flowPane = new FlowPane();
flowPane.setOrientation(Orientation.HORIZONTAL);
Circle circle = new Circle(100);
circle.setFill(Color.GREEN);
double rate = 0.6;
Arc arc = new Arc(0, 0, 100, 100,
0, -360*rate);
arc.setType(ArcType.ROUND);
arc.setFill(Color.GRAY);
Text text = new Text("Hello World!");
text.setLayoutX(text.getLayoutX() / 2);
text.setLayoutY(text.getLayoutY());
Group group = new Group();
group.getChildren().add(circle);
group.getChildren().add(arc);
group.getChildren().add(text);
flowPane.getChildren().add(group);
scrollPane.setContent(flowPane);
Scene scene = new Scene(scrollPane);
applicationStage.setScene(scene);
applicationStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
It currently looks like this:
However I want it to look like this:
I tried using the setLayout methods but they didn't work.
EDIT:
Turned out the simple
text.setLayoutX(text.getLayoutX() - 50);
text.setLayoutY(text.getLayoutY() + 120);
worked well enough.

Use a Label. Set the circle as the graphic, position the text underneath.
public class Main extends Application {
public static void main(String[] args) {
launch(args);
}
#Override
public void start(Stage stage) {
stage.setTitle("Centered Text Under Graphic");
Circle circle = new Circle(100);
circle.setFill(Color.GREEN);
double rate = 0.6;
Arc arc = new Arc(0, 0, 100, 100,
0, -360 * rate);
arc.setType(ArcType.ROUND);
arc.setFill(Color.GRAY);
Group circles = new Group(circle, arc);
Label label = new Label("Hello World!", circles);
label.setContentDisplay(ContentDisplay.TOP);
Pane p = new Pane(label);
Scene scene = new Scene(p);
stage.setScene(scene);
stage.show();
}
}
That will handle keeping the text centered if it changes.

JAVA FX - TimeLine Animation (Find certain x,y point during animation)

In this program, I am trying to make rect turn red when x== 600 in the for-loop. What basically happens is that the for-loop runs faster than the animation on the screen. The rectangle ends up turning red before it actually hits that certain point within the JavaFX screen.
What I would like it to do it that when it hits point x,y:(600,500), make the blue rectangle turn red.
import java.util.logging.Level;
import java.util.logging.Logger;
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;
import javafx.util.Duration;
/**
*
* #author Owner
*/
public class TestPoint extends Application {
#Override
public void start(Stage primaryStage) {
Pane root = new Pane();
Scene scene = new Scene(root, 1000, 1000);
Rectangle rect = new Rectangle();
Rectangle rectTwo = new Rectangle();
//Obstacle that other square must hit
rectTwo.setWidth(100);
rectTwo.setHeight(100);
rectTwo.setX(500);
rectTwo.setY(500);
rectTwo.setFill(Color.PINK);
//for loop that causes the animation to properly move
for (int x = 800; x >= 0; x--) {
rect.setWidth(100);
rect.setHeight(100);
rect.setX(800);
rect.setY(500);
rect.setFill(Color.BLUE);
Timeline timeline = new Timeline();
timeline.setCycleCount(1);
timeline.setAutoReverse(true);
final KeyValue kv = new KeyValue(rect.xProperty(), x);
final KeyFrame kf = new KeyFrame(Duration.seconds(8), kv);
timeline.getKeyFrames().add(kf);
timeline.play();
//if it hits the point of rectTwo, change to Color.RED
System.out.println(x);
if (x == 600) {
rect.setFill(Color.RED);
break;//end
}
}
root.getChildren().addAll(rect, rectTwo);
primaryStage.setTitle("Hello World!");
primaryStage.setScene(scene);
primaryStage.show();
}
/**
* #param args the command line arguments
*/
public static void main(String[] args) {
launch(args);
}
}

You misunderstood, how Timeline works. Your code creates 201 Timeline animations running in parallel. The loop is done before the window is shown. Any updates are automatically triggered by JavaFX later.
Specifying the initial state and the target state via KeyFrames is sufficient. KeyFrames allow you to specify a handler to be executed at a specific time; this can be used to change the color. Alternatively the onFinished handler could be used for coloring the Rectangle.
rect.setWidth(100);
rect.setHeight(100);
rect.setY(500);
rect.setFill(Color.BLUE);
Timeline timeline = new Timeline(
new KeyFrame(Duration.ZERO, new KeyValue(rect.xProperty(), 800)),
new KeyFrame(Duration.seconds(8),
evt -> rect.setFill(Color.RED),
new KeyValue(rect.xProperty(), 600)));
timeline.play();

How should I proceed in making my player rectangle jump?

I'm just looking to make my red rectangle jump up when you press that jump button. I can't really seem to find any thing like an animation or even a go up, wait a certain amount of time and then come back down.
import javafx.scene.Scene;
import javafx.stage.Stage;
import javafx.scene.paint.Color;
import javafx.application.Application;
import javafx.scene.*;
import javafx.scene.control.Button;
import javafx.event.EventHandler;
import javafx.event.ActionEvent;
import javafx.animation.PathTransition;
import javafx.scene.shape.*;
import javafx.util.Duration;
public class GUIPractice extends Application{
public static void main (String [] args)
{
launch(args);
}
public void start (Stage primaryStage)
{
Rectangle screen = new Rectangle(20, 20, 986, 500);
Button JumpBtn = new Button("Jump");
JumpBtn.setLayoutX(410);
JumpBtn.setLayoutY(530);
JumpBtn.setMinWidth(200);
JumpBtn.setMinHeight(100);
Rectangle player = new Rectangle(450, 420, 50, 100);
player.setFill(Color.RED);
Path path = new Path();
I believe right here below is where the jumping would go but the only thing I could figure out is how to get the rectangle to move up on the screen and not move back down.
JumpBtn.setOnAction(new EventHandler<ActionEvent>()
{
public void handle(ActionEvent e) {
player.setTranslateY(-40);
}
});
Group root = new Group(screen, JumpBtn, player);
Scene scene = new Scene(root, 1024, 768);
scene.setFill(Color.GREY);
primaryStage.setTitle("GUIPractice");
primaryStage.setScene(scene);
primaryStage.show();
}
}

Use a animation such as timeline to move the Node, e.g.
double ty = player.getTranslateY();
// quadratic interpolation to simulate gravity
Interpolator interpolator = new Interpolator() {
#Override
protected double curve​(double t) {
return t * (2 - t);
}
};
Timeline timeline = new Timeline(new KeyFrame(Duration.ZERO,
new KeyValue(player.translateYProperty(), ty, interpolator)),
new KeyFrame(Duration.seconds(1),
new KeyValue(player.translateYProperty(), ty-40, interpolator)));
// play forward once, then play backward once
timeline.setCycleCount(2);
timeline.setAutoReverse(true);
JumpBtn.setDisable(true);
timeline.setOnFinished(evt -> JumpBtn.setDisable(false));
timeline.play();

RotateTransition around a pivot?

I am using RotateTransiton to rotate a line, but it seems to rotate through center of the line. I would like to rotate it with pivot as one end of the line. How to do this?

The RotateTransition works by changing the rotate property, which - as you have observed - defines a rotation around the center of the Node.
If you want to rotate around a different point, define a Rotate transform, set its pivot, add it to the line's list of transforms, and use a Timeline to manipulate its angle.
Here's an example:
import javafx.animation.Animation;
import javafx.animation.KeyFrame;
import javafx.animation.KeyValue;
import javafx.animation.Timeline;
import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.shape.Line;
import javafx.scene.transform.Rotate;
import javafx.stage.Stage;
import javafx.util.Duration;
public class RotateLineAboutEnd extends Application {
#Override
public void start(Stage primaryStage) {
Line line = new Line(200, 200, 200, 350);
Pane pane = new Pane(line);
Rotate rotation = new Rotate();
rotation.pivotXProperty().bind(line.startXProperty());
rotation.pivotYProperty().bind(line.startYProperty());
line.getTransforms().add(rotation);
Timeline timeline = new Timeline(
new KeyFrame(Duration.ZERO, new KeyValue(rotation.angleProperty(), 0)),
new KeyFrame(Duration.seconds(1), new KeyValue(rotation.angleProperty(), 360)));
Button button = new Button("Rotate");
button.setOnAction(evt -> timeline.play());
button.disableProperty().bind(timeline.statusProperty().isEqualTo(Animation.Status.RUNNING));
HBox controls = new HBox(button);
controls.setAlignment(Pos.CENTER);
controls.setPadding(new Insets(12));
BorderPane root = new BorderPane(pane, null, null, controls, null);
Scene scene = new Scene(root, 400, 400);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}

(on JavaFX 2.2 and JavaFX 8)
The best way in my opinion is translating the layoutBounds of the node (which contains the pivot point) and translating the node itself the opposite way.
An example:
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
Group root = new Group();
primaryStage.setScene(new Scene(root, 140, 140));
Rectangle rect = new Rectangle(1, 1, 40, 40);
// comment movePivot to get the default rotation
movePivot(rect, -20, -20);
RotateTransition rt = new RotateTransition(Duration.seconds(4),rect);
rt.setToAngle(720);
rt.setCycleCount(Timeline.INDEFINITE);
rt.setAutoReverse(true);
rt.play();
primaryStage.show();
}
// this is the function you want
private void movePivot(Node node, double x, double y){
node.getTransforms().add(new Translate(-x,-y));
node.setTranslateX(x); node.setTranslateY(y);
}
public static void main(String[] args) {
launch(args);
}
}