在JavaFX中没有缩放效果的ViewPort方法

时间:2017-10-31 17:31:49

标签: javafx javafx-8 zoom viewport effect

我试图将图像切片显示在屏幕上。 例如,如果我将左边的花卉图片的右边距改为20,右边的花卉图片的下边距改为20,则它们的行为如下:

(原始图片显示在第一列) enter image description here

ViewPort方法完全符合我的要求,切割图像并将边距留空但它使用图像的原始尺寸显示缩放效果,如javafx网站所述:

"进入图像的矩形视口。在缩放或任何其他变换之前,视口在图像的坐标中指定。 如果视口为null,则显示整个图像。如果视口非空,则仅显示属于视口的图像部分。如果图像未完全覆盖视口,则视口的任何剩余区域都将为空。"

我在设置视口之前已尝试使用imageView.resize(screenWidth, screenHeight),但它不起作用。
还尝试了imageView.setFitWidth(screenWidth), imageView.setFitHeight(screenHeight)
是否可以重新缩放图像,使其按照描述显示? 还是其他任何解决方法?

这是左边距的代码示例:
mediaContent.resize(screenWidth, screen.getHeight()); // mediaContent.setFitWidth(screenWidth); // mediaContent.setFitHeight(screen.getHeight()); mediaContent.setViewport(new Rectangle2D(screenWidth-dXLeft, 0, screenWidth, screen.getHeight()));

更新:尝试设置setFitWidthsetFitHeight设置静止图像显示放大的图像

    `imageView.setFitWidth(space.getX());
    imageView.setFitHeight(space.getY());
    imageView.setViewport(new Rectangle2D(screen.getWidth()-space.getX(), 0, screen.getWidth(), screen.getHeight()));
    imageView.setFitWidth(space.getX());
    imageView.setFitHeight(space.getY());

    return imageView;`

这是我使用setViewport方法时的结果 设置边距:enter image description here

不设置边距时应该如何:enter image description here

更新2 :示例(从java-buddy修改)放大

package javafx_imageview_viewport;

import javafx.application.Application;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Rectangle2D;
import javafx.scene.Scene;
import javafx.scene.control.Slider;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

/**
 * @web http://java-buddy.blogspot.com/
 */
public class JavaFX_ImageView_Viewport extends Application {

@Override
public void start(Stage primaryStage) {

    ImageView imageView1 = new ImageView(new Image("https://i.imgur.com/6Zl0eQB.jpg"));
    imageView1.setFitWidth(150);
    imageView1.setFitHeight(100);

    //Example to rotate ImageView
    Image image2 = new Image("https://i.imgur.com/6Zl0eQB.jpg");
    Rectangle2D viewportRect2 = new Rectangle2D(
            image2.getWidth()/4, 
            image2.getHeight()/4, 
            image2.getWidth()*3/4, 
            image2.getHeight()*3/4);
    ImageView imageView2 = new ImageView(image2);
    imageView2.setFitWidth(150);
    imageView2.setFitHeight(100);
    imageView2.setViewport(viewportRect2);

    Slider sliderRotate = new Slider();
    sliderRotate.setMin(0);
    sliderRotate.setMax(360);
    sliderRotate.setValue(0);
    sliderRotate.valueProperty().addListener(
            (ObservableValue<? extends Number> observable, 
                    Number oldValue, Number newValue) -> {
        imageView2.setRotate((double)newValue);
    });

    //Example to change ViewPort
    Image image3 = new Image("https://i.imgur.com/6Zl0eQB.jpg");
    Rectangle2D viewportRect3 = new Rectangle2D(
            0, 
            0, 
            image3.getWidth(), 
            image3.getHeight());
    ImageView imageView3 = new ImageView(image3);
    imageView3.setFitWidth(150);
    imageView3.setFitHeight(100);
    imageView3.setViewport(viewportRect3);

    Slider sliderViewPort = new Slider();
    sliderViewPort.setMin(0);
    sliderViewPort.setMax(1.0);
    sliderViewPort.setValue(1.0);
    sliderViewPort.valueProperty().addListener(
            (ObservableValue<? extends Number> observable, 
                    Number oldValue, Number newValue) -> {
        Rectangle2D newViewportRect3 = new Rectangle2D(
                0,
                0,
                (double)newValue*image3.getWidth(),
                (double)newValue*image3.getHeight());
        imageView3.setViewport(newViewportRect3);
    });


    VBox vBox = new VBox();
    vBox.getChildren().addAll(imageView1, 
            imageView2, sliderRotate,
            imageView3, sliderViewPort);

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

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

    primaryStage.setTitle("java-buddy: ImageVIew ViewPort");
    primaryStage.setScene(scene);
    primaryStage.show();
}

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

示例2来自java-buddy我希望它如何表现,切割图像:

package javafx_imageview_viewport;

import javafx.application.Application;
import javafx.beans.value.ObservableValue;
import javafx.geometry.Rectangle2D;
import javafx.scene.Scene;
import javafx.scene.control.Slider;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

/**
 * @web http://java-buddy.blogspot.com/
 */
public class JavaFX_ImageView_Viewport extends Application {

@Override
public void start(Stage primaryStage) {

    ImageView imageView1 = new ImageView(new Image("https://i.imgur.com/294AEFU.png"));

    //Example to rotate ImageView
    Image image2 = new Image("https://i.imgur.com/294AEFU.png");
    Rectangle2D viewportRect2 = new Rectangle2D(
            image2.getWidth()/4, 
            image2.getHeight()/4, 
            image2.getWidth()*3/4, 
            image2.getHeight()*3/4);
    ImageView imageView2 = new ImageView(image2);
    imageView2.setViewport(viewportRect2);

    Slider sliderRotate = new Slider();
    sliderRotate.setMin(0);
    sliderRotate.setMax(360);
    sliderRotate.setValue(0);
    sliderRotate.valueProperty().addListener(
            (ObservableValue<? extends Number> observable, 
                    Number oldValue, Number newValue) -> {
        imageView2.setRotate((double)newValue);
    });

    //Example to change ViewPort
    Image image3 = new Image("https://i.imgur.com/294AEFU.png");
    Rectangle2D viewportRect3 = new Rectangle2D(
            0, 
            0, 
            image3.getWidth(), 
            image3.getHeight());
    ImageView imageView3 = new ImageView(image3);
    imageView3.setViewport(viewportRect3);

    Slider sliderViewPort = new Slider();
    sliderViewPort.setMin(0);
    sliderViewPort.setMax(1.0);
    sliderViewPort.setValue(1.0);
    sliderViewPort.valueProperty().addListener(
            (ObservableValue<? extends Number> observable, 
                    Number oldValue, Number newValue) -> {
        Rectangle2D newViewportRect3 = new Rectangle2D(
                0,
                0,
                (double)newValue*image3.getWidth(),
                (double)newValue*image3.getHeight());
        imageView3.setViewport(newViewportRect3);
    });


    VBox vBox = new VBox();
    vBox.getChildren().addAll(imageView1, 
            imageView2, sliderRotate,
            imageView3, sliderViewPort);

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

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

    primaryStage.setTitle("java-buddy: ImageVIew ViewPort");
    primaryStage.setScene(scene);
    primaryStage.show();
}

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

}

1 个答案:

答案 0 :(得分:1)

似乎我想要的东西没有意义。

如果我希望图片适合屏幕,我必须使用fitScreenWidth(screenWidth)fitScreenHeight(screenHeight),但在这种情况下使用viewPort方法没有意义,因为图像已调整大小已经。

viewPort方法只能用于原始图像的尺寸。