java - 如何使图像不会因旋转而调整大小(在 JavaFX 中)？

Question

我有一个方法可以旋转图像并使用drawImage 方法将其显示到 Canvas 上。但是，当旋转图像时，由于宽度和高度发生变化，图像会缩小和增大(假设旋转一个正方形，图像的宽度和高度会发生变化)。方法如下:

public void rotateImage(GraphicsContext gc, double speed) {
    erase(gc);  // erases the previous image
    imgView.setRotate(imgView.getRotate() + speed);
    SnapshotParameters params = new SnapshotParameters();
    params.setFill(Color.TRANSPARENT);
    image = imgView.snapshot(params, null);
    gc.drawImage(image, pos.x, pos.y, width, height);
}

任何帮助将不胜感激，如果需要，我可以发布其余的代码。

Answer 1

具有所提供参数的快照使用父级中节点的尺寸来确定图像的大小。在大多数情况下，旋转图像会产生与原始图像不同的尺寸。在这些情况下，快照比原始图像大。 (考虑旋转 45° 的方形图像；旋转图像的宽度和高度是原始图像对角线的大小，即大了 sqrt(2) = 1.41...).

由于 drawImage 会缩放绘制的图像以适合大小为 宽 x 高 的矩形，因此大于此大小的快照会按比例缩小。

使用 GraphicsContext 的转换来避免每次调用该方法时创建新的 Image 实例并避免缩放图像。

示例

@Override
public void start(Stage primaryStage) {
    Image image = new Image("https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Smiley.svg/240px-Smiley.svg.png");
    Canvas canvas = new Canvas(500, 500);
    GraphicsContext context = canvas.getGraphicsContext2D();
    Slider slider = new Slider(0, 360, 0);
    Button btn = new Button("draw");
    VBox root = new VBox(canvas, slider, btn);


    btn.setOnAction(evt -> {
        context.setFill(Color.TRANSPARENT);
        context.fillRect(0, 0, canvas.getWidth(), canvas.getHeight());

        double posX = 200;
        double posY = 150;

        context.save();

        // apply transformation that puts makes (posX, posY) the point
        // where (0,0) is drawn and rotate
        context.translate(posX, posY);
        context.rotate(slider.getValue());

        // draw with center at (0, 0)
        context.drawImage(image, -image.getWidth()/2, -image.getHeight()/2);

        // undo transformations
        context.restore();
    });

    primaryStage.setScene(new Scene(root));
    primaryStage.show();
}