如何在JavaFX中正确显示此特定形状路径？

Question

首先，我是JavaFX编码的初学者。在这里，我实际上正在尝试实施Material Design复选框，因为您可以看到正确的here，并使用API​​的默认CheckBox进行测试，这里是我的内容目前有：

覆盖CheckBox的形状：

.check-box > .box > .mark {
  /* SVG path directly copied from the site. */
  -fx-shape: "M1.73,12.91 8.1,19.28 22.79,4.59";
}

由此产生：

所以基本上，我只是复制了来自here的MD复选框组件使用的SVG路径，但它没有正确显示为我上面描述的图像。我所知道的只是关于SVG路径的基础知识，但绘制如上所述的复杂路径对我来说很难。

现在，我的问题是如何解决这个问题？谢谢你的所有答案。

更新

对于那些对@Iti提供的形状路径看起来很好奇的人，这里是：

Answer 1

-fx-shape中给出的路径是区域的形状，并且隐式关闭（最后一点连接到第一个） - 这解释了您看到的结果，右上角连接到顶部左边创建一个三角形。

您可以使用SVGPath节点使用此确切路径，如以下问题：How to style a SVG using CSS in javaFX FXML

另一种可能性是将路径“转换”为所需形状的轮廓 - 通过以稍高（或更低）的Y值以相反的顺序回溯点：

.check-box > .box > .mark {
    /* SVG path directly copied from the site. */
    -fx-shape: "M1.73,12.91 8.1,19.28 22.79,4.59 22.79,1.59 8.1,16.28 1.73,9.91";
}

在这种情况下，我从每个点的Y值中减去3并以相反的顺序重复它们，因此得到3像素宽的原始形状。请注意，这个非常基本的转换不会模拟任何“斜接”或“关节”效果，但它可以在紧要关头工作。