cocos2dx-33种场景切换

声  明


       本教程仅用于初学cocos2dx同学使用,内容由本人(孤狼)学习过程中笔记编写,本教程使用cocos2dx版本为2.1.4。本教程内容可以自由转载,但必须同时附带本声明,或注明出处。

gl.paea.cn版权所有。



       欢迎回到“和屌丝一起学cocos2dx”系列教程,上节我们说到了“24种基本特效”,不知道大家做出来了没有呢?这节课,我们又要开始新的征途了哦,大家准备好了没啊,我们这节要学习33种切换场景。也是很常用的哦,大家可要好好学啊。


【一】:为啥学他


       废话,你说为啥,不说了。


【二】:函数


1.创建


       CCScene * scene2=Scenedemo2::scene();


2.函数


[1]:CCTransitionCrossFade::create(时间,目标场景);

   //慢慢淡化到另一场景

[2]:CCTransitionFade::create(时间,目标场景);

   //本场景变暗消失后另一场景慢慢出现

[3]:CCTransitionFadeBL::create(时间,目标场景);

   //本场景右上角到左下角方块消失到另一场景

[4]:CCTransitionFadeDown::create(时间,目标场景);

   //本场景从上到下横条消失到另一场景

[5]:CCTransitionFadeTR::create(时间,目标场景);

   //本场景左下角到右上角方块消失到另一场景

[6]:CCTransitionFadeUp::create(时间,目标场景);

   //本场景从下到上横条消失到另一场景

[7]:CCTransitionFlipAngular::create(时间,目标场景,样式 );

   //本场景翻转消失到另一场景(斜上方)

   //样式(可以不写):

   //kCCTransitionOrientationLeftOver(左向右翻转)

   //kCCTransitionOrientationRightOver(右向左翻转)

[8]:CCTransitionFlipX::create(时间,目标场景,样式);

   //本场景翻转消失到另一场景(X轴)

   //样式(可以不写):

   //kCCTransitionOrientationLeftOver(左向右翻转)

   //kCCTransitionOrientationRightOver(右向左翻转)

[9]:CCTransitionFlipY::create(时间,目标场景);

   //本场景翻转消失到另一场景(Y轴)

   //样式(可以不写):

   //kCCTransitionOrientationUpOver(下向上翻转)

   //kCCTransitionOrientationDownOver(上向下翻转)

[10]:CCTransitionJumpZoom::create(时间,目标场景);

   //本场景跳动消失后另一场景跳动出现

[11]:CCTransitionMoveInB::create(时间,目标场景);

   //另一场景由整体从下面出现

[12]:CCTransitionMoveInL::create(时间,目标场景);

   //另一场景由整体从左面出现

[13]:CCTransitionMoveInT::create(时间,目标场景);

   //另一场景由整体从上面出现

[14]:CCTransitionMoveInR::create(时间,目标场景);

   //另一场景由整体从右面出现

[15]:CCTransitionPageTurn::create(时间,目标场景,bool);

   //翻页切换,bool为true是向前翻。

[16]:CCTransitionProgressHorizontal::create(时间,目标场景);

   //本场景从左到右消失同时另一场景出现

[17]:CCTransitionProgressInOut::create(时间,目标场景);

   //本场景从中间到四周消失同时另一场景出现

[18]:CCTransitionProgressOutIn::create(时间,目标场景);

   //本场景从四周到中间消失同时另一场景出现

[19]:CCTransitionProgressRadialCCW::create(时间,目标场景);

   //本场景逆时针消失到另一场景

[20]:CCTransitionProgressRadialCW::create(时间,目标场景);

   //本场景顺时针消失到另一场景

[21]:CCTransitionProgressVertical::create(时间,目标场景);

   //本场景从上到下消失同时另一场景出现

[22]:CCTransitionRotoZoom::create(时间,目标场景);

   //本场景旋转消失后另一场景旋转出现

[23]:CCTransitionShrinkGrow::create(时间,目标场景);

   //本场景缩小切换到另一场景放大

[24]:CCTransitionSlideInB::create(时间,目标场景);

   //本场景向上滑动到另一场景

[25]:CCTransitionSlideInL::create(时间,目标场景);

   //本场景向右滑动到另一场景

[26]:CCTransitionSlideInR::create(时间,目标场景);

   //本场景向左滑动到另一场景

[27]:CCTransitionSlideInT::create(时间,目标场景);

   //本场景向下滑动到另一场景

[28]:CCTransitionSplitCols::create(时间,目标场景);

   //本场景三矩形上下消失后另一场景三矩形上下出现

[29]:CCTransitionSplitRows::create(时间,目标场景);

   //本场景三矩形左右消失后另一场景三矩形左右出现

[30]:CCTransitionTurnOffTiles::create(时间,目标场景);

   //本场景小方块消失到另一场景

[31]:CCTransitionZoomFlipAngular::create(时间,目标场景,样式);

   //本场景翻转消失到另一场景(斜上方)

   //样式(可以不写):

   //kCCTransitionOrientationLeftOver(左向右翻转)

   //kCCTransitionOrientationRightOver(右向左翻转)

[32]:CCTransitionZoomFlipX::create(时间,目标场景,样式);

   //本场景翻转消失到另一场景(X轴)

   //样式(可以不写):

   //kCCTransitionOrientationLeftOver(左向右翻转)

   //kCCTransitionOrientationRightOver(右向左翻转)

[33]:CCTransitionZoomFlipY::create(时间,目标场景,样式);

   //本场景翻转消失到另一场景(Y轴)

   //样式(可以不写):

   //kCCTransitionOrientationUpOver(下向上翻转)

   //kCCTransitionOrientationDownOver(上向下翻转)



【三】:新建场景问题


       如果我说下面你自己用这些函数去做个场景切换特效你会怎么做呢?你是不是会咆哮:“他娘的老子想问的不是怎么切换,而是他娘的怎么创建新场景,你丫的之前木说过啊有木有。”

       好吧,我说过不到你用的时候和你说了也白说。所以,现在告诉你。

       其实创建一个新场景非常简单。复制即可。

       (什么?你让老子复制什么?)

       复制一下自动生成的helloworld.h和helloworld.cpp。因为他们两在一起,就是一个scene,你只要复制一下,然后改个名字就能用了。记得要在文件夹里复制哦,就像这样。



       当然这是偷懒的办法,你也可以直接新建.h和.cpp文件,然后自己写。


       然后我们在vs里把他们加载进来。



       然后这里注意!注意!注意!

       你新建的.h文件的这些地方一定要改掉,不能和其他已有的重复。否则后果自负。



       .cpp文件的也要改哦,么么哒!




       另外说一下生命周期函数

       virtual void onEnter();

       virtual void onEnterTransitionDidFinish();

       virtual void onExit();

       这3个是遇到对应情况时调用的。

       在cpp文件里如果把它们示例了,你可以在开始时放音乐,结束时关闭音乐等等。

       如果他下面的之类需要调用这三个函数,那你就必须写上,否则之类无法继承。

       如果你没有必要的操作,不写也可以。

       调用顺序:

           场景2的init函数

           场景2的onEnter函数

           场景1的onExit函数

           场景2的onEnterTransitionDidFinish函数



       好了,新建一个场景,你会了吗?我们继续吧。


四】:示例


1.新建项目Scenedemo

2.新建scene Scenedemo2(怎么创建会了吧)

3.载入2张不同的图,用于创建2个场景





Scenedemo.h


1.创建一个回调函数用于切换场景

void changescene(CCObject* pSender);

2.创建3个生命周期函数

virtual void onEnter();

virtual void onEnterTransitionDidFinish();

virtual void onExit();



Scenedemo.cpp


1.包含Scenedemo2.h #include "Scenedemo2.h"

2.初始化函数中创建切换菜单

//-new-//

CCSize mysize=CCDirector::sharedDirector()->getWinSize();

CCSprite* sp = CCSprite::create("HelloWorld1.png");

sp->setPosition(ccp(mysize.width/2, mysize.height/2));

this->addChild(sp, 0);

//创建一个菜单

CCMenuItemFont * fontitem=CCMenuItemFont::create("turn 2",this,menu_selector(Scenedemo::changescene));

fontitem->setPosition(ccp(CCDirector::sharedDirector()->getWinSize().width/2, 20));

CCMenu* turnmenu = CCMenu::create(fontitem, NULL);

turnmenu->setPosition(CCPointZero);

this->addChild(turnmenu, 1);

//-new-//



3.实现changescene回调函数


void Scenedemo::changescene(CCObject* pSender){

//新建一个Scenedemo2的scene

CCScene * scene2=Scenedemo2::scene();

////CCTransitionCrossFade切换方式

//CCTransitionScene * s1=CCTransitionCrossFade::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s1);


////CCTransitionFade切换方式

//CCTransitionScene * s2=CCTransitionFade::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s2);


////CCTransitionFadeBL切换方式

//CCTransitionScene * s3=CCTransitionFadeBL::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s3);


////CCTransitionFadeDown切换方式

//CCTransitionScene * s4=CCTransitionFadeDown::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s4);


////CCTransitionFadeTR切换方式

//CCTransitionScene * s5=CCTransitionFadeTR::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s5);


////CCTransitionFadeUp切换方式

//CCTransitionScene * s6=CCTransitionFadeUp::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s6);


////CCTransitionFlipAngular切换方式

//CCTransitionScene * s7=CCTransitionFlipAngular::create(2,scene2,kCCTransitionOrientationRightOver);

//CCDirector::sharedDirector()->replaceScene(s7);


//CCTransitionFlipX切换方式

CCTransitionScene * s8=CCTransitionFlipX::create(2,scene2);

CCDirector::sharedDirector()->replaceScene(s8);


////CCTransitionFlipY切换方式

//CCTransitionScene * s9=CCTransitionFlipY::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s9);


////CCTransitionJumpZoom切换方式

//CCTransitionScene * s10=CCTransitionJumpZoom::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s10);


////CCTransitionMoveInB切换方式

//CCTransitionScene * s11=CCTransitionMoveInB::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s11);


////CCTransitionMoveInL切换方式

//CCTransitionScene * s12=CCTransitionMoveInL::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s12);


////CCTransitionMoveInT切换方式

//CCTransitionScene * s13=CCTransitionMoveInT::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s13);


////CCTransitionMoveInR切换方式

//CCTransitionScene * s14=CCTransitionMoveInR::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s14);


////CCTransitionPageTurn切换方式

//CCTransitionScene * s15=CCTransitionPageTurn::create(2,scene2,false);

//CCDirector::sharedDirector()->replaceScene(s15);


////CCTransitionProgressHorizontal切换方式

//CCTransitionScene * s16=CCTransitionProgressHorizontal::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s16);


////CCTransitionProgressInOut切换方式

//CCTransitionScene * s17=CCTransitionProgressInOut::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s17);


////CCTransitionProgressOutIn切换方式

//CCTransitionScene * s18=CCTransitionProgressOutIn::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s18);


////CCTransitionProgressRadialCCW切换方式

//CCTransitionScene * s19=CCTransitionProgressRadialCCW::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s19);


////CCTransitionProgressRadialCW切换方式

//CCTransitionScene * s20=CCTransitionProgressRadialCW::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s20);


////CCTransitionProgressVertical切换方式

//CCTransitionScene * s21=CCTransitionProgressVertical::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s21);


////CCTransitionRotoZoom切换方式

//CCTransitionScene * s22=CCTransitionRotoZoom::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s22);


////CCTransitionShrinkGrow切换方式

//CCTransitionScene * s23=CCTransitionShrinkGrow::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s23);


////CCTransitionSlideInB切换方式

//CCTransitionScene * s24=CCTransitionSlideInB::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s24);


////CCTransitionSlideInL切换方式

//CCTransitionScene * s25=CCTransitionSlideInL::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s25);


////CCTransitionSlideInR切换方式

//CCTransitionScene * s26=CCTransitionSlideInR::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s26);


////CCTransitionSlideInT切换方式

//CCTransitionScene * s27=CCTransitionSlideInT::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s27);


////CCTransitionSplitCols切换方式

//CCTransitionScene * s28=CCTransitionSplitCols::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s28);


////CCTransitionSplitRows切换方式

//CCTransitionScene * s29=CCTransitionSplitRows::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s29);


////CCTransitionTurnOffTiles切换方式

//CCTransitionScene * s30=CCTransitionTurnOffTiles::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s30);


////CCTransitionZoomFlipAngular切换方式

//CCTransitionScene * s31=CCTransitionZoomFlipAngular::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s31);


////CCTransitionZoomFlipX切换方式

//CCTransitionScene * s32=CCTransitionZoomFlipX::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s32);


////CCTransitionZoomFlipY切换方式

//CCTransitionScene * s33=CCTransitionZoomFlipY::create(2,scene2);

//CCDirector::sharedDirector()->replaceScene(s33);

}



Scenedemo2.h


1.创建一个回调函数用于切换场景

void changescene(CCObject* pSender);

2.创建3个生命周期函数

virtual void onEnter();

virtual void onEnterTransitionDidFinish();

virtual void onExit();


和Scenedemo1.h一样


Scenedemo2.cpp


1.包含Scenedemo.h  #include "Scenedemo.h"

2.初始化函数中创建切换菜单


CCSize mysize=CCDirector::sharedDirector()->getWinSize();

CCSprite* sp = CCSprite::create("HelloWorld2.png");

sp->setPosition(ccp(mysize.width/2, mysize.height/2));

//设置不同颜色区分

sp->setColor(ccc3(100,100,100));

this->addChild(sp, 0);

//创建一个菜单

CCMenuItemFont * fontitem=CCMenuItemFont::create("turn back",this,menu_selector(Scenedemo2::changescene));

fontitem->setPosition(ccp(CCDirector::sharedDirector()->getWinSize().width/2, 20));

CCMenu* turnmenu = CCMenu::create(fontitem, NULL);

turnmenu->setPosition(CCPointZero);

this->addChild(turnmenu, 1);



3.实现changescene回调函数


void Scenedemo2::changescene(CCObject * obj){

//新建一个Scenedemo的scene

CCScene * scene1=Scenedemo::scene();

CCTransitionScene * ss=CCTransitionJumpZoom::create(2,scene1);

CCDirector::sharedDirector()->replaceScene(ss);

}




   好了,最后我们来欣赏一下效果吧



posted @ 2015-08-08 10:40  Anzhongliu  阅读(288)  评论(0编辑  收藏  举报