视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
理解Cocos2d里的anchorPoint
2020-11-09 07:58:44 责编:小采
文档


要解释anchorPoint首先需要理解cocos2d里的坐标系统。在cocos2d中有两个坐标系统,一个是touch input使用的,屏幕坐标系统,其原点在左上角,正方向分别朝右和向下。另一个是屏幕绘制用的,使用opengl坐标系统,其原点在左下角,正方向分别朝右和向上。 一般


要解释anchorPoint首先需要理解cocos2d里的坐标系统。在cocos2d中有两个坐标系统,一个是touch input使用的,屏幕坐标系统,其原点在左上角,正方向分别朝右和向下。另一个是屏幕绘制用的,使用opengl坐标系统,其原点在左下角,正方向分别朝右和向上。

一般来说,我们在游戏中都使用opengl坐标系统,在处理屏幕点击事件时先要将其转换为opengl坐标系统,使用方法如:

1

2

3

voidYourClass::ccTouchMoved(CCTouch*pTouch,CCEvent*pEvent){

mSprite->setPosition(CCDirector::sharedDirector()->convertToGL(pTouch->locationInView()));

}

好了,再来看anchorPoint。

在cocos2d中所有从CCNode派生的对象都有anchorPoint属性,cocos2d使用position和anchorPoint两个值来决定在哪里绘制对象,另外在旋转的时候,也会依赖这个属性以决定如何进行旋转。

Positioning

对象的position和anchorPoint默认值都是(0,0),这时对象将绘制在屏幕的左下角,比如下面的代码显示的结果:

1

2

3

4

CCSprite*sprite=[CCSpritespritewithFile:@"blackSquare.png"];

sprite.position=(0,0);

sprite.anchorPoint=(0,0);

[selfaddChild:sprite];

如果把anchorPoint发为(-1,-1)之后,结果会是这样:

1

2

3

4

CCSprite*sprite=[CCSprite spritewithFile:@"blackSquare.png"];

sprite.position=(0,0);

sprite.anchorPoint=(-1,-1);

[self addChild:sprite];

这张图不是太好理解。

1. anchorPoint的数值单位为是象素单位,而是比例值,取值1表示100%。

2. anchorPoint坐标原点在左下角,(-1,-1)表示在左边一个对象宽度处,下面一个对象高度处。

最后再结合修改position和anchorPoint来看下效果,代码及显示效果如下:

1

2

3

4

CCSprite*sprite=[CCSpritespritewithFile:@"blackSquare.png"];

sprite.anchorPoint=(1,1);

sprite.position=(sprite.contentSize.width,sprite.contentSize.height);

[selfaddChild:sprite];

这次把anchorPoint设为(1,1),表示在图像的右上角,同时把position向右上角移动,移动宽度为sprite的width,高度为sprite的height。最终的效果也就相当于把原点设为(0,0)左下角,坐标也设在左下角的位置。

Rotation

一般情况下,如果需要旋转对象,最好将其anchorPoint设为(0.5,0.5),这样一般能够获得我们所期望的旋转效果。但有些时候,也可以通过设置anchorPoint来实现一些特殊效果,比如,把anchorPoint设为(1,1)即右上角,对象将会绕下面的红点旋转:

如果把anchorPoint设为(2,2),一个离对象右上角一个对象远的地方,那么旋转的时候将会像下面这样:

下载本文
显示全文
专题