Umbrella_Programmer
Umbrella_Programmer

Reputation: 191

Scroll bars / scrollpane disappearing upon image upload and zoom in JavaFX

This is a JavaFX application. There is an imageView nested inside a Scroll Pane, and before an image loads/displays, the scroll bars are visible. However, when the user uploads the image or clicks/zooms in on the image, the scroll bars disappear. This leaves only a portion of the image visible.

I'm a very new developer so I might be using the wrong methods to resize the image. I also might be calling the method on the wrong object (in this case, the imageView itself is acted upon, not the image object painted on it).

Here is the zoom method I built:

// a method that allows user to zoom in and out on the image
    @FXML
    private void zoomImage(MouseEvent event) {
        if (imageDisplay != null) {
            if (imageDisplay.getScaleX() == 1.0 & imageDisplay.getScaleY() 
== 1.0) {
                imageDisplay.setScaleX(3.0);
                imageDisplay.setScaleY(3.0);
            } else {
                imageDisplay.setScaleX(1.0);
                imageDisplay.setScaleY(1.0);
            }
        } else {
            return;
        }
    }

(Here is the FXML for the imageView and Scroll Pane, both of which are in a VBox)

<ScrollPane>
    <content>
         <ImageView fx:id="imageDisplay" fitHeight="300.0" fitWidth="650.0" 
onDragDropped="#handleImageDrop" onDragOver="#handleImageDrag" 
onMouseClicked="#zoomImage" pickOnBounds="true" preserveRatio="true" />
    </content>
</ScrollPane>

I expect the scroll bars to remain visible after the image is uploaded and zoomed in.

Upvotes: 0

Views: 448

Answers (1)

Matt
Matt

Reputation: 3187

You can set the scroll bar as always visible from the fxml by adding hbarPolicy="ALWAYS" vbarPolicy="ALWAYS"> the default or unspecified is set to AS_NEEDED which is why they may not be showing up

Ex.

<ScrollPane hbarPolicy="ALWAYS" vbarPolicy="ALWAYS">
    <content>
        <ImageView fx:id="imageDisplay" fitHeight="300.0" fitWidth="650.0"
                   onDragDropped="#handleImageDrop" onDragOver="#handleImageDrag"
                   onMouseClicked="#zoomImage" pickOnBounds="true" preserveRatio="true" />
    </content>
</ScrollPane>

Alternatively you can do it with code for example

scrollPane.setVbarPolicy(ScrollPane.ScrollBarPolicy.ALWAYS);

Upvotes: 0

Related Questions