Cocos2d-x 4.0 learning path (4) simple learning HelloWorld code

Let's start learning from the beginning of the HelloWorld code.
So how is the HelloWorld window displayed? We have to find the entry program, of course, the Main function. The following is the HelloWorld project directory:

open main.cpp, there are 2 lines of code, the actual entrance is Classes \ AppDelegate.cpp

AppDelegate.cpp

There is a applicationDidFinishLaunching()method in it. This is the real entry point of the program (it is also the entry point of cross-platform. Please search for how cocos cross-platform). Interpret the code:
1. Define a Director when you come in.

// initialize director
auto director = Director::getInstance();

The role of this director is very powerful, in fact, it is the same as the director in reality. All the scenes, actors, backgrounds, music, etc. to be performed need to be controlled by the director. So next, the director did a lot of things, I chose to write mainly:
2. director->setDisplayStats(true);Set whether to display the game frame and other debugging information. (That is, the digital information in the lower left corner of the HelloWorld screen)
3. director->setAnimationInterval(1.0f / 60);Set the frame rate of the game, 60 frames per second. What is the frame rate? In fact, the game world is constantly changing from picture to picture, which makes people feel the illusion of animation. Then each picture is a frame, then this setting is that 60 pictures can be switched in 1 second.
4. director->setContentScaleFactor();Set the resolution. There will be multiple branches to determine the size of the media you want to display, and the resolution may be set differently. Is it smart?
5. Make auto scene = HelloWorld::createScene();an instance of the HelloWorld scene. All kinds of pictures, menus, labels, etc. on our HelloWorld screen are generated here.
6. The director->runWithScene(scene);comment is very clear and runs. It is the director who makes HelloWorld run!

The size of the default form runs up, and the form display is relatively small, so how do we make the form larger? Just modify this place:

#if (CC_TARGET_PLATFORM == CC_PLATFORM_WIN32) || (CC_TARGET_PLATFORM == CC_PLATFORM_MAC) || (CC_TARGET_PLATFORM == CC_PLATFORM_LINUX)
        glview = GLViewImpl::createWithRect("HelloWorld", cocos2d::Rect(0, 0, designResolutionSize.width, designResolutionSize.height));

Ctrl + F5 to run it, is the window bigger and the resolution higher? Then it is convenient for us to add something to it and watch it later.

HelloWorldScene.cpp

Next, I went to the screen world of HelloWorld.
From AppDelegate, we know that HelloWorld is generated using the createScene () method.

Scene* HelloWorld::createScene()
{
    return HelloWorld::create();
}

Then the HelloWorld::create();execution is a macro function in HelloWorldScene.h.

Its definition is this: (platform / CCPlatformMacros.h)

#define CREATE_FUNC(__TYPE__) \
static __TYPE__* create() \
{ \
    __TYPE__ *pRet = new(std::nothrow) __TYPE__(); \
    if (pRet && pRet->init()) \
    { \
        pRet->autorelease(); \
        return pRet; \
    } \
    else \
    { \
        delete pRet; \
        pRet = nullptr; \
        return nullptr; \
    } \
}

Simply put, the macro function is to replace the parameter __TYPE__ with the value you pass in at compile time. Here is HelloWorld. Then when compiling, it is the following code compiled:

static HelloWorld* create() 
{ 
    HelloWorld *pRet = new(std::nothrow) HelloWorld(); 
    if (pRet && pRet->init()) 
    { 
        pRet->autorelease(); 
        return pRet; 
    } 
    else 
    { 
        delete pRet; 
        pRet = nullptr; 
        return nullptr; 
    } 
}

So what is done in create () is to define an instance of HelloWorld and execute its initialization function pRet->init().
Well, let's go to HelloWorld's Init () method:
1. Call the parent class initialization method, because HelloWorldScene inherits from Scene.

bool HelloWorld::init()
{
    //////////////////////////////
    // 1. super init first
    if ( !Scene::init() )
    {
        return false;
    }
	......
}

2. Added a close button ( MenuItemImage::create). This is the icon in the lower right corner of the screen.

Normally, CloseNormal.png is displayed, and when the mouse is over, CloseSelected.png is displayed. (The pictures and other files in the project are in the Resource folder.)

    /////////////////////////////
    // 2. add a menu item with "X" image, which is clicked to quit the program
    //    you may modify it.

    // add a "close" icon to exit the progress. it's an autorelease object
    auto closeItem = MenuItemImage::create(
                                           "CloseNormal.png",
                                           "CloseSelected.png",
                                           CC_CALLBACK_1(HelloWorld::menuCloseCallback, this));

    if (closeItem == nullptr ||
        closeItem->getContentSize().width <= 0 ||
        closeItem->getContentSize().height <= 0)
    {
        problemLoading("'CloseNormal.png' and 'CloseSelected.png'");
    }
    else
    {
        float x = origin.x + visibleSize.width - closeItem->getContentSize().width/2;
        float y = origin.y + closeItem->getContentSize().height/2;
        closeItem->setPosition(Vec2(x,y));
    }

    // create menu, it's an autorelease object
    auto menu = Menu::create(closeItem, NULL);
    menu->setPosition(Vec2::ZERO);
    this->addChild(menu, 1);

After that, a callback function was set to CC_CALLBACK_1(HelloWorld::menuCloseCallback, this)realize the action of clicking the button (close the program).
Next is to set the position of this button closeItem->setPosition(Vec2(x,y));in the lower right corner.
Finally, add this Menu to the HelloWorld scene:this->addChild(menu, 1);

Summarize the flow of adding controls:
a. Instantiate a control XXX::create(), set the picture in it, set the callback function with actions
b. Set the display position setPosition(). Calculate this by yourself
c. Add to the scenethis->addChild()

3. The following code is relatively easy to understand: added a Label and a sprite.
Label shows HelloWorld. The elf shows the cocos elf icon.
These are the processes mentioned above.

// add a label shows "Hello World"
    // create and initialize a label

    auto label = Label::createWithTTF("Hello World", "fonts/Marker Felt.ttf", 24);
    if (label == nullptr)
    {
        problemLoading("'fonts/Marker Felt.ttf'");
    }
    else
    {
        // position the label on the center of the screen
        label->setPosition(Vec2(origin.x + visibleSize.width/2,
                                origin.y + visibleSize.height - label->getContentSize().height));

        // add the label as a child to this layer
        this->addChild(label, 1);
    }

    // add "HelloWorld" splash screen"
    auto sprite = Sprite::create("HelloWorld.png");
    if (sprite == nullptr)
    {
        problemLoading("'HelloWorld.png'");
    }
    else
    {
        // position the sprite on the center of the screen
        sprite->setPosition(Vec2(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));

        // add the sprite as a child to this layer
        this->addChild(sprite, 0);
    }

The above is the process of making and displaying the HelloWorld screen.

Then, we can refer to the official documentation for the use of the various controls above :

you can enter, for example, Label in the search bar, you can find an introduction to Label: The


above documentation is just a simple description document, detailed API usage records You must also refer to the API documentation :

The End