JavaFX 时钟数转换

Question

我正在尝试在 JavaFX 中创建一个时钟，一切正常，除了代表时间的数字（从 1 到 12）。我有这段代码：

    Group numbers = new Group();
    for(int i = 0; i < 12; i++){
        //create a label.
        Label label = new Label(String.valueOf(i));
        //center it
        label.setTranslateX(100);
        label.setTranslateY(100);
        label.getTransforms().add(new Rotate(i * (360 / 12)));
        //rotate it.
        numbers.getChildren().add(label);
    }

这不起作用，数字只是在中心旋转，但我希望它们向外移动（到外圈的边缘，就像普通时钟一样。有人能帮我吗？非常感谢。

Answer 1

如果将 Translate 与 Rotate 结合使用，变换：

Group numbers = new Group();
for(int i = 0; i < 12; i++){
    //create a label.
    Label label = new Label(String.valueOf(i==0?12:i));
    label.getTransforms().add(new Rotate(i * (360d / 12d)));
    label.getTransforms().add(new Translate(100d,100d));

    numbers.getChildren().add(label);
}

您将拥有一个 'rotated' 时钟：

但是如您所见，您旋转的是标签，而不是它们的位置。

解决这个问题的一种方法是使用小 Circle 找到每个标签的位置，将其旋转到最终位置，然后移动标签：

Group numbers = new Group();
for(int i = 0; i < 12; i++){
    //create a label.
    Label label = new Label(String.valueOf(i==0?12:i));
    Circle c=new Circle(1);

    c.getTransforms().add(new Rotate(i * (360d / 12d)));
    c.getTransforms().add(new Translate(0,-100));

    label.setTranslateX(c.localToParent(0,0).getX());
    label.setTranslateY(c.localToParent(0,0).getY());

    numbers.getChildren().addAll(c,label);
}

请注意，我已将翻译调整为从 12 小时位置开始。

您会注意到标签位于圆圈的右下方，因此您应该相应地移动它们。

编辑

为了避免固定标签位置的需要，您可以使用 StackPane 来包裹每对圆圈和标签：

for(int i = 0; i < 12; i++){
    Label label = new Label(String.valueOf(i==0?12:i));
    Circle c=new Circle(1);

    c.getTransforms().add(new Rotate((i) * (360d / 12d)));
    c.getTransforms().add(new Translate(0,-100d));
    label.setTranslateX(c.localToParent(0,0).getX());
    label.setTranslateY(c.localToParent(0,0).getY());

    StackPane sp = new StackPane(c,label);
    numbers.getChildren().add(sp);
}

最后，看看这个，也许使用圆形窗格更容易。

JavaFX 时钟数转换

JavaFX clock number transitions

java

javafx

transformation

rotation

javafx-2