Question

我正在用JavaFX创建一个桌面应用程序，该应用程序使用户可以搜索不同类别的人。有一个屏幕，将每个类别显示为带有图像的瓷砖（纵横比为1：1）。当您单击图块时，它会打开另一页，并且图块中的图像现在应显示为背景图像（宽高比16：9）。图像是由管理员用户选择的，因此必须裁剪图像，因为图像可能太大，纵横比不正确等等。

我想知道如何设置一种简单的方法，使管理员用户可以选择他想要的图片，而不必裁剪图像两次（一次为1：1，一次为16：9）。我只考虑裁切为1：1，然后只是放大图片就显示为16：9，但这会导致质量差，如果分辨率不够高。

对于裁剪，我引用了Roland的这篇文章： How to make a Javafx Image Crop App

Answer 1

对于背景图像，您只需指定图像应覆盖Region。

ImageView允许您指定viewport，允许您指定应显示的Image的区域。如果选择了适当的位置，则会为您进行裁剪。

为简单起见，以下代码为两者使用相同的比率：

@Override
public void start(Stage primaryStage) {
    final Image image = new Image(URL);

    // size to use for both nodes
    double targetHeight = 400;
    double targetWidth = targetHeight * 16 / 9;

    ImageView imageView = new ImageView(image);
    imageView.setFitWidth(targetWidth);
    imageView.setFitHeight(targetHeight);

    // calculate viewport
    imageView.setViewport((image.getHeight() / targetHeight < image.getWidth() / targetWidth)
            ? new Rectangle2D(0, 0, image.getHeight() / targetHeight * targetWidth, image.getHeight())
            : new Rectangle2D(0, 0, image.getWidth(), image.getWidth() / targetWidth * targetHeight));

    Region backgroundRegion = new Region();
    backgroundRegion.setPrefSize(targetWidth, targetHeight);
    backgroundRegion.setBackground(new Background(
            new BackgroundImage(
                    image,
                    BackgroundRepeat.NO_REPEAT,
                    BackgroundRepeat.NO_REPEAT,
                    BackgroundPosition.CENTER,
                    new BackgroundSize(0, 0, false, false, false, true) // cover
            )));

    HBox root = new HBox(imageView, backgroundRegion);
    root.setFillHeight(false);
    root.setPadding(new Insets(20));

    Scene scene = new Scene(root);

    primaryStage.setScene(scene);
    primaryStage.show();
}

JavaFX如何针对多个纵横比一次裁剪图像

1 个答案: