Cocos2d-x从入门到精通第12课《layer的创建与使用》

一．Layer的概念

Layer,即层。在Cocos2d-x官网上，Layer是这样定义的:



//添加子节点到layer

addChild(Node child )

//添加子节点到layer，并设置它的显示等级

addChild(Node child,int zOrder )

//添加子节点到layer上，并设置他的显示等级和标签

addChild(Node *child, int zOrder, int tag )

其中，Child参数就是节点。对于场景而言，通常我们添加的节点就是层。先添加的层会被置于后添加的层之下。如果需要为它们指定先后次序，可以使用不同的zOrder值。tag是元素的标识号码，如果为子节点设置了tag值，就可以在它的父节点中利用tag值就可以找到它了。层可以包含任何Node作为子节点，包括Sprites(精灵), Labels(标签)，甚至其他的Layer对象。





官网给出的解释很多，很全面，这里给大家总结一下大概意思是：layer是node的子类，用来显示sprite，文本等其他游戏元素，并可以对这些元素在layer上进行操作，如改变他的位置，大小等。另外layer还有一个重要的功能就是用来响应用户的输入操作，例如：触摸操作，输入操作，和加速度计。



看了我的总结是不是有点明白Layer是个什么东东了呢。下面我们通过代码来讲解Layer的创建和使用。

二．Layer的创建

创建Layer两种方法，第一种就是直接创建，代码如下：






我们通过代码以及注释可以看出layer的创建是很简单的。



下面我们来学习一下layer的第二种创建方法，也就是通过继承Layer来实现Layer的创建。这儿需要创建一个C++的类，头文件代码如下：






源文件代码如下：




从代码我们可以看出，这种创建方式首先需要去创建一个C++的类LayerTest，并让它继承Layer，这样LayerTest就是Layer的子类了，也就是说它继承了Layer的方法和相关属性，在项目开发中就可以把它当做一个Layer来使用。在实际开发中，我们经常用到的layer的创建方法就是这种方法，因为这样的创建方法使用起来更灵活，且更容易实现项目开发的模块化,例如我们想在我们的游戏中开发一个“签到面板模块”，就可以通过继承Layer的方法来创建一个自定义的Layer，并在创建出来的Layer上添加需要的游戏元素，进而完成“签到面板模块”所需的业务逻辑和显示效果。

三.Layer的层级关系

Layer的层级关系是本节课的重点，也是难点。所谓Layer的层级关系，指的是layer的遮挡关系，也就是说Layer与Layer之间是有遮挡关系的，而遮挡关系的优先级是通过设置Layer的Zorder来实现的，Zorder值越大的layer，层级也就越高。如果有两个Layer，layer1，layer2，layer1的Zorder的值为1，layer2的ZOrder的值为2，如果layer1和layer2在同一场景且他们有项目重合的部分，那么layer2将会遮挡住layer1的部分显示。下面我们就通过第二个知识点创建的两个Layer，来做一下演示。代码如下：






从代码中我们可以看出，我在HelloWorld类的init方法中创建了两个layer，第一个是通过直接创建的方法创建的Layer，第二种就是通过我们刚才创建的LayerTest类来创建的一个Layer，并把着两个layer都添加到了HelloWorld中。

我们来运行一下我们的项目，可以看到下图：




图中，上面显示“老师给学生讲课”的图片就是我们的layerTest上的srpite贴图，下面显示“火云开发课堂”的图片就是我们layer1上面的sprite的显示贴图。我们可以看到layerTest遮挡住了layer1，也就是说layer1的层级关系是低于layerTest的，你可能会疑问，我们并没有设置它们的Zorder，为什么layerTest的层级就高于layer1呢，这儿我们不得不说一下，造成这个的原因就是因为cocos的渲染机制会把最后添加的节点放到图层的最上面进行渲染，从代码中可以看到我们是先添加的layer1后面才添加的layerTest。所以cocos会把layerTest渲染到layer1上面，也就造成了layerTest遮挡住了layer1。



那么我们想要layer1遮挡住layerTest该如何做呢。这个其实也很简单，就是把我们的layer1的有层级设置高就可以了，我们通过代码：

把layer1的Zorder设置成2，然后运行项目，可以看到如下图：



从图中的标注我们可以看到layer1遮挡住了layerTest，左边标注的红色矩形框捏就是被遮挡住的部分，右边写有“2”的部分就是未被遮挡住的部分。我们通过设置layer1的Zorder改变了两个层之间的层级关系，这个在我们以后的实际开发中也会被经常用到。

四.Layer（一）的总结

Layer在我们实际开发中会被经常用到，Layer会被作为sprite，label，menu等节点的容器来使用，而且这些节点只用通过addChild添加到Layer中才能被渲染显示出来。并且我们可以通过更改Layer的层级关系，也就是更改Layer的Zorder来改变不同层之间的遮挡关系。下节课我们会降到Layer的另外一个重要的功能，就是：Layer如何用来接收用户的输入事件。