是否可以在 JavaFX 中将 ImageView 放在 Canvas 上？答案

【问题标题】：Is it possible to put ImageView on Canvas in JavaFX?是否可以在 JavaFX 中将 ImageView 放在 Canvas 上？
【发布时间】：2015-05-06 05:57:47
【问题描述】：

我是 javafx 的新手。我正在开发一个应用程序，其中有一个画布，并在其中绘制了几张图像。我想在我的画布上添加一个ImageView 并在单击 ImageView 时实现一个弹出窗口？

是否有可能使用或不使用ImageView（按钮或任何控件？）还是仅限于在画布上使用控件？

我需要一些建议。

【问题讨论】：

你想把ImageView放在Canvas上面吗？
@ItachiUchiha：是的！

标签： java canvas javafx popup imageview

【解决方案1】：

您可以将ImageView 堆叠在Canvas 之上。使用StackPane。您可以稍后将鼠标侦听器添加到 ImageView。

是否有可能使用或不使用ImageView（按钮或任何控件？）还是仅限于在画布上使用控件？

包括Button、ImageView 和Canvas 在内的所有控件本身都从Node 扩展而来，可用于添加StackPane。

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.stage.Stage;

public class Main extends Application {

    int count = 1;

    @Override
    public void start(Stage stage) {

        StackPane root = new StackPane();
        Scene s = new Scene(root, 400, 400, Color.BLACK);

        final Canvas canvas = new Canvas(300, 300);
        GraphicsContext gc = canvas.getGraphicsContext2D();

        gc.setFill(Color.BLUE);
        gc.fillRect(10, 10, 300, 300);

        ImageView image = new ImageView("https://cdn0.iconfinder.com/data/icons/toys/256/teddy_bear_toy_6.png");

        // Listener for MouseClick
        image.setOnMouseClicked(e -> {
            Stage popup = new Stage();
            popup.initOwner(stage);
            popup.show();
        });

        root.getChildren().addAll(canvas, image);

        stage.setScene(s);
        stage.show();
    }

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

输出：

场景有黑色背景
画布有蓝色背景
ImageView 是熊。

【讨论】：

嗨，非常感谢您的解决方案.. 我有一个疑问，考虑我使用锚窗格作为父级，我可以在其中使用此堆栈窗格和其余操作吗？
是的，你可以。只需将 StackPane 添加为 AnchorPane 的子项即可。
您好，我已经添加了 imageview，但我无法用 x 和 y 坐标定位它，它总是出现在中心。我使用了 setLayoutX 和 setLayoutY 属性。如何定位？
请转至JavaFX : How to position a component/node?，完成后转至JavaFX issue when placing square at coordinates
是的 setTranslateX 和 setTranslateY 工作！表示赞许，满意，胜利！但仍然取相对于 stackpane 中心的值，是这样的吗？

【解决方案2】：

如果您只想在画布顶部添加按钮、图像...，您应该使用StackPane。你首先添加你的画布，然后你可以添加按钮或任何你想要的。

 StackPane stack = new StackPane();
 stack.getChildren().addAll(yourCanvas, yourButton);

您应该阅读this 以更好地了解使用 JavaFX 进行布局。

【讨论】：