Cocos2d-x learning MoonWarriorsx (I) Start Menu

Source: Internet
Author: User

Open the html5 project. I use WebStorm. Then we can see the MoonWarriors source code, as shown below: the source code is under the src directory, and the config directory contains the configuration information, such as the game status, score, and number of messages. The next step is the game js Code. You can see what the name is. I start from the Start Menu. The html5 Start Menu code is SysMenu. js. I rewritten it with a cocos2d-x based on its logic. Check the effect. This menu has several elements: menu items, logo, airplane, background image, and fps. This class inherits CCLayer. Similar to the structure in HelloWorld. No constructor is displayed. Struct. Why is there no constructor? A brief explanation. The engine introduces reference counting to manage the memory. To facilitate developers, it packs C ++ stuff like O-c. This structure can be seen in many places, also known as "two-phase structure ". The following process: there is a macro-Defined Function CREATE_FUNC (StartMenu) at the bottom. The Code shows that it is a create () function. First, a new object is added, and then the return value of its init () function is viewed. If init is successful, the object is added to the Auto Release pool. Otherwise, null is returned. Therefore, if you use this structure to define the class, you need to implement the init () function. All the interface elements are completed in the init () function, and then some callback functions are provided below. update () is used to complete random flight of the plane. 1. background [cpp] CCSprite * sl = CCSprite: create (s_loading); sl-> setAnchorPoint (ccp (0, 0); this-> addChild (sl, 0, 1 ); CCSprite * sl = CCSprite: create (s_loading); sl-> setAnchorPoint (ccp (0, 0); this-> addChild (sl, 0, 1); is a CCSprite, set its anchor and add it. If the anchor is set to (0, 0), it indicates that the base point is the lower-left corner of the anchor. The addChild function has three parameters. The first parameter is the child to be added, and the second parameter is the zcoordinate, which determines the hierarchy. The screen points to the outside of the screen. The larger the value, the higher the upper layer, the 3rd parameters are tag tags and can be obtained when needed. Www.2cto.com 2. logo [cpp] CCSprite * logo = CCSprite: create (s_logo); logo-> setAnchorPoint (ccp (0, 0); logo-> setPosition (ccp (0,250 )); this-> addChild (logo, 10, 1); CCSprite * logo = CCSprite: create (s_logo); logo-> setAnchorPoint (ccp (0, 0 )); logo-> setPosition (ccp (0,250); this-> addChild (logo, 10, 1); this is also a CCSprite, set the anchor, set the location, and Add. Set the anchor to (0, 0), that is, set the position (0,250) in the lower left corner of the logo at (0,250, the rest is determined based on the opengl coordinate system. 3. menus are all made of images. Therefore, CCSprite is used to implement [cpp] CCSprite * newGameNormal = CCSprite: create (s_menu, CCRectMake (0, 0,126, 33 )); CCSprite * newGameSelected = CCSprite: create (s_menu, CCRectMake (0, 33,126, 33); CCSprite * newGameDisabled = CCSprite: create (s_menu, CCRectMake (0, 33*2,126, 33); CCSprite * newGameNormal = CCSprite: create (s_menu, CCRectMake (0, 0,126, 33); CCSprite * newGameSelected = CCSprite: Create (s_menu, CCRectMake (0, 33,126, 33); CCSprite * newGameDisabled = CCSprite: create (s_menu, CCRectMake (0, 33*2,126, 33 )); this is the three states of a menu item. s_menu is the index of the menu image. The menu image is shown below, which contains all menu items, therefore, coordinates must be used to create a menu item. When taking this image, the coordinate system is the screen coordinate system, that is, the origin is in the upper left corner, the right is x, and the down is y. Then create a MenuItem [cpp] named * newGame = role: create (newGameNormal, newGameSelected, newGameDisabled, this, menu_selector (StartMenu: flareEffec); required * newGame = role :: create (newGameNormal, newGameSelected, newGameDisabled, this, menu_selector (StartMenu: flareEffec); the parameter is not mentioned, the fourth is target, and the last is a callback function, click this menu to execute the callback. Here, this callback provides a special effect, that is, when you click newgame, there is a special effect, which will be discussed later. This is only one of the items, and there are two menu items, about and settings, which are the same as newGame. They only use different images and callback. Then create Menu: [cpp] CCMenu * menu = CCMenu: create (newGame, gameSetting, about, NULL); CCMenu * menu = CCMenu: create (newGame, gameSetting, about, NULL); note that the last parameter of version 2.1.0 must be NULL and should be an end sign. Then, [cpp] menu-> alignItemsVerticallyWithPadding (10); this-> addChild (menu, 1, 2); menu-> setPosition (ccp (winSize. width/2, winSize. height/2-80); menu-> alignItemsVerticallyWithPadding (10); this-> addChild (menu, 1, 2); menu-> setPosition (ccp (winSize. width/2, winSize. height/2-80); sets the item layout, with a vertical interval of 10. The zOrder of the add function is set to 1, which indicates the upper layer of the background. Then set the location. NOTE: If no anchor is set, the default value (0.5, 0.5) is in the center. It's almost the same here, and it's just the plane that ran around.

Related Article

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.