cocos2d-x中的锚点(AnchorPoint)理解

cocos2d-x中的锚点(AnchorPoint)理解,第1张

概述锚点的定义 锚点是指节点在进行形状变换、位置变动时依据的基准点。可以想象为钉在墙上用于固定纸张的小图钉,或者公告栏上用于固定纸张用的围棋状的小磁粒。当对某个节点调用setPosition时,cocos2d-x即会将其锚点移动到相应位置;当对节点进行rotate *** 作时,节点也是以锚点所在位置为轴心进行旋转的。具体的定义看CCNode.h中的setAnchorPoint说明: * anchorPoin 锚点的定义 锚点是指节点在进行形状变换、位置变动时依据的基准点。可以想象为钉在墙上用于固定纸张的小图钉,或者公告栏上用于固定纸张用的围棋状的小磁粒。当对某个节点调用setposition时,cocos2d-x即会将其锚点移动到相应位置;当对节点进行rotate *** 作时,节点也是以锚点所在位置为轴心进行旋转的。具体的定义看CCNode.h中的setAnchorPoint说明:
* anchorPoint is the point around which all transformations and positioning manipulations take place.
* It's like a pin in the node where it is "attached" to its parent.

锚点的特征 在cocos2d-x中,锚点是向量化后的点,比如某个480x320的节点,锚点(0,0)在其左下角,锚点(1,1)在其右上角即(480,320)的位置,锚点(0.5,0.5)位于其中点处。注意,锚点可以大于(1,1)或者小于(0,0),这在后面将会给出演示。
* The anchorPoint is normalized,like a percentage. (0,0) means the bottom-left corner and (1,1) means the top-right corner.
* But you can use values higher than (1,1) and lower than (0,0) too.

锚点的默认值 CCNode:- anchorPoint: (x=0,y=0) -m_bIgnoreAnchorPointForposition(false)
CCScene/cclayer/CCSprite:-setAnchorPoint( ccp(0.5f,0.5f) ) -ignoreAnchorPointForposition(true) (在相应的构造函数中可以看到)

@H_301_17@注意:上面提到,设置节点位置时其实是将其锚点移动到指定位置,这有个前提,就是CCNode的m_bIgnoreAnchorPointForposition成员必须为false,它是告诉标志节点移动时是否忽略锚点的标志。在cocos2d-x中,CCNode/CCSprite将其默认为false,而CCScene/cclayer则默认为true,因此,若要使CCScene或者cclayer根据锚点来移动,则要首先调用CCNode::ignoreAnchorPointForposition(false)

@H_301_17@

锚点实例一:精灵的锚点 @H_301_17@以下分别演示对精灵进行变换 *** 作(transformation/position)时,锚点起到的作用

设置位置
// on "init" you need to initialize your instancebool HelloWorld::init(){    //////////////////////////////    // 1. super init first    if ( !cclayer::init() )    {        return false;    }        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();    CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();	CCSprite* sprite1 = CCSprite::create("Closenormal.png");	sprite1->setAnchorPoint( ccp(0,0) );	sprite1->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite1);	CCSprite* sprite2 = CCSprite::create("Closenormal.png");	sprite2->setAnchorPoint( ccp(1,0) );	sprite2->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite2);	CCSprite* sprite3 = CCSprite::create("Closenormal.png");	sprite3->setAnchorPoint( ccp(1,1) );	sprite3->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite3);	CCSprite* sprite4 = CCSprite::create("Closenormal.png");	sprite4->setAnchorPoint( ccp(0,1) );	sprite4->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite4);	CCSprite* sprite5 = CCSprite::create("Closenormal.png");	sprite5->setAnchorPoint( ccp(0.5,0.5) );	sprite5->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite5);    return true;}
@H_301_17@运行结果:

@H_301_17@

设置伸缩
bool HelloWorld::init(){    //////////////////////////////    // 1. super init first    if ( !cclayer::init() )    {        return false;    }        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();    CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();	// 锚点(1,1)	CCSprite* sprite1 = CCSprite::create("Closenormal.png");	sprite1->setAnchorPoint( ccp(1,1) );	sprite1->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite1);	// 锚点、位置与sprite1相同,X轴以锚点为基点伸缩5.0倍	CCSprite* sprite2 = CCSprite::create("Closenormal.png");	sprite2->setAnchorPoint( ccp(1,1) );	sprite2->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite2);	sprite2->setScaleX(5.0f);	// 锚点(0,0)	CCSprite* sprite3 = CCSprite::create("Closenormal.png");	sprite3->setAnchorPoint( ccp(0,0) );	sprite3->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite3);	// 锚点、位置与sprite3相同,X轴以锚点为基点伸缩5.0倍	CCSprite* sprite4 = CCSprite::create("Closenormal.png");	sprite4->setAnchorPoint( ccp(0,0) );	sprite4->setposition(ccp(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2));	this->addChild(sprite4);	sprite4->setScaleX(5.0f);    return true;}
运行结果 设置旋转
bool HelloWorld::init(){    //////////////////////////////    // 1. super init first    if ( !cclayer::init() )    {        return false;    }        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();    CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();	// 锚点(0,origin.y+visibleSize.height/2));	this->addChild(sprite3);	// 锚点、位置与sprite3相同,X轴以锚点为轴顺时针旋转90°	CCSprite* sprite4 = CCSprite::create("Closenormal.png");	sprite4->setAnchorPoint( ccp(0,origin.y+visibleSize.height/2));	this->addChild(sprite4);	sprite4->setRotation(90);	// 顺时针旋转90°    return true;}
运行结果 @H_301_17@

@H_301_17@设置弯曲

bool HelloWorld::init(){    //////////////////////////////    // 1. super init first    if ( !cclayer::init() )    {        return false;    }        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();    CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();	// 锚点(0,origin.y+visibleSize.height/2));	this->addChild(sprite3);	// 锚点、位置与sprite3相同,以锚点为固定点,X轴向右弯曲45°	CCSprite* sprite4 = CCSprite::create("Closenormal.png");	sprite4->setAnchorPoint( ccp(0,origin.y+visibleSize.height/2));	this->addChild(sprite4);	sprite4->setSkewX(45);    return true;}
运行结果 锚点实例二:层的锚点 @H_301_17@cocos2d-x中对cclayer对象setposition时,若希望以锚点为基点,则需要开启bIgnoreAnchorPointForposition标志,否则setposition时不考虑锚点因素。

设置位置
bool HelloWorld::init(){    //////////////////////////////    // 1. super init first    if ( !cclayer::init() )    {        return false;    }        CCSize visibleSize = CCDirector::sharedDirector()->getVisibleSize();    CCPoint origin = CCDirector::sharedDirector()->getVisibleOrigin();	// 创建一个绿色层	cclayercolor* layer1 = cclayercolor::create(ccc4(0,255,255),100,50);	layer1->setAnchorPoint( ccp(0.5,0.5) );	// 设置锚点为中点	// layer->ignoreAnchorPointForposition(false);	layer1->setposition(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2);	// 移动到窗口中点	this->addChild(layer1);	// 创建一个黄色层	cclayercolor* layer2 = cclayercolor::create(ccc4(255,50);	layer2->setAnchorPoint( ccp(0.5,0.5) );	// 设置锚点为中点	layer2->ignoreAnchorPointForposition(false);	layer2->setposition(origin.x+visibleSize.wIDth/2,origin.y+visibleSize.height/2);	// 移动到窗口中点	this->addChild(layer2);	    return true;}
@H_301_17@运行结果

参考资料 @H_301_17@1. cocos2d-x AnchorPoint锚点

@H_301_17@2. CSS3中的transform变形详解

总结

以上是内存溢出为你收集整理的cocos2d-x中的锚点(AnchorPoint)理解全部内容,希望文章能够帮你解决cocos2d-x中的锚点(AnchorPoint)理解所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1006360.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-22

发表评论

登录后才能评论

评论列表(0条)

保存