Cocos2d-x-menuitem

Cocos2d-x 3.0 beginner menuitem

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

Mood: Alas, it's a headache to create an Android app interface over the past few days. It's a bit difficult to get started with ING for the first time ..

Body:

Last time I talked about scene and layer. This time I played menuitem and switched the scenario.

Do you still remember the image of scene?

The other part of the layer in scene is the menu.

Menu is the menu. There is a layer and a menu. It fits our point of view. This engine is quite user-friendly. di ~

A menu is actually a container. It loads some menus. A menu cannot be a button of a menu,

Similar to: A menu is like a basket where various fruits can be installed, but it is not a fruit.

For menu, the API also has a class inheritance diagram:

As you can see, menu is a subclass of layer.

That is to say, the menu can also accept touch screen events. Its priority is-128, and its priority is quite high! (The smaller the value, the higher the priority)

Therefore, the touch screen time is generally better than that of the normal layer.

Well, next let's talk about the cocos2d-x button, that is, menuitem:

Well, menuitem is a subclass of the node class. It has three subclasses:

Menuitemlabel character label menu

Menuitemsprite Image menu

Menuitemtoggle switch menu

Well, let's talk about it separately.

①. Menuitemlabel

API explanation:

An abstract class of the label menu item in the form of "label". Any node that supports the labelprotocol protocol can be added.

Note that labelprotocol has four branches, where the first branch label is newly added to cocos2d-x 3.0,

In the 2.x series, there are three types of texts: labelttf, labelbmfont, and labelatlas. Among them, 3.0 especially advocate the use of lable instead of labelttf and labelbmfont, because the label is faster in rendering.

Next, let's take a look at these four types:

1.Label: createwithttf---- This is how to create a text file in TTF format.

Let's test it:

// Obtain the length and width of the screen visiblesize = Director: getinstance ()-> getvisiblesize (); point origin = Director: getinstance ()-> getvisibleorigin (); ttfconfig config ("fonts/hellokitty. TTF ", 50); Auto label1 = label: createwithttf (config," Hello Cocos2d-x "); label1-> setposition (point (visiblesize. width/2, visiblesize. height * 0.8); this-> addchild (label1 );

Ttfconfig imports the font type. The first parameter indicates the storage location, that is, the TTF file of the font. I downloaded a hellokitty version = ~ online ~ (Powdered ~), The second parameter is the size.

Next, create a label and use your own config to display the output content.

Next, let's take a look at the two steps. Set the location and add it to the current layer. Let's take a look at what we have done ~

This font... It's really hellokitty. O (?_ =) O ~

2.Label: createwithsystemfont----- This is created using the built-in font, which is similar to TTF in 2.x.

The built-in font of the calling system. The code is:

Auto label2 = label: createwithsystemfont ("Hello Cocos2d-x", "impact regular", 25); label2-> setposition (point (visiblesize. width/2, visiblesize. height * 0.7); this-> addchild (label2 );

Of course, do not forget to get the screen size by visiblesize. Here we will not repeat it.

This method can call the built-in font, three essential parameters, the first output content, the second called font name, and the third output font size.

If you do not know the font of your system:

For Windows users, you can view them in the fonts folder under the Windows folder on drive C.

In addition, in my example, there is no problem if the font name contains Chinese characters.

3.Label: createwithbmfont---- Create text using static font files to generate fnt files and corresponding PNG Images

In this example, the font ". fntand. PNG" is used to create an image, and ".png" is an image of each output character. "fnt" stores the position where a character is stored in PNG,

For details about making fnt can see this-> http://blog.csdn.net/qiurisuixiang/article/details/8984288

The code is like this:

auto label3 = Label::createWithBMFont("fonts/myfont.fnt","Hello Cocos2d-x");label3->setPosition(Point(visibleSize.width/2,visibleSize.height*0.4));this->addChild(label3);

The first parameter is the file storage location (. fnt and. PNG), and the second parameter is the content to be output.

4.Label: createwithcharmap---- This corresponds to the creation of Atlas in 2.x. However, there are two ways to match the text in the image. One is to directly set the width and height of each font to be obtained, and the other is to use the fnt file, but the principles are the same.

In this creation, the values itemheight (the height of each text) itemwidth (the width of each text) and startcharmap (the text start ASCII Code) in the plist file or plist file must be included)

Generally, such a chart is used only to describe numbers and letters.

All in all, this formula is critical to the height and width of each text. It doesn't matter if it is stored in. PNG or. plist.

This example is not completed...

The code format is like this:

//. Plistauto label4 = label: createwithcharmap (". plist file storage location "); label4-> setposition (point (visiblesize. width/2, visiblesize. height * 0.2); addchild (label4); label4-> setstring ("Cocos2d-x ");//. pngauto label4 = label: createwithcharmap ("PNG storage location", height of each word, width of each word, ASCII code starting from); label4-> setposition (point (visiblesize. width/2, visiblesize. height * 0.2); addchild (label4); label4-> setstring ("Cocos2d-x ");

The last line is the content to be displayed.

Well, this is the time to come and talk about some things of menuitem.

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

Cocos2d-x-menuitem