显示 ImageView 对象的修改图像

Question

我一直在使用 ImageView 对象来尝试修改图像然后绘制它。但是我只能使以下两个结果发生：

1) ImageView 被修改后，我尝试使用 getImage() 从中获取图像以显示，但它只显示了我最初拥有的原始图像。

示例代码：

sheet = new Image("file:sprite_sheet.png"); 

        ImageView iv = new ImageView();
        iv.setImage(sheet);
        iv.setViewport(new Rectangle2D(0, 0, 32, 32));

        g.drawImage(iv.getImage(), 100, 100);//'g' is GraphicsContext2D

2) 我设法通过将修改后的图像添加到 Group obj 中来显示它，如下所示：

root.getChildren().add(iv);

然后它只在屏幕的左上角显示图像，我无法移动它或对其进行任何操作。

我更喜欢（如果可能的话）用一种更像第一个结果所呈现的方法来解决这个问题。只是提前说一下，我知道还有另一个帖子similar to this atm，但我无法从中得到任何有用的信息。

Answer 1

ImageView，顾名思义，只是数据的视图（本例中为图像）。对视图的所有修改只影响视图而不影响数据。您想要实现的目标有两种通用方法。

1. 使用场景图和ImageView 对象。对视图执行所有可视化操作。这是首选方式，因为数据保持不变，这意味着您可以使用原始图像轻松创建新的ImageView，并根据需要以不同的方式对其进行修改。如果父对象是Pane，那么您可以通过调用setTranslateX/Y 轻松移动对象。

2. 如果您绝对需要使用Canvas，那么您将需要修改数据本身或创建数据的副本并进行修改。您可以通过使用以下组合来做到这一点：PixelWriter 和 PixelReader

1. 的示例：

ImageView view = new ImageView(image);
// create root with dimension 800x600
Pane root = new Pane();
root.setPrefSize(800, 600);

// attach view to root so it can be displayed
root.getChildren().add(view);

// translate view to 100, 100
// on the screen this means the image will move 100 in X and 100 in Y
view.setTranslateX(100);
view.setTranslateY(100);