Cocos2dx学习笔记9:cocos2dx锚点(Anchor Point)
首页 > cocos2dx专栏 > cocos2dx学习    作者:闭眼就天黑   2015年8月28日 20:01 星期五   热度:9024°   百度已收录  
时间:2015-8-28 20:01   热度:9024° 

锚点(AnchorPoint)是相对坐标,通常用来定义物体内部的点,在cocos2dx中,一般都是以加载精灵来实现游戏元素的表现,而精灵一般都是对应的一张图片资源。

我们在设置精灵位置的时候,要设置精灵中的锚点来和我们的坐标点相对应,就比如人站在地上,我们要设置人的脚为锚点,假如设置人的头为锚点,那么人的身子就都会在底下了。

学习笔记9:图1.png

Anchor Point的两个参数都在0~1之间。一般Node的锚点默认为(0.5, 0.5),而Layer的锚点则在左下角(00)。

cocos2dx中物体的旋转等动作都是围绕锚点进行的。锚点不同,决定着物体的位置不同。描述起来比较抽象,用几张图瞬间就可以明白了。

 

1、设置layer的坐标位置为屏幕的中心vec20.5,0.5

 

auto layer = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

layer->setContentSize(CCSizeMake(80, 80));//设置大小

layer->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

layer->setAnchorPoint(Vec2(0.5,0.5));//设置锚点(0.5,0.5)居中

addChild(layer);//添加到场景并设置绘制层的顺序

 

学习笔记9:图2.png

学习笔记9:图3.png

 

从图中我们可以看出来,我们设置的代码是layer的锚点是居中,而运行显示的则是锚点在左下角(00)位置。这是什么情况呢?

原来是因为Layer比较特殊,它默认忽略锚点。所以要调用ignoreAnchorPointForPosition()接口来改变锚点。

学习笔记9:图4.png

因为ignoreAnchorPointForPosition()默认为true参数,忽略锚点。我们要将参数改为false,为不忽略锚点,这样锚点才会在layer有效果。

学习笔记9:图5.png

这样锚点就在layer层中心点了,如果用精灵来代替层的话这不需要设置ignoreAnchorPointForPosition()函数,直接设置锚点即可。

 

2、设置layer的坐标位置为屏幕的左下角vec20,0

 

auto layer = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

layer->setContentSize(CCSizeMake(80, 80));//设置大小

layer->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

layer->setAnchorPoint(Vec2(0,0));//设置锚点(0,)左下角

layer->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(layer);//添加到场景并设置绘制层的顺序 

 

是不是发现和我们刚才不设置忽略锚点参数为false的时候一样的啊。

学习笔记9:图6.png

学习笔记9:图7.png

 

是不是发现和我们刚才不设置忽略锚点参数为false的时候一样的啊。

 

3、设置layer的坐标位置为屏幕的右下角vec21,0

 

auto layer = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

layer->setContentSize(CCSizeMake(80, 80));//设置大小

layer->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

layer->setAnchorPoint(Vec2(1,0));//设置锚点(1,0)右下角

layer->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(layer);//添加到场景并设置绘制层的顺序

 

学习笔记9:图8.png 

学习笔记9:图9.png 

 

4、设置layer的坐标位置为屏幕的左上角vec20,1

 

auto layer = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

layer->setContentSize(CCSizeMake(80, 80));//设置大小

layer->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

layer->setAnchorPoint(Vec2(0,1));//设置锚点(0,1)左上角

layer->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(layer);//添加到场景并设置绘制层的顺序

学习笔记9:图10.png

学习笔记9:图11.png

 

5、设置layer的坐标位置为屏幕的右上角vec21,1

 

auto layer = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

layer->setContentSize(CCSizeMake(80, 80));//设置大小

layer->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

layer->setAnchorPoint(Vec2(1,1));//设置锚点(0,1)右上角

layer->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(layer);//添加到场景并设置绘制层的顺序

学习笔记9:图12.png

学习笔记9:图13.png

 

相信通过几张图我们可以了解锚点的概念了,锚点位置是针对设置锚点的物体而言,所以图中的锚点都是针对的是红色的方块而言。锚点的起始位置为左下角(0,0)到右上角(1,1),百分比形式设置的。

我们来设置4中颜色的层,其他参数(位置坐标,颜色块大小)相同的情况下,分别设置四个角为锚点。

auto red = LayerColor::create(Color4B(255, 0, 0, 255));//RGBA 颜色数据(红)

red->setContentSize(CCSizeMake(80, 80));//设置大小

red->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

red->setAnchorPoint(Vec2(0,0));//设置锚点(0,0)左下角

red->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(red);//添加到场景并设置绘制层的顺序

auto green = LayerColor::create(Color4B(0, 255,0, 255));//RGBA 颜色数据(绿)

green->setContentSize(CCSizeMake(80, 80));//设置大小

green->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

green->setAnchorPoint(Vec2(0,1));//设置锚点(0,1)左上角

green->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(green, 30);//添加到场景并设置绘制层的顺序

auto blue = LayerColor::create(Color4B(0, 0, 255, 255));//RGBA 颜色数据(蓝)

blue->setContentSize(CCSizeMake(80, 80));//设置大小

blue->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

blue->setAnchorPoint(Vec2(1,0));//设置锚点(1,0)右下角

blue->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(blue, 20);//添加到场景并设置绘制层的顺序

auto white  = LayerColor::create(Color4B(255, 255, 255, 255));//RGBA 颜色数据(白)

white->setContentSize(CCSizeMake(80, 80));//设置大小

white->setPosition(Vec2(origin.x + visibleSize.width/2,origin.y + visibleSize.height/2));//设置坐标

white ->setAnchorPoint(Vec2(1,1));//设置锚点(1,1)右上角

white ->ignoreAnchorPointForPosition(false);//设置忽略锚点

addChild(white , 20);//添加到场景并设置绘制层的顺序

学习笔记9:图14.png

注意:layer层是特殊的,所以锚点默认为忽略状态,而其他node节点的则正常。

锚点相信已经分析的很清楚了(其实我已经哭晕在厕所了)。

 

二维码加载中...
本文作者:闭眼就天黑      文章标题: Cocos2dx学习笔记9:cocos2dx锚点(Anchor Point)
本文地址:https://www.byjth.com/biji/28.html
版权声明:若无注明,本文皆为“闭眼就天黑专栏_技术博客_个人学习总结”原创,转载请保留文章出处。
相关文章

版权所有:《闭眼就天黑专栏_技术博客_个人学习总结》 => 《Cocos2dx学习笔记9:cocos2dx锚点(Anchor Point)
本文地址:https://www.byjth.com/biji/28.html
除非注明,文章均为 《闭眼就天黑专栏_技术博客_个人学习总结》 原创,欢迎转载!转载请注明本文地址,谢谢。

返回顶部    首页    手机版本    版权所有:闭眼就天黑专栏_技术博客_个人学习总结
    站长: 闭眼就天黑    搜索cocos2dx主题 技术支持:闭眼就天黑   皖ICP备14007736号-1  

皖公网安备 34132102000107号

   sitemap