首页 > 解决方案 > 缩放形状而不将其分开

问题描述

我正在尝试创建 2 个相似的尺寸形状(矩形),一个在另一个下方,具有缩放效果。但是,当缩放矩形时,这两个形状会相互重叠。这种行为不是预期的。

我希望矩形被缩放(缩放),此外,2个矩形应该在另一个矩形下方,中间没有任何间隙。如何实现?

一种选择是在组上提供缩放。但这会使里面的文本也缩放,这不是必需的。另一种选择是使用 VBox,但我想在窗格上实现此功能。

有人在这里建议我一个解决方案

我试图实现的代码如下

import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.input.ScrollEvent;
import javafx.stage.Stage;


@SuppressWarnings("restriction")
public class TestRectScaling extends Application {

/**
 * @param args
 */
public static void main(final String[] args) {
  launch(args);
}

/**
 * {@inheritDoc}
 */
@Override
public void start(final Stage primaryStage) throws Exception {
  javafx.scene.layout.Pane p = new javafx.scene.layout.Pane();
  javafx.scene.Group g = new javafx.scene.Group(p);
  javafx.scene.control.ScrollPane sp = new javafx.scene.control.ScrollPane(g);

  javafx.scene.layout.StackPane stackPane1 = new javafx.scene.layout.StackPane();

  javafx.scene.shape.Rectangle rect1 = new javafx.scene.shape.Rectangle();
  stackPane1.getChildren().add(rect1);
  rect1.setWidth(100);
  rect1.setHeight(100);
  rect1.setFill(javafx.scene.paint.Color.BLUE);
  javafx.scene.text.Text text1 = new javafx.scene.text.Text("This is sample Text Rect 1");
  text1.setWrappingWidth(30);
  stackPane1.getChildren().add(text1);

  javafx.scene.layout.StackPane stackPane2 = new javafx.scene.layout.StackPane();
  javafx.scene.shape.Rectangle rect2 = new javafx.scene.shape.Rectangle();
  rect2.setWidth(100);
  rect2.setHeight(100);
  rect2.setFill(javafx.scene.paint.Color.BLUEVIOLET);
  javafx.scene.text.Text text2 = new javafx.scene.text.Text("This is sample Text Rect 2");
  text2.setWrappingWidth(30);
  stackPane2.getChildren().add(rect2);
  stackPane2.getChildren().add(text2);

  stackPane1.setLayoutX(30);
  stackPane1.setLayoutY(20);

  stackPane2.setLayoutX(30);
  stackPane2.setLayoutY(120);

  g.getChildren().add(stackPane1);
  g.getChildren().add(stackPane2);


  sp.addEventFilter(javafx.scene.input.ScrollEvent.ANY, new EventHandler<ScrollEvent>() {

    @Override
    public void handle(final ScrollEvent event) {
      double scaleDelta = 1.3d;
      double scaleFactor = 0;
      double deltaY = event.getDeltaY();
      if (deltaY < 0) {
        scaleFactor = 1 / scaleDelta;
      }
      else {
        scaleFactor = scaleDelta;
      }
      rect1.setScaleY(rect1.getScaleY() * scaleFactor);
      rect2.setScaleY(rect2.getScaleY() * scaleFactor);
    }
  });

  javafx.scene.Scene s = new javafx.scene.Scene(sp);
  primaryStage.setScene(s);
  primaryStage.show();
}
}

帮我上个图

在此处输入图像描述

所以主要目的是在不改变两个矩形之间的距离的情况下缩放矩形。这基本上意味着我需要一种方法来在缩放它们之后计算新的 Y 坐标。

标签: javafxscalezoom-sdk

解决方案


不管您对实现的讨论如何,如果您仍在寻找当前方法的解决方案,则需要将以下侦听器包含到您的 rectangles boundsInParent 属性中。

这个想法是,当你缩放一个节点时,boundsInParent 得到更新。如果您监听该属性,您可以更新第二个 stackPane 的 stackPane 和 layoutY 的高度。

double gap = 15.0;
rect1.boundsInParentProperty().addListener((obs, old, bounds) -> {
    stackPane1.setPrefHeight(bounds.getHeight());
    stackPane2.setLayoutY(stackPane1.getLayoutY() + bounds.getHeight() + gap);
});

rect2.boundsInParentProperty().addListener((obs, old, val) -> {
    stackPane2.setPrefHeight(val.getHeight());
});

更新::

下面是限制最大/最小高度缩放的演示。

import javafx.application.Application;
import javafx.stage.Stage;

public class TestRectScaling extends Application {

    double defaultHeight = 100.0;
    double maxHeight = 400.0;
    double gap = 15.0;

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

    @Override
    public void start(final Stage primaryStage) throws Exception {
        javafx.scene.layout.Pane p = new javafx.scene.layout.Pane();
        javafx.scene.Group g = new javafx.scene.Group(p);
        javafx.scene.control.ScrollPane sp = new javafx.scene.control.ScrollPane(g);

        javafx.scene.layout.StackPane stackPane1 = new javafx.scene.layout.StackPane();

        javafx.scene.shape.Rectangle rect1 = new javafx.scene.shape.Rectangle();
        stackPane1.getChildren().add(rect1);
        rect1.setWidth(100);
        rect1.setHeight(defaultHeight);
        rect1.setFill(javafx.scene.paint.Color.BLUE);
        javafx.scene.text.Text text1 = new javafx.scene.text.Text("This is sample Text Rect 1");
        text1.setWrappingWidth(30);
        stackPane1.getChildren().add(text1);

        javafx.scene.layout.StackPane stackPane2 = new javafx.scene.layout.StackPane();
        javafx.scene.shape.Rectangle rect2 = new javafx.scene.shape.Rectangle();
        rect2.setWidth(100);
        rect2.setHeight(defaultHeight);
        rect2.setFill(javafx.scene.paint.Color.BLUEVIOLET);
        javafx.scene.text.Text text2 = new javafx.scene.text.Text("This is sample Text Rect 2");
        text2.setWrappingWidth(30);
        stackPane2.getChildren().add(rect2);
        stackPane2.getChildren().add(text2);

        rect1.boundsInParentProperty().addListener((obs, old, bounds) -> {
            stackPane1.setPrefHeight(bounds.getHeight());
            stackPane2.setLayoutY(stackPane1.getLayoutY() + bounds.getHeight() + gap);
        });

        rect2.boundsInParentProperty().addListener((obs, old, val) -> {
            stackPane2.setPrefHeight(val.getHeight());
        });

        stackPane1.setLayoutX(30);
        stackPane1.setLayoutY(20);

        stackPane2.setLayoutX(30);
        stackPane2.setLayoutY(120);

        g.getChildren().add(stackPane1);
        g.getChildren().add(stackPane2);

        sp.addEventFilter(javafx.scene.input.ScrollEvent.ANY, event -> {
            double scaleDelta = 1.3d;
            double scaleFactor = 0;
            double deltaY = event.getDeltaY();
            if (deltaY < 0) {
                scaleFactor = 1 / scaleDelta;
            } else {
                scaleFactor = scaleDelta;
            }

            double scale = rect1.getScaleY() * scaleFactor;

            // Determine the resultant height of this scale.
            double scaledHeight = scale * defaultHeight;
            if(scaledHeight > maxHeight){
                // If the target height is > max, then set the scale to max height.
                scale = maxHeight/defaultHeight;
            } else if(scaledHeight < defaultHeight){
                // If the target height is < default, then set the scale to default height.
                scale = 1;
            }
            rect1.setScaleY(scale);
            rect2.setScaleY(scale);
        });

        javafx.scene.Scene s = new javafx.scene.Scene(sp);
        primaryStage.setScene(s);
        primaryStage.show();
    }
}

推荐阅读