Question

我搜索并搜索了很多内容，但无法找到一个简单的解决方案。我想根据实际尺寸调整图像大小，同时保持图像比例。从下面的示例代码可以看出，在preserveRatio属性设置为true的情况下，我可以调整图像大小。但是，当我调整大小时，会传递图像的实际宽度或高度，因此会出现一个空白区域。如何在没有空白区域的情况下调整大小？

package test;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;


public class Test extends Application {
   private ImageView imageView = new ImageView();
   @Override
   public void start(Stage primaryStage) {

      imageView.setImage(new        Image("https://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Siberischer_tiger_de_edit02.jpg/800px-Siberischer_tiger_de_edit02.jpg"));
      imageView.preserveRatioProperty().set(true);

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

      imageView.fitHeightProperty().bind(root.heightProperty());
      imageView.fitWidthProperty().bind(root.widthProperty());

      Scene scene = new Scene(root, 300, 250);

      primaryStage.setTitle("Test Image Resizing");
      primaryStage.setScene(scene);
      primaryStage.show();
  }

    /**
    * @param args the command line arguments
    */
    public static void main(String[] args) {
      launch(args);
    }

}

Answer 1

您还需要调整视口，使其尺寸具有正确的比例，以ImageView填充整个区域：

@Override
public void start(Stage primaryStage) {
    imageView.setImage(new Image("https://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Siberischer_tiger_de_edit02.jpg/800px-Siberischer_tiger_de_edit02.jpg"));
    imageView.setPreserveRatio(true);

    StackPane root = new StackPane();
    root.getChildren().add(imageView);
    root.layoutBoundsProperty().addListener((observable, oldValue, newValue) -> {
        double w = newValue.getWidth();
        double h = newValue.getHeight();
        imageView.setFitWidth(w);
        imageView.setFitHeight(h);
        double ratio = h / w;
        Image image = imageView.getImage();
        double ih = image.getHeight();
        double iw = image.getWidth();
        double vR = ih / iw;
        imageView.setViewport((ratio < vR) ? new Rectangle2D(0, 0, iw, iw * ratio) : new Rectangle2D(0, 0, ih / ratio, ih));
    });

    Scene scene = new Scene(root, 300, 250);

    primaryStage.setTitle("Test Image Resizing");
    primaryStage.setScene(scene);
    primaryStage.show();
}

在这种情况下，您可以通过将图像用作root的背景图像来实现相同的效果：

@Override
public void start(Stage primaryStage) {
    StackPane root = new StackPane();
    root.setBackground(new Background(
            new BackgroundImage(new Image("https://upload.wikimedia.org/wikipedia/commons/thumb/4/41/Siberischer_tiger_de_edit02.jpg/800px-Siberischer_tiger_de_edit02.jpg"),
                    BackgroundRepeat.NO_REPEAT, BackgroundRepeat.NO_REPEAT, BackgroundPosition.DEFAULT, new BackgroundSize(0, 0, false, false, false, true)
            )));

    Scene scene = new Scene(root, 300, 250);

    primaryStage.setTitle("Test Image Resizing");
    primaryStage.setScene(scene);
    primaryStage.show();
}

如何根据实际尺寸保留图像比例并调整图像大小？

1 个答案: