JavaFX:在画布上绘制一个矩形,只需单击 2 次鼠标

JavaFX: Draw a rectangle on canvas based on 2 mouse clicks

提问人:z3us 提问时间:12/31/2019 更新时间:1/2/2020 访问量:2307

问:

我正在尝试创建一个程序,它应该根据两次鼠标左键单击在画布上绘制一个矩形,并通过一次右键单击清除画布。

应以某种方式创建矩形,其中第一次鼠标单击模拟矩形的一个角,与第一次鼠标单击相比,下一次鼠标单击模拟矩形的对角线角。

我纠结于如何存储第一次鼠标单击的坐标,然后充分利用第二次鼠标单击,因为每个定义的矩形仅基于 1 组坐标创建,即矩形的左上角。

现在,我的代码所做的只是绘制固定大小的矩形 (50x25),这显然不是我想要的。这只是为了看看清算部分是否有效。

这是我到目前为止得到的:

package application;

import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.input.MouseButton;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class DrawRectangle extends Application {

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

    @Override
    public void start(Stage primaryStage) {
        primaryStage.setTitle("Title");
        Canvas canv = new Canvas(500, 400);
        GraphicsContext gc = canv.getGraphicsContext2D();

        EventHandler<MouseEvent> event = new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent event) {
                if (event.getButton() == MouseButton.PRIMARY) {
                    double x = event.getX();
                    double y = event.getY();                    
                    gc.setFill(Color.BLUE);
                    gc.fillRect(x, y, 50, 25);
                }
            }
        };

        canv.addEventHandler(MouseEvent.MOUSE_CLICKED, event);

        EventHandler<MouseEvent> event2 = new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent event2) {
                if (event2.getButton() == MouseButton.SECONDARY) {
                gc.clearRect(0, 0, 500, 400);
                }
            }
        };

        canv.addEventHandler(MouseEvent.MOUSE_CLICKED, event2);

        StackPane root = new StackPane();
        root.getChildren().add(canv);

        primaryStage.setScene(new Scene(root, 500, 400));
        primaryStage.show();
    }
}

我不知道鼠标点击应该模拟矩形的哪个角是否重要,也许有人有什么想法?

最诚挚的问候和新年快乐

Java JavaFX 画布 绘制 矩形

评论


答:

3赞 jewelsea 12/31/2019 #1

只需将第一个单击点保存在成员变量中,然后在用户进行第二个单击点时使用它并重置它。

注意:下面的示例代码使用了 Java 13+ 中的 switch 表达式。如果 Java 版本中没有可用的 switch 表达式,请将其转换为标准 switch 语句或 if/else 子句。

import javafx.application.Application;
import javafx.geometry.*;
import javafx.scene.Scene;
import javafx.scene.canvas.*;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class DrawRectangle extends Application {

    private static final int W = 500;
    private static final int H = 400;

    private Point2D savedPoint = null;

    @Override
    public void start(Stage stage) {
        Canvas canvas = new Canvas(W, H);
        GraphicsContext gc = canvas.getGraphicsContext2D();

        canvas.setOnMouseClicked(event -> {
            switch (event.getButton()) {
                case PRIMARY   -> handlePrimaryClick(gc, event);
                case SECONDARY -> gc.clearRect(0, 0, W, H);
            }
        });

        stage.setResizable(false);
        stage.setScene(new Scene(new StackPane(canvas), W, H));
        stage.show();
    }

    private void handlePrimaryClick(GraphicsContext gc, MouseEvent event) {
        Point2D clickPoint = new Point2D(event.getX(), event.getY());

        if (savedPoint == null) {
            savedPoint = clickPoint;
        } else {
            Rectangle2D rectangle2D = getRect(savedPoint, clickPoint);

            gc.setFill(Color.BLUE);
            gc.fillRect(
                    rectangle2D.getMinX(),
                    rectangle2D.getMinY(),
                    rectangle2D.getWidth(),
                    rectangle2D.getHeight()
            );

            savedPoint = null;
        }
    }

    private Rectangle2D getRect(Point2D p1, Point2D p2) {
        return new Rectangle2D(
                Math.min(p1.getX(), p2.getX()),
                Math.min(p1.getY(), p2.getY()),
                Math.abs(p1.getX() - p2.getX()),
                Math.abs(p1.getY() - p2.getY())
        );
    }

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

评论

0赞 z3us 1/2/2020
这正是我要找的!非常感谢 - 新年快乐!我不太熟悉 switch 语句和初始化/实例化(?) 的语法 以及 AT 第 22 行的使用。你有可能详细说明吗?我已经让它与if语句一起使用,因为这些switch语句不适用于我的Java版本。event->
0赞 jewelsea 1/2/2020
我在答案中提供了一个关于什么是开关表达式以及替代方案是什么的链接,请阅读它。鼠标单击事件的事件处理的语法是一个 lambda 表达式,我还在此评论中链接了一个教程(特别是阅读教程中标题为“GUI 应用程序中的 lambda 表达式”的部分)。它不是初始化/实例化事件(该事件已经由 JavaFX 创建),而是为相关事件定义一个处理程序。
0赞 z3us 1/2/2020
你帮了大忙。Lambda 表达式使代码更加简洁、优雅和可读!谢谢。