JavaFX逆运动学库2.0

最新推荐文章于 2022-12-16 17:02:41 发布

dnc8371

最新推荐文章于 2022-12-16 17:02:41 发布

阅读量236

点赞数

文章标签： java python android javascript css ViewUI

这是第一篇讲解javafx-ik的基础教程， javafx-ik是JavaFX的逆运动学库。该库的源代码可以从GitHub下载。

什么是

图1：单骨

骨骼是使用javafx-ik库进行逆运动学的基本基础。骨骼具有一定长度和关节，骨骼可以围绕该关节旋转。具有关节的一端称为骨头，另一端称为尾端。图1显示了一根骨头，其头，尾和长度。

在库javafx-ik中 ，骨骼类似于类Bone 。要对其进行初始化，必须至少传递长度，但通常在构造过程中还要设置角度。上面的代码示例设置了一条长度为50且旋转为0的骨骼，这意味着它将水平指向右侧。

// Adding bone b2 to the children of bone b1
b1.getChildren().add(b2);

查看Gist上的代码。

组装骨头

图2：组装两个骨骼

可以组装骨骼来定义动画对象的骨架。通过将一根骨头b1的尾巴连接到另一根骨头b2的头部来链接两根骨头。骨骼b1称为骨骼b2的父级，骨骼b2称为骨骼b1的子级。图2显示了两个相连的骨骼b1和b2 。

Bone类为结构提供两个属性。只读属性parent店骨骼的父，物业孩子是所有儿童骨骼的ObservableList。 以下代码片段显示了如何连接两个骨骼b1和b2 ：

// Adding bone b2 to the children of bone b1
b1.getChildren().add(b2);

查看Gist上的代码。

图3：假人的结构

只读属性角度定义了骨骼及其父骨骼的延伸之间的旋转。值0表示一条直线，值180表示子骨骼与其父骨骼重叠，但指向相反的方向。尽管让父母和孩子在骨骼的骨骼上施加顺序，但通常没有区别，哪个骨骼是父母，哪个骨骼是孩子。通过重复链接骨骼对象的头和尾，可以创建链。这种简单的结构用于毛毛虫样品中。复杂对象是使用骨骼树定义的。骨骼的确切位置取决于父对象的位置和旋转。树的顶部没有父级的骨骼称为根骨骼。在初始化过程中，对根骨骼的处理略有不同。根骨骼的属性角度定义了其在整个场景中的旋转。您可以认为它的父骨骼水平指向右侧。现在，我们可以定义虚拟对象的结构，如图3所示。可以在下面的代码示例中看到生成虚拟对象骨架的代码。

// Definition of head
final Bone head = new Bone(30, 90);
 
// Definition of torso
final Bone torso = new Bone(80, 0);
head.getChildren().add(torso);
 
final Bone[] upperArm = new Bone[2];
final Bone[] upperLeg = new Bone[2];
 
for (int i=0; i<2; i++) {
 
    // Definition upper arms
    upperArm[i] = new Bone(60, 60 - 90 * i);
 
    // Definition of lower arms
    final Bone lowerArm = new Bone(60, -90);
    upperArm[i].getChildren().add(lowerArm);
 
    // Definition of upper legs
    upperLeg[i] = new Bone(60, 30 - 90*i);
 
    // Definition of lower legs
    final Bone lowerLeg = new Bone(75, 90);
    upperLeg[i].getChildren().add(lowerLeg);
}
 
// Connect arms and legs to head and torso
head.getChildren().addAll(upperArm);
torso.getChildren().addAll(upperLeg);

查看Gist上的代码。

附加视觉组件

骨骼本身不可见。它们只是定义结构。属性内容是Node对象的ObservableList ，可用于将可见元素附加到骨骼。

// Attaching visual elements to a bone
final Bone bone = new Bone(50, 30);
bone.getContent().addAll(
new Circle(20),
new Ellipse(45, 0, 25, 15),
new Circle(80, 0, 10)
);

查看Gist上的代码。

图4：添加视觉元素

附着的Node对象的位置和旋转由基础骨骼确定。所有附加节点的局部坐标系的原点是骨骼的头部位置。如果头部位置已移动，则其所有节点也将移动。骨骼的旋转也传递到节点。如果骨骼完全不旋转并且角度值为0，则它是水平指向右。在上面的代码示例中，骨骼定义了两个圆和一个椭圆。该骨骼如图4所示。下面的代码示例显示了所需的更改，这些更改通过附加圆和椭圆来定义虚拟对象的外观。生成的虚拟对象可以在图5中看到。在图片中，我添加了骨骼的符号以使其可见。请注意，视觉组件均不会旋转，并且所有位置都位于骨骼本地。场景中的最终位置和旋转仅根据骨骼的位置和旋转来计算。

// Definition of head
final Bone head = new Bone(30, 90);
head.getContent().add(new Ellipse(20, 15));

// Definition of torso
final Bone torso = new Bone(80, 0);
torso.getContent().add(new Ellipse(40, 0, 50, 20));
head.getChildren().add(torso);

final Bone[] upperArm = new Bone[2];
final Bone[] upperLeg = new Bone[2];

for (int i=0; i<2; i++) {

    // Definition upper arms
    upperArm[i] = new Bone(60, 60 - 90 * i);
    upperArm[i].getContent().add(new Ellipse(22.5, 0, 30, 12.5));

    // Definition of lower arms
    final Bone lowerArm = new Bone(60, -90);
    lowerArm.getContent().addAll(
            new Circle(12.5), 
            new Ellipse(30, 0, 20, 12.5), 
            new Circle(60, 0, 12.5)
    );
    upperArm[i].getChildren().add(lowerArm);

    // Definition of upper legs
    upperLeg[i] = new Bone(60, 30 - 90*i);
    upperLeg[i].getContent().add(new Ellipse(20, 0, 30, 15));

    // Definition of lower legs
    final Bone lowerLeg = new Bone(75, 90);
    lowerLeg.getContent().addAll(
            new Circle(15), 
            new Ellipse(40, 0, 30, 15), 
            new Ellipse(75, -10, 10, 22.5)
    );
    upperLeg[i].getChildren().add(lowerLeg);
}

// Connect arms and legs to head and torso
head.getChildren().addAll(upperArm);
torso.getChildren().addAll(upperLeg);

查看Gist上的代码。

图5：所有视觉元素都附有的假人

将所有内容添加到场景图中

现在只剩下最后一个片段，无法在屏幕上渲染虚拟对象： Skeleton类。 Skeleton类是Scenegraph和带有附加Node对象的骨骼之间的桥梁。它扩展了Parent ，因此可以在Scenegraph中的任何位置添加。可以像场景图中的任何其他节点一样对其进行平移，旋转，缩放和转换。

通过设置任何骨骼的属性骨架，可以链接骨架对象和动画对象的骨骼。您会注意到，相同结构中所有骨骼的属性骨架随后将更新为指向相同的Skeleton对象。同一结构中的两个骨骼不可能指向不同的骨骼对象。

要查看结果，请下载完整的Dummy.java文件。要编译脚本，需要将库javafx-ik添加到类路径中。您可以从GitHub下载源代码。