cocos下的UI编辑器--BoomEditor使用教程（2）--详解File节点：可修改属性的布局文件引用机制

 

　　什么是可修改属性的布局文件引用机制？就是说在引用布局文件的时候，可以更改布局文件的节点属性，并保留这些修改的属性而不受原布局文件的影响，原布局文件的更新只要不与修改的属性冲突，那么引用该布局文件的地方也会得到同步更新。可能有点绕，跟着笔者操作一番就明白了

　　首先参照上一节，打开SampleProject文件夹，再打开bui/component/ Poker.bui和bui/room/ Player.bui，bui/room/ Room.bui，其内容分别如下

 

先编辑bui/room/ Player.bui，打开bui/room/ Player.bui，在节点树面板中，选中card1，card1引用的就是bui/component/ Poker.bui，如图：

 

选中card1后点击EditFile，节点树面板就会变成bui/component/ Poker.bui的节点树，如图：

 

我们先把红桃A改成红桃K，先选择cardValue这个节点，点开资源面板的buiResources，点开Poker.plist，找到r13.png，拖拽其到属性面板的Image File属性中

 

这样红桃A变成了红桃K，点击Home，回到bui/room/ Player.bui本身的节点树，对card2，card3进行与card1同样的操作，结束后应该如下：

 

我们打开bui/component/ Poker.bui，其内容并没有变化，还是红桃A，我们再来对bui/component/ Poker.bui本身进行一些改变，将红桃A变成黑桃A，需将cardValue的ImageFile，littleColor的ImageFile，bigColor的ImageFile，分别设置为b1.png，hei_up.png，hei.png，设置完成后，结果如下：

 

这个时候我们再来打开bui/room/ Player.bui，这时候它的界面应该是下面这个样子

我们改变的三张红桃K会以我们改变的为准，其他部分跟bui/component/ Poker.bui一样，这就是可修改属性的布局文件引用机制：当我们在引用其他布局文件的时候，可以对其内部任意节点的属性进行更改，并保留这些更改，其他没有被更改的属性会一直保持和原布局文件一致。

并且这种引用和可修改没有层数限制，可以A引用B，B引用C，C引用D…这样无限制引用下去，但不能循环引用，比如A引用B，B引用C，C引用A，循环引用编辑器会报错。

再打开bui/room/ Room.bui，可以发现，因为bui/component/ Poker.bui和bui/room/ Player.bui的变化，bui/room/ Room.bui的表现也产生了变化

 

使用File节点

　　了解了File节点的机制，我们再来使用一下，我们将bui/room/ Player.bui里面的五张牌变成六张，首先打开bui/room/ Player.bui，选择牌的父节点，右键选择添加File节点，如图：

 

然后将新的节点命名为card6，并且拖拽bui/component/ Poker.bui到其FilePath中

 

拖拽后如图所示：

 

现在要调整牌的大小，选中card6，点击EditFile后，再选中根节点，设置Position属性为X:160， Y：0，设置Scale属性为：X:0.35，Y:0.35，如图所示

再来打开bui/room/ Room.bui，6张牌已经反应出来了

注意事项：

         引用了一个布局文件后，只能修改其属性，不能添加节点，删除节点，改变节点顺序，如果需要这些操作，只能在原始布局文件中修改。

         每一个File节点都可以通过EditFile按钮进入该节点树来进行属性修改，Parent按钮是返回上一个节点树，Home按钮是返回根节点树

总结：

　　这种引用机制不同于cocoscreator和unity3d的prefab，prefab是完全克隆一个新的，并且对这个克隆体的操作是没有限制的，也不能跟原始的prefab保持一致了，如果要保持一致，那么只能放弃所有更改，相当于重新克隆一个。而cocosbuilder和cocostudio引用了布局文件后，只能修改根节点的一些属性，不能像BoomEditor这样能够修改包括根节点的每一个节点