CODEWITHSUNDEEP
javajavafxscrollbarzooming
Alex
Alex

Reputation: 1124

JavaFX: Zoom and Scroll do not work properly

I have the following structure:

ScrollPane
   Pane
       A set of children as ImageView

The following class I got from (will add the link later, can't find it right now)

public class ZoomController extends ScrollPane{

    private int deltaCount = 0;
    private final double DEFAULT_ZOOM = 1.0;
    private DoubleProperty zoomMax = new SimpleDoubleProperty(10.0);
    private DoubleProperty zoomMin = new SimpleDoubleProperty(0.1);
    private DoubleProperty zoomDelta = new SimpleDoubleProperty(1.2);
    private DoubleProperty zoom = new SimpleDoubleProperty(DEFAULT_ZOOM);
    GroupController gc;
    public ZoomController(Node content) {
        super();
        zoom.addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> ov, Number t, Number t1) {
                System.out.println("Zoom=" + zoom.doubleValue());

                content.scaleXProperty().bind(zoom);
                content.scaleYProperty().bind(zoom);
                content.translateXProperty();
            }
        });

        content.setOnScroll(new EventHandler<ScrollEvent>() {
            public void handle(ScrollEvent event) {
                if (event.getDeltaY() > 0) {
                    zoomIn();
                } else {
                    zoomOut();
                }
            }
        });
    }

    public void zoomIn() {
        double zoomValue = DEFAULT_ZOOM * Math.pow(zoomDelta.get(), deltaCount + 1);
        System.out.println("Zoooom " + zoomValue);
        if (zoomValue > zoomMax.get()) {
            setZoom(zoomMax.get());
            return;
        }

        deltaCount++;
        setZoom(zoomValue);

    }

    public void zoomOut() {
        double zoomValue = DEFAULT_ZOOM * Math.pow(zoomDelta.get(), deltaCount - 1);
        System.out.println("Zoooom " + zoomValue);
        if (zoomValue < zoomMin.get()) {
            setZoom(zoomMin.get());
            return;
        }

        deltaCount--;
        setZoom(zoomValue);
    }

    public void setZoom(double zoomValue) {
        zoom.set(zoomValue);
    }
}

and below line crease the object:

zoomController = new ZoomController(pane);

When I am zooming in, there is a very strange behavior- when I zoom in, scroll bars on the sides do not appear. How to make these bars to appear?

As I understand, the zoom in changes the size of the inner panel and when it grows bigger than the scroll panel, on the scroll pane must appear side bars.

Upvotes: 1

Views: 447

Answers (1)

fabian
fabian

Reputation: 82461

The scale properties are not taken into account in the size calculation for the content of the ScrollPane. To fix this, the content can be wrapped in a Group. Furthermore actually setting the content could help. BTW you shouldn't establish a binding inside a listener to the source of that binding. Either create a binding to that property

content.scaleXProperty().bind(zoom);
content.scaleYProperty().bind(zoom);

or set the value inside a listener:

zoom.addListener(new ChangeListener<Number>() {
    @Override
    public void changed(ObservableValue<? extends Number> ov, Number t, Number newZoom) {
        System.out.println("Zoom=" + newZoom.doubleValue());
        content.setScaleX(newZoom.doubleValue());
        content.setScaleY(newZoom.doubleValue());
    }
});

 

public class ZoomController extends ScrollPane {

    private int deltaCount = 0;
    private final double DEFAULT_ZOOM = 1.0;
    private DoubleProperty zoomMax = new SimpleDoubleProperty(10.0);
    private DoubleProperty zoomMin = new SimpleDoubleProperty(0.1);
    private DoubleProperty zoomDelta = new SimpleDoubleProperty(1.2);
    private DoubleProperty zoom = new SimpleDoubleProperty(DEFAULT_ZOOM);

    public ZoomController(Node content) {
        super(new Group(content));

        zoom.addListener(new ChangeListener<Number>() {
            @Override
            public void changed(ObservableValue<? extends Number> ov, Number t, Number newZoom) {
                System.out.println("Zoom=" + newZoom.doubleValue());
                content.setScaleX(newZoom.doubleValue());
                content.setScaleY(newZoom.doubleValue());
            }
        });

        content.setOnScroll(new EventHandler<ScrollEvent>() {
            public void handle(ScrollEvent event) {
                if (event.getDeltaY() > 0) {
                    zoomIn();
                } else {
                    zoomOut();
                }
            }
        });
    }

Upvotes: 1

Related Questions