Cocos2d-x scene switch, cocos2d-x scene Switch

Source: Internet
Author: User
Tags addchild

Cocos2d-x scene switch, cocos2d-x scene Switch

* *********************************** Please specify the source: bytes *******************************************




I finally handed over the interface today ,~~ O (>_<) o ~~, It took a lot of time...

Make a scenario switch to celebrate.

PS: Welcome to discuss it together ~, Come on together!


*********************************

This article consists of three parts:

1. Preface

2. Switch the menu button execution scenario

3. Scenario switching Special Effects

*********************************


1. Preface

Scenario switching can be divided into two types,

One is automatic switch. For example, when a game is played, the game is switched upon completion of loading. This generally has an event trigger mechanism.

You can also click switch. For example, you can click a button to switch the callback function.


First, how did the HelloWorld scenario show up after we first created a new project?

When the C ++ program is running, find the main function first. You can find that there is no main function in the Classes of the new project,

Does the cocos2d-x have no main function? Of course... no!

In fact, in the win32 Directory, main. cpp and main. h

Open main. cpp and you will see:

#include "main.h"#include "AppDelegate.h"#include "cocos2d.h"USING_NS_CC;int APIENTRY _tWinMain(HINSTANCE hInstance,                       HINSTANCE hPrevInstance,                       LPTSTR    lpCmdLine,                       int       nCmdShow){    UNREFERENCED_PARAMETER(hPrevInstance);    UNREFERENCED_PARAMETER(lpCmdLine);    // create the application instance    AppDelegate app;    return Application::getInstance()->run();}

The three rows above, needless to say,

The following using namespace cocos2d

Then there is the cocos2d-x entry APIENTRY _ tWinMain

Next, we can see that the AppDelegate object is created, and then, run the function.

Let's talk about this for the time being. If you are interested, you can trace it to see what it is and how to execute it ~


In the AppDelegate class, there is a function applicationDidFinishLaunching ()

This function is called after the program starts. Generally, devices and scenarios are created in this function.

The comments in the function are also awesome .. What? You can't understand English ..

Here I use previous projects, so the scenario created is not HelloWorld.

bool AppDelegate::applicationDidFinishLaunching() {    // initialize director    auto director = Director::getInstance();    auto glview = director->getOpenGLView();    if(!glview) {        glview = GLView::create("My Game");        director->setOpenGLView(glview);    }    // turn on display FPS    director->setDisplayStats(true);    // set FPS. the default value is 1.0/60 if you don't call this    director->setAnimationInterval(1.0 / 60);    // create a scene. it's an autorelease object    auto scene = WelcomeScene::createScene();    // run    director->runWithScene(scene);    return true;}

Then we can see director-> runWithScene

Yes, the director is executing the control scenario.




2. Scenario switching of menu buttons

Well, now let's switch the scenario. First we need to create a scenario. Here we will use the previously created Welcomscene scenario,

Add a button in it and use the callback function of the button to jump to the original HelloWorld scenario of the program.


Here, the scenario jump method is also different:

① Replacement: the current scenario is replaced with a specific scenario, and the original scenario is released.

② Stack-type: Save the current scenario, just like the inbound stack, and press it into the stack to display the new scenario. If the new scenario is released, the original scenario is displayed. The original scenario is not released and memory consumption is high.


① Replace

First, we will demonstrate and replace it with the director's action in the callback function. First, I will create a background layer, that is, a menu button, In the WelcomeScene scenario.

WelcomeScene. h:

# Include "cocos2d. h "class WelcomeScene: public cocos2d: Layer {public: // create a scenario function static cocos2d: Scene * createScene (); virtual bool init (); void menujumpCallback (cocos2d :: ref * pSender); // is a macro definition CREATE_FUNC (WelcomeScene );};

WelcomeScene. cpp:

# Include "WelcomeScene. h "# include" HelloWorldScene. h "USING_NS_CC; // create Scene function scene * WelcomeScene: createScene () {auto Scene = Scene: create (); auto layer = WelcomeScene: create (); scene-> addChild (layer); return scene;} bool WelcomeScene: init () {// determines whether Initialization is possible. If not, return and exit. If (! Layer: init () {return false;} // obtain the screen height and width and the start coordinate. Size visibleSize = Director ctor: getInstance ()-> getVisibleSize (); point origin = Director: getInstance ()-> getVisibleOrigin (); // The background image auto mysprite = Sprite: create ("backg.png "); mysprite-> setPosition (Point (visibleSize. width/2, visibleSize. height/2); this-> addChild (mysprite, 0); // create a menu button, three parameters. The first one is the way before the button is clicked, and the second one is the way after the button is clicked, the third is the function (that is, the callback function) executed by clicking the button auto jumpItem = MenuItemI Mage: create ("icon01.png", "icon01.png", CC_CALLBACK_1 (WelcomeScene: menujumpCallback, this); // you can specify the position (width: width/2 of the button on the rightmost side of the screen, height: the bottom side of the screen-button height/2, because the anchor is in the center, so divided by 2) jumpItem-> setPosition (Point (origin. x + visibleSize. width-jumpItem-> getContentSize (). width/2, origin. y + jumpItem-> getContentSize (). height/2); // Add to menu auto Menu = menu: create (jumpItem, NULL); menu-> setPosition (Point: ZERO ); this-> addChild (m Enu, 1); return true;} void WelcomeScene: menujumpCallback (Ref * pSender) {// create HelloWorld scene auto scene = HelloWorld: createScene (); // Let the Director Use HelloWorld scenario ☆to Replace the current scenario. Note that it is replaced! Director: getInstance ()-> replaceScene (scene );}

If there are comments, I will not explain them in detail. If you do not understand them, feel free to consult ~

Note: When calling a scenario, do not forget to add the header file for that scenario.


Let's take a look at the callback function, create a HelloWorld scenario, and then execute the replaceScene function by the Director, so it is a replacement operation.


② Stack change

Then try again to press the stack to jump out of the stack scenario.

At this time, we need the cooperation of two scenarios,

In this case, the switch is mainly used when the game is in progress and click pause. We need to press the current scene to stack and then bring up the pause interface,

Click pause to return the result. At this time, the stack is displayed, and the original scenario is reproduced.


In this case, let's change the callback function of the close button in the HelloWorld scenario to let it perform the director's pop operation.

WelcomeScene. cpp, only the callback function has changed:

Void WelcomeScene: menujumpCallback (Ref * pSender) {// create HelloWorld scene auto scene = HelloWorld: createScene (); // Let the Director Use HelloWorld scenario ☆press stack ☆current scenario ctor: getInstance ()-> pushScene (scene );}

HelloWorldScene. cpp, which only changes the callback function:

Void HelloWorld: menuCloseCallback (Ref * pSender) {// Let the Director ☆ get out of stack ☆current scenario ctor: getInstance ()-> popScene ();}

We can Push many scenarios, each time the Pop is restored to the previous one, of course, we can also use void popToRootScene () to return to the root scenario, that is, the original scenario.

This is the second type of inbound and outbound stack switching.




3. Switch the animation effect

The Cocos2d-x engine provides a lot of animation effects for switching scenes.

Let's give it a try.

void WelcomeScene::menujumpCallback(Ref* pSender){auto scene=HelloWorld::createScene();auto scene02=TransitionZoomFlipY::create(1.0f,scene);Director::getInstance()->replaceScene(scene02);}

The HelloWorld scenario is created in the first line,

In the scenario where the animation effect is created in the second line, the scenario where the director class is replaced in the third line, and the scenario created in the second line is used.

Generally, the parameters in the second line must be two (how long the animation (floating point type), and the target scenario to be switched)

The third option is generally available. The animation effect api I used this time is as follows:



Orientation is the type of conversion direction:



There are many more animation effects:


// Fade down to another scenario
TransitionCrossFade: create (time, target scenario );

// This scenario fades out and then appears in another scenario.
TransitionFade: create (time, target scenario );

// This scenario disappears from the upper right corner to the lower left corner to another scenario.
TransitionFadeBL: create (time, target scenario );

// This scenario disappears from top to bottom to another scenario
TransitionFadeDown: create (time, target scenario );

// This scenario disappears from the lower left corner to the upper right corner to another scenario
TransitionFadeTR: create (time, target scenario );

// This scenario disappears from bottom to top to another scenario
TransitionFadeUp: create (time, target scenario );

// In this scenario, the flip disappears to another scenario (in the top oblique corner)
TransitionFlipAngular: create (time, target scenario, style );

// In this scenario, the flip disappears to another scenario (X axis)
TransitionFlipX: create (time, target scenario, style );

// In this scenario, the flip disappears to another scenario (Y axis)
TransitionFlipY: create (time, target scenario );

// This scenario disappears and then another scenario appears
TransitionJumpZoom: create (time, target scenario );

// Another scenario appears from the bottom.
TransitionMoveInB: create (time, target scenario );

// Another scenario occurs from the left
TransitionMoveInL: create (time, target scenario );

// Another scenario occurs from the whole
TransitionMoveInT: create (time, target scenario );

// In another scenario, the entire image appears from the right.
TransitionMoveInR: create (time, target scenario );

// Page flip switch. If bool is true, the forward flip is performed.
TransitionPageTurn: create (time, target scenario, bool );

// This scenario disappears from left to right and appears in another scenario
TransitionProgressHorizontal: create (time, target scenario );

// This scenario disappears from the center to the four sides.
TransitionProgressInOut: create (time, target scenario );

// This scenario disappears from four to the middle and appears in another scenario
TransitionProgressOutIn: create (time, target scenario );

// This scenario disappears to another scenario counterclockwise.
TransitionProgressRadialCCW: create (time, target scenario );

// This scenario disappears clockwise to another scenario
TransitionProgressRadialCW: create (time, target scenario );

// This scenario disappears from top to bottom and appears in another scenario
TransitionProgressVertical: create (time, target scenario );

// After the rotation disappears in this scenario, the rotation occurs in another scenario.
TransitionRotoZoom: create (time, target scenario );

// This scenario is reduced and switched to another scenario.
TransitionShrinkGrow: create (time, target scenario );

// This scenario slides upwards to another scenario
TransitionSlideInB: create (time, target scenario );

// This scenario slides to the Right to another scenario
TransitionSlideInL: create (time, target scenario );

// This scenario slides left to another scenario
TransitionSlideInR: create (time, target scenario );

// This scenario slides down to another scenario
TransitionSlideInT: create (time, target scenario );

// After the three rectangles disappear up and down in this scenario, the three rectangles appear up and down in another scenario.
TransitionSplitCols: create (time, target scenario );

// After the three rectangles disappear from the left and right in this scenario, the three rectangles appear on the left and right in another scenario.
TransitionSplitRows: create (time, target scenario );

// In this scenario, the small square disappears to another scenario.
TransitionTurnOffTiles: create (time, target scenario );

// In this scenario, the flip disappears to another scenario (in the top oblique corner)
TransitionZoomFlipAngular: create (time, target scenario, style );

// In this scenario, the flip disappears to another scenario (X axis)
TransitionZoomFlipX: create (time, target scenario, style );

// In this scenario, the flip disappears to another scenario (Y axis)
TransitionZoomFlipY: create (time, target scenario, style );


OK. Today we are here first. (* ^__ ^ *) ...... Come on!




* *********************************** Please specify the source: bytes *******************************************


How to change the cocos2d-x scene

CCTransitionScene * createTransition (cocos2d: CCTime * t, CCScene * s)
{
Return CCTransitionFadeUp: create (t, s );
}
Use CCDirector: sharedDirector ()-> replaceScene (createTransition (6.0, scene) directly ));
You can!

Cocos2d-x scenario switching problem?

First Program Finance welcome page
CCDirector: sharedDirector ()-> runWithScene (Welcome to scene );
When switching a program, use the following code:
CCDirector: sharedDirector ()-> replaceScene (game interface scene );
This can be achieved.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.