如何剪裁和调整javafx边框窗格的大小

我只是从JavaFX开始。我想要一个边框窗格，上面、左边和右边都有控件，中间有一个图像。我希望在调整窗口大小时调整中心窗格的大小，但始终能够看到所有左、右和顶部控件

使用下面的代码，我可以在左侧、顶部和右侧显示一个按钮。我可以在中间显示一个图像

但图像会扩展到中心边界之外，并隐藏右侧按钮

奇怪的是，如果我在中间窗格的imageview上设置了一个剪切矩形（取消注释第67行和第68行），它实际上只绘制了剪切区域，但布局的其余部分的行为就好像绘制了整个图片一样。也就是说，图像的未绘制部分仍然会遮挡右侧的按钮

任何帮助都将不胜感激

如果简单的话，请提前感谢并道歉

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.image.*;
import javafx.scene.layout.*;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class ImageApp extends Application {
    private BorderPane root;
    private Rectangle clipRect;
    private ImageView iv;
    private StackPane leftPane;
    private StackPane rightPane;
    private Button topButton;
    private Button leftButton;
    private Button rightButton;

    @Override
    public void start(Stage primaryStage) {
        root = new BorderPane();
        Scene primaryScene = new Scene(root, 900, 800);
        initializePrimaryStage(primaryStage, primaryScene);
        initializeFrameContent(root, topButton, leftButton);
        initializeContent(root);
        primaryStage.show();
    }

    private void initializeFrameContent(BorderPane root, Button topButton, Button leftButton) {

        topButton = new Button("TOP");
        leftButton = new Button("LEFT");
        rightButton = new Button("RIGHT");

        leftPane = new StackPane(leftButton);
        leftPane.setAlignment(Pos.TOP_LEFT);

        rightPane = new StackPane(rightButton);
        rightPane.setAlignment(Pos.TOP_RIGHT);

        root.setLeft(leftPane);
        root.setTop(topButton);
        root.setRight(rightButton);
    }

    private void initializePrimaryStage(Stage primaryStage, Scene   primaryScene) {
        primaryStage.setTitle("Image Clip Test");
        primaryStage.setScene(primaryScene);
        primaryStage.setWidth(400);
        primaryStage.setHeight(300);
        primaryStage.minWidthProperty().setValue(400);
        primaryStage.minHeightProperty().setValue(300);
    }

    public static void main(String[] args) {
        launch(args);

    }

    private void initializeContent(BorderPane root) {
        Image image = new Image(
                "http://www.ciee.org/study-abroad/images/cities/0020/headers/desktop/big-ben-london-traffic-trafalgar-abroad-studies.jpg"
        );
        iv = new ImageView(image);
        root.setCenter(iv);
        //clipRect = new Rectangle(400,200);
        //root.getCenter().setClip(clipRect);
    }
}

---

你没有具体说明你打算做什么。为什么要剪辑内容？你描述它的方式，你想要的只是一些被剪裁的背景。你可以通过各种机制来实现，例如。Gcss

或者你可以找一个合适的父母，例如。Ga以限制区域或e。GA为了伸展以适应：

import javafx.application.Application;
import javafx.beans.property.ObjectProperty;
import javafx.beans.property.SimpleObjectProperty;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.geometry.HPos;
import javafx.geometry.Pos;
import javafx.geometry.VPos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Region;
import javafx.scene.layout.StackPane;
import javafx.scene.shape.Rectangle;
import javafx.stage.Stage;

public class ImageApp extends Application {
    private BorderPane root;
    private Rectangle clipRect;
    private ImageView iv;
    private StackPane leftPane;
    private StackPane rightPane;
    private Button topButton;
    private Button leftButton;
    private Button rightButton;

    @Override
    public void start(Stage primaryStage) {
        root = new BorderPane();
        Scene primaryScene = new Scene(root, 900, 800);
        initializePrimaryStage(primaryStage, primaryScene);
        initializeFrameContent(root, topButton, leftButton);
        initializeContent(root);
        primaryStage.show();
    }

    private void initializeFrameContent(BorderPane root, Button topButton, Button leftButton) {

        topButton = new Button("TOP");
        leftButton = new Button("LEFT");
        rightButton = new Button("RIGHT");

        leftPane = new StackPane(leftButton);
        leftPane.setAlignment(Pos.TOP_LEFT);

        rightPane = new StackPane(rightButton);
        rightPane.setAlignment(Pos.TOP_RIGHT);

        root.setLeft(leftPane);
        root.setTop(topButton);
        root.setRight(rightButton);
    }

    private void initializePrimaryStage(Stage primaryStage, Scene   primaryScene) {
        primaryStage.setTitle("Image Clip Test");
        primaryStage.setScene(primaryScene);
        primaryStage.setWidth(400);
        primaryStage.setHeight(300);
        primaryStage.minWidthProperty().setValue(400);
        primaryStage.minHeightProperty().setValue(300);
    }

    public static void main(String[] args) {
        launch(args);

    }

    private void initializeContent(BorderPane root) {

        Image image = new Image(
                "http://www.ciee.org/study-abroad/images/cities/0020/headers/desktop/big-ben-london-traffic-trafalgar-abroad-studies.jpg"
        );
        iv = new ImageView(image);

        // ImageViewPane content = new ImageViewPane( iv);
        ScrollPane content = new ScrollPane( imageView);

        // hide scrollbars
        content.setVbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
        content.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
        content.setPadding(Insets.EMPTY);

        root.setCenter(content);
    }


    // code from here: https://stackoverflow.com/questions/22993550/how-to-resize-an-image-when-resizing-the-window-in-javafx
    class ImageViewPane extends Region {

        private ObjectProperty<ImageView> imageViewProperty = new SimpleObjectProperty<ImageView>();

        public ObjectProperty<ImageView> imageViewProperty() {
            return imageViewProperty;
        }

        public ImageView getImageView() {
            return imageViewProperty.get();
        }

        public void setImageView(ImageView imageView) {
            this.imageViewProperty.set(imageView);
        }

        public ImageViewPane() {
            this(new ImageView());
        }

        @Override
        protected void layoutChildren() {
            ImageView imageView = imageViewProperty.get();
            if (imageView != null) {
                imageView.setFitWidth(getWidth());
                imageView.setFitHeight(getHeight());
                layoutInArea(imageView, 0, 0, getWidth(), getHeight(), 0, HPos.CENTER, VPos.CENTER);
            }
            super.layoutChildren();
        }

        public ImageViewPane(ImageView imageView) {
            imageViewProperty.addListener(new ChangeListener<ImageView>() {

                @Override
                public void changed(ObservableValue<? extends ImageView> arg0, ImageView oldIV, ImageView newIV) {
                    if (oldIV != null) {
                        getChildren().remove(oldIV);
                    }
                    if (newIV != null) {
                        getChildren().add(newIV);
                    }
                }
            });
            this.imageViewProperty.set(imageView);
        }
    }
}

导入javafx.application.application；
导入javafx.beans.property.ObjectProperty；
导入javafx.beans.property.SimpleObject属性；
导入javafx.beans.value.ChangeListener；
导入javafx.beans.value.observeValue；
导入javafx.geometry.HPos；
导入javafx.geometry.Pos；
导入javafx.geometry.VPos；
导入javafx.scene.scene；
导入javafx.scene.control.Button；
导入javafx.scene.image.image；
导入javafx.scene.image.ImageView；
导入javafx.scene.layout.BorderPane；
导入javafx.scene.layout.Region；
导入javafx.scene.layout.StackPane；
导入javafx.scene.shape.Rectangle；
导入javafx.stage.stage；
公共类ImageApp扩展应用程序{
私有边界根；
私有矩形clipRect；
私人影像视图四；
私有堆栈窗格左窗格；
私有堆栈窗格右窗格；
私人按钮顶部按钮；
私人按钮左按钮；
私人按钮右按钮；
@凌驾
公共无效开始（阶段primaryStage）{
root=新边框窗格（）；
场景PrimarySecene=新场景（根，900800）；
初始化primaryStage（primaryStage，PrimarySecene）；
InitializeFlameContent（root、topButton、leftButton）；
初始化内容（根）；
primaryStage.show（）；
}
private void initializeFrameContent（边框窗格根、按钮顶部按钮、按钮左侧按钮）{
topButton=新按钮（“TOP”）；
leftButton=新按钮（“左”）；
右按钮=新按钮（“右”）；
leftPane=新堆栈窗格（leftButton）；
左窗格。设置对齐（位置左上方）；
rightPane=新的堆栈窗格（rightButton）；
右窗格。设置对齐（位置顶部\右侧）；
setLeft（左窗格）；
root.setTop（顶部按钮）；
root.setRight（rightButton）；
}
private void initializePrimaryStage（舞台主舞台、场景主舞台）{
初级阶段。设置标题（“图像剪辑测试”）；
初始阶段。设置场景（初始场景）；
初生阶段：坐骨宽度（400）；
初生阶段：坐位高度（300）；
primaryStage.minWidthProperty（）.setValue（400）；
primaryStage.minHeightProperty（）.setValue（300）；
}
公共静态void main（字符串[]args）{
发射（args）；
}
私有void initializeContent（BorderPane根目录）{
图像=新图像(
"http://www.ciee.org/study-abroad/images/cities/0020/headers/desktop/big-ben-london-traffic-trafalgar-abroad-studies.jpg"
);
iv=新图像视图（图像）；
//ImageViewPane内容=新的ImageViewPane（iv）；
滚动窗格内容=新滚动窗格（imageView）；
//隐藏滚动条
content.setVbarPolicy（ScrollPane.ScrollBarPolicy.NEVER）；
content.setHbarPolicy（ScrollPane.ScrollBarPolicy.NEVER）；
content.setPadding（Insets.EMPTY）；
root.setCenter（内容）；
}
//此处的代码：https://stackoverflow.com/questions/22993550/how-to-resize-an-image-when-resizing-the-window-in-javafx
类ImageViewPane扩展区域{
private ObjectProperty imageViewProperty=新的SimpleObject属性（）；
公共对象属性imageViewProperty（）{
返回imageViewProperty；
}
公共图像视图getImageView（）{
返回imageViewProperty.get（）；
}
public void setImageView（ImageView ImageView）{
this.imageViewProperty.set（imageView）；
}
公共图像视图窗格（）{
这（新的ImageView（））；
}
@凌驾
受保护的void layoutChildren（）{
ImageView=imageViewProperty.get（）；
如果（imageView！=null）{
setFitWidth（getWidth（））；
setFitHeight（getHeight（））；
布局区域（imageView、0、0、getWidth（）、getHeight（）、0、HPos.CENTER、VPos.CENTER）；
}
super.layoutChildren（）；
}
公共图像视图窗格（图像视图）{
imageViewProperty.addListener（新的ChangeListener（）{
@凌驾
更改公众假期（Observalevalue非常感谢您的快速响应。它的工作原理与我所希望的完全一样。但是这个基本用例真的需要这么多代码吗？JavaFX看起来有点复杂。在您的回答中，您提到了使用滚动窗格实现相同效果的可能性。这会更简单吗？再次感谢！欢迎您。在那样的话，你应该接受答案。