为什么缩放后原点发生了偏移？

Question

我有这个简单的 JavaFX 示例：

package pkg;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.scene.paint.Color;
import javafx.scene.shape.Line;
import javafx.stage.Stage;

public class SimpleScalingExample extends Application {

    @Override
    public void start(Stage stage) {
        Pane p = getPane();
        Pane root = new Pane(p);
        
        Scene scene = new Scene(root, 720, 540);

        stage.setScene(scene);
        stage.setTitle("Example");
        stage.show();
    }

    public Pane getPane() {
        Pane pane = new Pane();

        double width = 100;
        double height = 100;
        pane.setPrefSize(width, height);
        pane.setStyle("-fx-border-color: black; -fx-border-width: 5;");
        // pane.setScaleX(.5);
        // pane.setScaleY(.8);

        Line line1 = new Line(0, 0, width, height);
        line1.setStroke(Color.RED);
        line1.setStrokeWidth(5);

        Line line2 = new Line(0, height, width, 0);
        line2.setStroke(Color.BLUE);
        line2.setStrokeWidth(5);
        pane.getChildren().addAll(line1, line2);

        return pane;
    }
}

按原样运行时，我得到这样的信息：

如果我取消注释

setScale

行：

        pane.setScaleX(.5);
        pane.setScaleY(.8);

我明白了：

既然原点是左上角，而盒子形状看起来还不错，为什么不把它设置在左上角呢？

额外问题，为什么这两个示例中的线条都在边界之外？

（它的作用是一样的，我只是用

pane

创建场景，根本不使用

root

。）

这种行为对我来说并不直观。

Answer 1

来自

Node#scaleXProperty()

的文档：

定义沿该 Node 的 X 轴，围绕对象的中心 [强调]

 缩放坐标的因子。这用于手动或使用动画拉伸或收缩节点。

默认情况下，此比例因子不包含在

layoutBounds

 中，这使得它非常适合在考虑所有效果和变换后缩放整个节点。

发生缩放的枢轴点是未变换的中心 layoutBounds

[强调].

Node#scaleYProperty()

的文档类似。如果您想使用不同的枢轴点进行缩放，则需要使用 

Scale 变换并将其添加到 Node#getTransforms() 列表中。默认情况下，Scale

 的枢轴点将为 

(0, 0)

。

至于你的奖金问题：

额外问题，为什么这两个示例中的线条都在边界之外？

这与边框的

StrokeType

有关。显然，边框的默认描边类型（至少对于通过 CSS 创建的边框来说）是 INSIDE

。您想要一个笔划类型为 

CENTERED

 的边框。您可以通过创建带有适当 

Border

的

BorderStrokeStyle

以编程方式完成此操作。在 CSS 中，您可以将 -fx-border-style

 属性至少设置为 

solid centered

。然而，由于简单的几何形状，线条末端的“角”仍然会超出窗格的边界。如果您确实想要对齐，请考虑将线条的末端和边框的角都倒圆。