Question

I am trying to make a group which contains Rectangle and Text objects to scale up and down using the ScrollEvent. I am having trouble getting the correct scale to use from the delta of the scroll. The following code is what I have at the moment. Any help will be appreciated.

Thanks

import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.input.ScrollEvent;
import javafx.scene.paint.Color;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.Text;
import javafx.stage.Stage;

// demonstrates scaling a test pane with content in it.
public class ScaleTest extends Application {
    Group page;
    double textScale =1.0;
    public static void main(String[] args) {
        launch();
    }

    @Override
    public void start(Stage stage) throws Exception {
        stage.setTitle("scale test");
        Group root = new Group();
        page= new Group();
        Rectangle r = new Rectangle(300,300);
        Text t = new Text("asodjoijdjiasjdoijaisjdijasijdiajsidjoiasjiodjiajosijdiojaisjdoijaoisjdiojaoisjdjaoisjdiojsoidj\njdoasijdoajsoidjoaisjoidjaoisjdiojs");
        t.setFill(Color.FLORALWHITE);
        t.setWrappingWidth(280);
        t.setX(10);
        t.setY(20);
        page.getChildren().addAll(r,t);
        root.getChildren().add(page);
        Scene scene = new Scene(root,800,600);
        this.setSceneEvents(scene);
        stage.setScene(scene);
        stage.show();
    }
    private void setSceneEvents(final Scene scene) {
        //handles mouse scrolling
        scene.setOnScroll(
                new EventHandler<ScrollEvent>() {
                    @Override
                    public void handle(ScrollEvent event) {
                        double xscale = page.getScaleX() * event.getDeltaY()/35;
                        double yscale= page.getScaleY() * event.getDeltaY()/35;
                        System.out.println("xscale: "+ xscale);
                        System.out.println("yscale: "+ yscale);
                        //page.setScaleX(page.getScaleX() * event.getDeltaY()/35);
                       // page.setScaleY(page.getScaleY() * event.getDeltaY()/35);
                        event.consume();
                    }
                });

    }
}

Answer 1

|deltaY| is for all scroll events the same. Also note that deltaY is negative for scrolling down, and the scaling always is normalized at 1.0. So i suggest to use a “zoom factor” which determines the scaling. Try something like:

private void setSceneEvents(final Scene scene) {
    //handles mouse scrolling
    scene.setOnScroll(
            new EventHandler<ScrollEvent>() {
              @Override
              public void handle(ScrollEvent event) {
                double zoomFactor = 1.05;
                double deltaY = event.getDeltaY();
                if (deltaY < 0){
                  zoomFactor = 2.0 - zoomFactor;
                }
                System.out.println(zoomFactor);
                page.setScaleX(page.getScaleX() * zoomFactor);
                page.setScaleY(page.getScaleY() * zoomFactor);
                event.consume();
              }
            });

  }