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);
}

您将拥有一个“旋转”时钟:

但正如您所看到的，您正在旋转标签，而不是它们的位置。

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

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);
}

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