官方文档

关键词

子节点坐标主体右键父子节点发生变化图片节点参数位置

文字记录

大家好，下边我们讲一下父子节点的关系。父子节点关系也比较简单，其实在一个节点下边还可以添加更多的子节点，称之为父子关系。

我们在 cocos 里边来演示一下，我们在下边拖一个图片上去，这样就创建了一个图片节点，这个图片节点在 canvas 下边，然后我们右键点一下佩奇这个节点，然后在它下边再添加一个 label 节点，把他的名字改一下，比如说我们想用一个 label 节点来显示它的名字，往上拖一下。

在这里边我们设定一下它的名字，那这样的话就构成生了这种父子关系。你看首先有一个佩奇，佩奇下边又下挂了一个子节点叫名字，他们这种关系就是父子关系。那么父子关系有什么特别的地方吗？好，我们可以看一下操作。

那么当我们移动父节点的时候，子节点也会随之移动的，这是它最大的一个特点。比如说我们选中小猪佩奇这个节点，然后向左移动一下，你会发现它的所有的子节点也会随之移动，然后我们试下旋转操作，点下这个旋转，然后可以发现当我们把父节点旋转之后，那子节点也会随之旋转，缩放也这个样子，这就说明当我们操作这个父节点的时候，那子节点的显示状态也会随之发生变化

但是那我们要观察一下，这个子节点的各参数，其实是相对于父节点的，你看在这里边，比如说我们先选中这个小猪佩奇，然后看一下它的坐标值，比如说改成 X 改成10， Y 值改成200，现在是这个值，这个坐标实际上是相对于它的父节点的，这个相对坐标的概念，我们前面讲过，那么当我们移动这个父节点的时候，比如说把它移动到这个位置，然后你再检查下这个子节点，你可以发现子节点的这个坐标并没有发生变化。那是显然的，因为它是相对于父节点的，他们之间的相对关系并没有发生变化。然后我们再试下旋转。当我们旋转这个父节点的时候，点下旋转工具，然后你再检查一下这个子节点，你可以发现子节点的这个参数也都没有变化。我想通过这个演示，大家应该能够明白了这个父子节点的关系。,子节点坐标，子节点各个参数全部都是相对于父节点这个坐标系的

总之，这个子节点的各个参数，位置，旋转什么的都是相对父节点来说的，所以你移动父节点或者旋转父节点的时候，子节点会随之的进行旋转。

那下边我们再来说一下为什么要有父子节点这种设计呢？那么一般你在玩游戏的时候也会发现，比如说我们在这里面设计一个角色，那一个角色上边有时候会显示他的当前的 hb 值，然后下边可能还会有一个阴影，那么那三者其实是有关系的，比如说这个节点移动的时候，我们希望三个可能一起移动，你不能说人走了，影子还留下，你也不能说人走了，这个血条还留在了远处，那这样的话肯定就穿帮了，所以在真正的设计的时候，你可能会建立一个 player 节点，一个空节点，然后建立一个身体，中间主体部分，然后下边一个影子，然后头顶上顶着这样的一个血量的值，这三个节点共同构成了这样的一个角色。那每一个子节点有各自的作用，下边就是影子了，上边显示他的健康值了，中间显示这个人物的主体

这个人物主体下边其实还可以再下挂一些子节点，不过那样设计的话就很多了，我们就不讲那么多，希望通过这个例子大家应该明白了，为什么会有父子节点这样的一个设计，那不管怎么样，大家下去就把这个父子节点给稍微练习一下就可以了。毕竟对于我们初学者可能还没有这么复杂的设计，好，我们这节课就欣赏这么多，谢谢。