当我在 JavaFX 中拖动鼠标时圆圈不可见

Question

我正在用 JavaFX 创建一个小的绘图程序，并且有一个圆形创建工具。目前，我可以正确地绘制圆，但与我的其他工具不同，我看不到正在创建的圆（即，当我拖动鼠标时）。只有当我松开鼠标时，我才能看到圆圈（以正确的尺寸绘制）。我尝试在拖动时添加 strokeOval() 方法，但它创建了一个奇怪的 "teardrop" 类圆圈。我什么都试过了 - 谁能帮忙？

这是我的代码：

public CircleController(Canvas canvas, Scene mainScene, BorderPane borderPane) {

    this.borderPane = borderPane;
    this.mainScene = mainScene;
    this.graphicsContext = canvas.getGraphicsContext2D();

    circle = new Circle();
    circle.setStrokeWidth(1.0);
    circle.setFill(Color.WHITE);
    circle.setStroke(Color.BLACK);

    mousePressed = event -> {
        startingPosX = event.getX();
        startingPosY = event.getY();
        borderPane.getChildren().add(circle);

    };

    mouseReleased = event -> {
        borderPane.getChildren().remove(circle);
        double width = Math.abs(event.getX() - startingPosX);
        double height = Math.abs(event.getY() - startingPosY);
        graphicsContext.strokeOval(startingPosX, startingPosY, width, height);
        graphicsContext.setStroke(Color.BLACK);
        removeListeners();
    };

    mouseDragged = event -> {
        circle.setCenterX(event.getX() - startingPosX);
        circle.setCenterY(event.getY() - startingPosY);

    };
}

上面的代码正确地创建了圆圈，但是在我松开鼠标之前看不到。我将上述 EventHandlers 应用于我的场景：

@Override
public void handle(ActionEvent event) {
    mainScene.setOnMousePressed(mousePressed);
    mainScene.setOnMouseDragged(mouseDragged);
    mainScene.setOnMouseReleased(mouseReleased);
}

有人可以帮忙吗？

Answer 1

你画的是椭圆而不是圆形。 Circle class 无法适当地处理这个问题。你需要Ellipse。此外请注意，从手势开始拖动 up/left 会导致椭圆形的奇怪行为，因为它总是绘制在坐标系的第一象限中，原点在拖动手势的开始。

下面的代码应该允许在每个象限中绘制椭圆并且还使用 Ellipse 作为 "preview":

// TODO: replace circle field with ellipse field of type Ellipse
ellipse = new Ellipse();
ellipse.setStrokeWidth(1.0);
ellipse.setFill(Color.TRANSPARENT);
ellipse.setStroke(Color.BLACK);

mousePressed = event -> {
    startingPosX = event.getX();
    startingPosY = event.getY();
    ellipse.setCenterX(startingPosX);
    ellipse.setCenterY(startingPosY);
    ellipse.setRadiusX(0);
    ellipse.setRadiusY(0);
    borderPane.getChildren().add(ellipse);
};

mouseReleased = event -> {
    borderPane.getChildren().remove(ellipse);
    double width = Math.abs(event.getX() - startingPosX);
    double height = Math.abs(event.getY() - startingPosY);
    graphicsContext.setStroke(Color.BLACK);
    graphicsContext.strokeOval(Math.min(startingPosX, event.getX()), Math.min(startingPosY, event.getY()), width, height);
    removeListeners();
};

mouseDragged = event -> {
    ellipse.setCenterX((event.getX() + startingPosX) / 2);
    ellipse.setCenterY((event.getY() + startingPosY) / 2);
    ellipse.setRadiusX(Math.abs((event.getX() - startingPosX) / 2));
    ellipse.setRadiusY(Math.abs((event.getY() - startingPosY) / 2));
};

当我在 JavaFX 中拖动鼠标时圆圈不可见

Circle not visible as I drag the mouse in JavaFX

java

javafx

javafx-2

javafx-8