且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

《Cocos2D权威指南》——3.1 Cocos2D节点基础知识

更新时间:2022-09-21 13:52:45

3.1 Cocos2D节点基础知识

在Cocos2D中,CCNode、CCScene和CCLayer这些类是没有视觉呈现的,但它们之间存在一个层级关系。
3.1.1 节点层级图
节点层级图是由所有目前活跃的Cocos2D节点组成的一个层级图,又叫场景继承关系图。除了场景本身,每一个节点只有一个父节点,但是可以有任意数量的子节点。
将节点添加到其他节点中时,就在构建节点场景图。图3-1描绘了一个虚拟的游戏场景图,在顶层是一个场景(CCScene)节点,接下来是层(CCLayer)节点。

《Cocos2D权威指南》——3.1 Cocos2D节点基础知识

CCLayer下一层的子节点构成了游戏的主要元素,它们大多数是精灵(CCSprite)节点,还包括用于显示游戏得分的标签节点,游戏中的菜单节点和菜单项目节点等。
节点层级图的作用在于,对某个节点施加的影响将会影响到它的所有子节点。
3.1.2 什么是锚点
如果觉得锚点这个概念很抽象,可以想象用图钉在墙上订上一张卡片,卡片就相当于节点,墙壁就相当于设备的屏幕,而图钉就是锚点。
在Cocos2D中,锚点的默认位置是在纹理图像的几何中心位置。比如将某个精灵对象的位置设置为(50,50)时,其几何中心位置在默认情况下也应该是(50,50)。
如果将锚点设置在精灵的左下角,并将精灵的位置设置为(50,50)。那么此时应该是精灵的左下角处于(50,50)的位置,而非其几何中心处在该位置。锚点和节点对象的几何形状关系如图3-2所示。

《Cocos2D权威指南》——3.1 Cocos2D节点基础知识

锚点实际上是到节点对象纹理图的偏移。锚点值的范围从(0,0)到(1,1)之间。默认情况下,锚点位于纹理图像的几何中心,即(0.5,0.5)。
锚点很重要的一个作用就是辅助游戏元素进行界面布局定位。如代码清单3-1中所示第2章用到的代码片断所示。
代码清单3-1 第2章游戏中用到的代码片断

CCLabelTTF *lifeIndicator = [CCLabelTTF labelWithString:@"生命值:" fontName:@"Arial" fontSize:20];
      lifeIndicator.anchorPoint = ccp(0.0,0.5);
      lifeIndicator.position = ccp(20,winSize.height - 20);
      [self addChild:lifeIndicator z:10];
      _lifeLabel = [CCLabelTTF labelWithString:@"3" fontName:@"Arial" fontSize:20];
      _lifeLabel.position = ccpAdd(lifeIndicator.position, ccp(lifeIndicator.contentSize.width+10,0));
      [self addChild:_lifeLabel z:10];

注意 通常设置CCNode的position属性是相对于锚点的,而CCLabel的锚点默认设置在节点的中点。所以,当设置CCLabel节点位置时,节点的中心位置也是所设置的坐标位置。