javafx - 缩放形状而不将其分开
问题描述
我正在尝试创建 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 坐标。
解决方案
不管您对实现的讨论如何,如果您仍在寻找当前方法的解决方案,则需要将以下侦听器包含到您的 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();
}
}
推荐阅读
- karate - 在 url 中传递变量 - 空手道
- javascript - RabbitMq 与 reactJS
- postgresql - 是什么决定了将大查询粘贴到 psql 中的限制?
- android - 如何为自定义吐司布局设置主题?
- python - 在 Windows 中终止使用 shell=True 启动的后台进程
- angularjs - 指令控制器中的AngularJS表单属性
- apache-spark - PySpark:完全清理检查点
- angular - Angular Protractor 未检测到渲染的组件标签
- python - 将 SciPy 稀疏矩阵转换为 numpy 数组时出错:“数组太大”
- vue.js - 不需要提交突变的 vuex 操作