JAVAFX中ScrollPane中的缩放和滚动

5

我有一个带有缩放和比例的JavaFX应用程序,如下所述: 在已缩放节点上按中心点缩放。 我需要实现的是将图像放置在右侧窗格,并保持左侧的图像如下图所示。

enter image description here

问题 如何将此应用程序嵌入SplitPane中,在左侧将有另一个面板。

    SplitPane splitPane = new SplitPane();
    splitPane.getItems().add(new Label("Left Panel"));
    splitPane.getItems().add(group);

    Scene scene = new Scene(splitPane, 1024, 768);

很遗憾,代码导致了错误的坐标。
2个回答

6
在一个ScrollPane内进行缩放,需要调整滚动条位置。这比仅追加转换要复杂一些,如果没有使用ScrollPane将可以完成此操作。
基本上,在缩放节点之前需要检查当前的滚动位置,并在缩放之后修改滚动条位置以防止中心点因缩放因素改变其位置。
以下示例允许您在网格中"移动"圆形并在不单击圆形(可平移的ScrollPane)时移动网格,同时允许在按住CTRL键时通过鼠标滚轮调整缩放。
import java.net.MalformedURLException;
import javafx.application.Application;
import javafx.geometry.Bounds;
import javafx.geometry.Point2D;
import javafx.geometry.Pos;
import javafx.scene.Group;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.canvas.Canvas;
import javafx.scene.canvas.GraphicsContext;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.control.SplitPane;
import javafx.scene.layout.Pane;
import javafx.scene.layout.Region;
import javafx.scene.layout.StackPane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;

public class PivotZoom extends Application {

    public static Region createContent() {
        double width = 1000;
        double height = 1000;

        Canvas canvas = new Canvas(width, height);
        GraphicsContext gc = canvas.getGraphicsContext2D();

        gc.setFill(Color.LIGHTGREY);
        gc.fillRect(0, 0, width, height);

        gc.setStroke(Color.BLUE);
        gc.beginPath();

        for (int i = 50; i < width; i += 50) {
            gc.moveTo(i, 0);
            gc.lineTo(i, height);
        }

        for (int i = 50; i < height; i += 50) {
            gc.moveTo(0, i);
            gc.lineTo(width, i);
        }
        gc.stroke();

        Pane content = new Pane(
                new Circle(50, 50, 20),
                new Circle(120, 90, 20, Color.RED),
                new Circle(200, 70, 20, Color.GREEN)
        );

        StackPane result = new StackPane(canvas, content);
        result.setAlignment(Pos.TOP_LEFT);

        class DragData {

            double startX;
            double startY;
            double startLayoutX;
            double startLayoutY;
            Node dragTarget;
        }

        DragData dragData = new DragData();

        content.setOnMousePressed(evt -> {
            if (evt.getTarget() != content) {
                // initiate drag gesture, if a child of content receives the
                // event to prevent ScrollPane from panning.
                evt.consume();
                evt.setDragDetect(true);
            }
        });

        content.setOnDragDetected(evt -> {
            Node n = (Node) evt.getTarget();
            if (n != content) {
                // set start paremeters
                while (n.getParent() != content) {
                    n = n.getParent();
                }
                dragData.startX = evt.getX();
                dragData.startY = evt.getY();
                dragData.startLayoutX = n.getLayoutX();
                dragData.startLayoutY = n.getLayoutY();
                dragData.dragTarget = n;
                n.startFullDrag();
                evt.consume();
            }
        });

        // stop dragging when mouse is released
        content.setOnMouseReleased(evt -> dragData.dragTarget = null);

        content.setOnMouseDragged(evt -> {
            if (dragData.dragTarget != null) {
                // move dragged node
                dragData.dragTarget.setLayoutX(evt.getX() + dragData.startLayoutX - dragData.startX);
                dragData.dragTarget.setLayoutY(evt.getY() + dragData.startLayoutY - dragData.startY);
                Point2D p = new Point2D(evt.getX(), evt.getY());
                evt.consume();
            }
        });

        return result;
    }

    @Override
    public void start(Stage primaryStage) throws MalformedURLException {
        Region zoomTarget = createContent();
        zoomTarget.setPrefSize(1000, 1000);
        zoomTarget.setOnDragDetected(evt -> {
            Node target = (Node) evt.getTarget();
            while (target != zoomTarget && target != null) {
                target = target.getParent();
            }
            if (target != null) {
                target.startFullDrag();
            }
        });

        Group group = new Group(zoomTarget);

        // stackpane for centering the content, in case the ScrollPane viewport
        // is larget than zoomTarget
        StackPane content = new StackPane(group);
        group.layoutBoundsProperty().addListener((observable, oldBounds, newBounds) -> {
            // keep it at least as large as the content
            content.setMinWidth(newBounds.getWidth());
            content.setMinHeight(newBounds.getHeight());
        });

        ScrollPane scrollPane = new ScrollPane(content);
        scrollPane.setPannable(true);
        scrollPane.viewportBoundsProperty().addListener((observable, oldBounds, newBounds) -> {
            // use vieport size, if not too small for zoomTarget
            content.setPrefSize(newBounds.getWidth(), newBounds.getHeight());
        });

        content.setOnScroll(evt -> {
            if (evt.isControlDown()) {
                evt.consume();

                final double zoomFactor = evt.getDeltaY() > 0 ? 1.2 : 1 / 1.2;

                Bounds groupBounds = group.getLayoutBounds();
                final Bounds viewportBounds = scrollPane.getViewportBounds();

                // calculate pixel offsets from [0, 1] range
                double valX = scrollPane.getHvalue() * (groupBounds.getWidth() - viewportBounds.getWidth());
                double valY = scrollPane.getVvalue() * (groupBounds.getHeight() - viewportBounds.getHeight());

                // convert content coordinates to zoomTarget coordinates
                Point2D posInZoomTarget = zoomTarget.parentToLocal(group.parentToLocal(new Point2D(evt.getX(), evt.getY())));

                // calculate adjustment of scroll position (pixels)
                Point2D adjustment = zoomTarget.getLocalToParentTransform().deltaTransform(posInZoomTarget.multiply(zoomFactor - 1));

                // do the resizing
                zoomTarget.setScaleX(zoomFactor * zoomTarget.getScaleX());
                zoomTarget.setScaleY(zoomFactor * zoomTarget.getScaleY());

                // refresh ScrollPane scroll positions & content bounds
                scrollPane.layout();

                // convert back to [0, 1] range
                // (too large/small values are automatically corrected by ScrollPane)
                groupBounds = group.getLayoutBounds();
                scrollPane.setHvalue((valX + adjustment.getX()) / (groupBounds.getWidth() - viewportBounds.getWidth()));
                scrollPane.setVvalue((valY + adjustment.getY()) / (groupBounds.getHeight() - viewportBounds.getHeight()));
            }
        });

        StackPane left = new StackPane(new Label("Left Menu"));
        SplitPane root = new SplitPane(left, scrollPane);

        Scene scene = new Scene(root, 800, 600);

        primaryStage.setScene(scene);
        primaryStage.show();
    }

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

}

非常感谢。不幸的是,我需要拖动和缩放的组合。拖动仍然不存在。 - Radim Burget
@RadimBurget 这是你需要的。现在可以平移、缩放并包含可拖动圆圈的网格了。 - fabian

1
尝试将您希望缩放和滚动的内容添加到组布局中。然后将该组添加到滚动窗格中。这将使您缩放的节点保持在滚动窗格的左侧位置。希望这解决了您的问题!缩放的节点位于组内,组位于滚动窗格内,在分隔窗格的右侧!

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接