缩小画布比例后更改滚动窗格的内部尺寸

Question

我实现了点击按钮缩小字段（Canvas）的功能。原则上，一切正常，但是当您缩小时，滚动窗格中画布所在的位置会出现白色区域。

代码中提供了我尝试过的所有选项。 是否可以使滚动窗格的内部区域根据画布的大小而变化并消除白色区域？

public class GameView {
    @FXML public Canvas gameField;
    @FXML public ScrollPane scrollPane; 

public void doZoomOut() {
        Scale scale = new Scale(gameField.getScaleX() * 0.8, gameField.getScaleY() * 0.8);
        gameField.getTransforms().add(scale);

        scrollPane.resize(gameField.getWidth(), gameField.getHeight()); //doesn't work
        scrollPane.setPrefViewportWidth(gameField.getWidth()); //doesn't work
        scrollPane.setPrefViewportHeight(gameField.getHeight()); //doesn't work
        //Fit to Width/Height also doesn't work
        scrollPane.setPrefWidth(gameField.getWidth()); //doesn't work
    }
}

<ScrollPane fx:id="scrollPane" fitToHeight="true" fitToWidth="true" style="-fx-background-color: transparent;" stylesheets="@../../../style.css">
    <styleClass>
               <String fx:value="scroll-bar" />
               <String fx:value="corner" />
               <String fx:value="thumb" />
    </styleClass>
    <Canvas fx:id="gameField" height="700.0" width="1200.0" />
</ScrollPane>

问题照片 https://drive.google.com/file/d/1ZNWIk1A1tQ_kbcrEi3eaL10R3e-MnUfr/view?usp=drivesdk

Answer 1

如果这可以帮助任何人。 通过对团体进行拳击解决了这个问题。使用此post

找到了解决方案

public void doZoomOut() {
    //two lines added
    Group contentGroup = new Group(gameField);
    scrollPane.setContent(contentGroup);

    Scale scale = new Scale(gameField.getScaleX() * 0.8, gameField.getScaleY() * 0.8);
    gameField.getTransforms().add(scale);
}