单击按钮时将动画设置为反向移动并显示类中的形状

Question

我正在开发一个 javafx 程序来创建三个按钮，它们是“圆形”、“椭圆”和“反向”。圆形按钮是程序运行时首先显示的东西，反向按钮应该与矩形围绕圆形的移动相对应。我无法让反向按钮工作，我将 autoReverse 设置为 true 但它没有做任何事情。我对代码的第二个问题是，当单击椭圆按钮时，MyEllipse 类没有像预期的那样显示椭圆形状，也没有从窗格中删除圆形动画。我试图在 EventHandler 中为按钮椭圆创建一个新窗格，但我认为这不是正确的方法。对于这两个问题的任何帮助将不胜感激。

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.animation.PathTransition;
import javafx.scene.paint.Color;
import javafx.animation.Timeline;
import javafx.scene.shape.Circle;
import javafx.util.Duration;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Ellipse;
import javafx.scene.control.Button;
import javafx.event.ActionEvent;
import javafx.scene.layout.HBox;
import javafx.event.EventHandler;
import javafx.stage.Stage;
public class exam3b extends Application {
  @Override 
  public void start(Stage primaryStage) {      
Rectangle rectangle = new Rectangle (0, 0, 25, 50);
rectangle.setFill(Color.ORANGE);

Circle circle = new Circle(115, 90, 45);
circle.setFill(Color.WHITE);
circle.setStroke(Color.BLACK);

PathTransition pt = new PathTransition();
pt.setDuration(Duration.millis(4000));
pt.setPath(circle);
pt.setNode(rectangle);
pt.setOrientation(
PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
pt.setCycleCount(Timeline.INDEFINITE);
pt.setAutoReverse(false);
pt.play();

circle.setOnMousePressed(e -> pt.pause());
circle.setOnMouseReleased(e -> pt.play());

HBox panel = new HBox(10);
panel.setAlignment(Pos.BOTTOM_CENTER);
Button button = new Button("Circle");
Button buttonellipse = new Button("Ellipse");
Button reverse = new Button("Reverse");
panel.getChildren().addAll(button,buttonellipse,reverse);

button.setOnAction(new EventHandler<ActionEvent>()
{
    @Override
    public void handle(ActionEvent e)
    {
        reverse.setVisible(true);
    }
});

reverse.setOnAction(new EventHandler<ActionEvent>() //supposed to make rectangle move in reverse direction
{
    @Override
    public void handle(ActionEvent e)
    {
        pt.setAutoReverse(true);
    }
});

buttonellipse.setOnAction(new EventHandler<ActionEvent>() //button to make ellipse appear from class MyEllipse, reverse button is supposed to disappear
{
    @Override
    public void handle(ActionEvent e)
    {
        reverse.setVisible(false);
        Pane ellipse = new Pane();
        ellipse.getChildren().add(new MyEllipse());
    }
});

Pane pane = new Pane();
pane.getChildren().addAll(panel,circle,rectangle);

Scene scene = new Scene(pane, 350, 250);
primaryStage.setTitle("exam3b"); 
primaryStage.setScene(scene); 
primaryStage.show(); 
  }

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

 class MyEllipse extends Pane 
{
  private void paint() {
getChildren().clear();
for (int i = 0; i < 16; i++) {
  Ellipse e1 = new Ellipse(getWidth() / 2, getHeight() / 2, 
    getWidth() / 2 - 50, getHeight() / 2 - 50);
  e1.setStroke(Color.color(Math.random(), Math.random(),
    Math.random()));
  e1.setFill(Color.WHITE);
  e1.setRotate(i * 180 / 16);
  getChildren().add(e1);
    }
  }

  @Override
  public void setWidth(double width) {
super.setWidth(width);
paint();
  }

  @Override
  public void setHeight(double height) {
super.setHeight(height);
paint();
  }
} 

Answer 1

您在使用 MyEllipse 时遇到了问题，因为您从未将它添加到根窗格中，也没有设置宽度/高度（这会导致调用您的绘制方法）。我将您的根窗格重命名为“根”。创建了一个“MyEllipse”实例，并在“Ellipse”按钮中将“MyEllipse”实例添加到根窗格中。

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.animation.PathTransition;
import javafx.scene.paint.Color;
import javafx.animation.Timeline;
import javafx.scene.shape.Circle;
import javafx.util.Duration;
import javafx.scene.shape.Rectangle;
import javafx.scene.shape.Ellipse;
import javafx.scene.control.Button;
import javafx.event.ActionEvent;
import javafx.scene.layout.HBox;
import javafx.event.EventHandler;
import javafx.stage.Stage;

public class exam3b extends Application {

    @Override
    public void start(Stage primaryStage) {
        Rectangle rectangle = new Rectangle(0, 0, 25, 50);
        rectangle.setFill(Color.ORANGE);

        Circle circle = new Circle(115, 90, 45);
        circle.setFill(Color.WHITE);
        circle.setStroke(Color.BLACK);

        PathTransition pt = new PathTransition();
        pt.setDuration(Duration.millis(4000));
        pt.setPath(circle);
        pt.setNode(rectangle);
        pt.setOrientation(
                PathTransition.OrientationType.ORTHOGONAL_TO_TANGENT);
        pt.setCycleCount(Timeline.INDEFINITE);
        pt.setAutoReverse(true);
        pt.play();

        circle.setOnMousePressed(e -> pt.pause());
        circle.setOnMouseReleased(e -> pt.play());

        HBox panel = new HBox(10);
        panel.setAlignment(Pos.BOTTOM_CENTER);
        Button button = new Button("Circle");
        Button buttonellipse = new Button("Ellipse");
        Button reverse = new Button("Reverse");
        panel.getChildren().addAll(button, buttonellipse, reverse);

        button.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent e) {
                reverse.setVisible(true);
            }
        });

        reverse.setOnAction(new EventHandler<ActionEvent>() //supposed to make rectangle move in reverse direction
        {
            @Override
            public void handle(ActionEvent e) {
                pt.setAutoReverse(true);
            }
        });

        Pane root = new Pane();
        MyEllipse myEllipse = new MyEllipse();
        myEllipse.setWidth(200);
        myEllipse.setHeight(400);
        buttonellipse.setOnAction(new EventHandler<ActionEvent>() //button to make ellipse appear from class MyEllipse, reverse button is supposed to disappear
        {
            @Override
            public void handle(ActionEvent e) {
//                reverse.setVisible(false);
                if (root.getChildren().contains(myEllipse)) {
                    root.getChildren().remove(myEllipse);
                } else {
                    System.out.println("adding ellipse");
                    root.getChildren().add(myEllipse);
                }
            }
        });

        root.getChildren().addAll(panel, circle, rectangle);

        Scene scene = new Scene(root, 350, 250);
        primaryStage.setTitle("exam3b");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

class MyEllipse extends Pane {


    public MyEllipse() {
    }

    private void paint() {
        getChildren().clear();
        for (int i = 0; i < 16; i++) {
            Ellipse e1 = new Ellipse(getWidth() / 2, getHeight() / 2,
                    getWidth() / 2 - 50, getHeight() / 2 - 50);
            e1.setStroke(Color.color(Math.random(), Math.random(),
                    Math.random()));
            e1.setFill(Color.WHITE);
            e1.setStrokeWidth(1);
            e1.setRotate(i * 180 / 16);
            getChildren().add(e1);
        }
    }

    @Override
    public void setWidth(double width) {
        super.setWidth(width);
        paint();
    }

    @Override
    public void setHeight(double height) {
        super.setHeight(height);
        paint();
    }
}