Cocos2d-x Study Notes (19) -- label, label atlas

Cocos2d-x Study Notes (19) -- label, label atlas
Some preparation work should be done before the official start of the lecture.
First of all, let's talk about the use of a ccV3F_C4B_T2F_Quad class. Don't be scared by this long name. You just need to give a question, so you can see how to use it clearly. Below I put together the materials in the official documents:
 
[Plain]
CcV3F_C4B_T2F_Quad
Member list:
CcV3F_C4B_T2F tl (top left)
CcV3F_C4B_T2F bl (bottom left)
CcV3F_C4B_T2F tr (top rignt)
CcV3F_C4B_T2F br (bottom right)
 
 
Detailed Description: a Point with a vertex point, a tex coord point and a color 4B
(CcV3F_C4B_T2F consists of vertices, texture coordinates, and color settings)
CcV3F_C4B_T2F
Member list:
CcVertex3F vertices
CcColor4B colors
CcTex2d texCoords
 
 
Detailed Description: A vertex composed of 2 floats: x, y.
(The ccVertex3F vertex is composed of x and y coordinates (Note: 2D games only use plane coordinates without zcoordinates ))
CcVertex3F
Member list:
GLfloat x
GLfloat y
GLfloat z
 
Detailed Description: RGBA color composed of 4 bytes.
CcColor4B
Member list:
GLubyte r
GLubyte g
GLubyte B
GLubyte
 
Detailed Description: A texcoord composed of 2 floats: u, y.
CcTex2F
Member list:
GLfloat u
GLfloat v

 
That is to say, the ccV3F_C4B_T2F_Quad class has four member attributes, both of which are ccV3F_C4B_T2F class, indicating the top left, bottom left, top right, and bottom right;
The ccV3F_C4B_T2F class has three member attributes: Set vertex coordinates, texture coordinates, and color;
Then, it corresponds to the member attributes of the above three classes (ccVertex3F, ccColor4B, and ccTex2d;
The second table to be added is the ASICC table. Here I will upload the table and use it for further explanation:

Next, we start to enter the topic ..................
Step 1: Create a cocos2d-x project named labelAtlas;
Step 2: add four classes in HelloWorldScene. h:
[Plain]
Class BasicLayer: public CCLayer
{
Public:
BasicLayer ();
~ BasicLayer ();
 
Void backMenuCallback (CCObject * pSender );
Void restartMenuCallback (CCObject * pSender );
Void nextMenuCallback (CCObject * pSender );
 
};
 
 
Class TextureAtlasTest: public BasicLayer
{
Protected:
CCTextureAtlas * m_atlas;
Public:
TextureAtlasTest ();
~ TextureAtlasTest ();
 
Virtual void draw ();
};
 
 
Class LabelAtlasTest: public BasicLayer
{
Protected:
CcTime m_time;
 
Public:
LabelAtlasTest ();
~ LabelAtlasTest ();
 
Void update (ccTime dt );
};
 
Class LabelTest: public BasicLayer
{
Protected:
CcTime m_time;
Public:
 
LabelTest ();
~ LabelTest ();
 
Void update (ccTime dt );
};

Step 3: Add the following code to HelloWorldScene. cpp:
Add some constants and global variables first.
[Plain]
Static int index = 1;
Const int MAX_INDEX = 3;
Const int tagAtlas = 1; // used to mark the CCLabelAtlas object
Const int tagLabel = 2; // used to mark the CCLabelTFT object
 

[Plain]
CCLayer * runThisTest (int index)
{
Switch (index)
{
Case 1:
Return new TextureAtlasTest ();
 
Case 2:
Return new LabelAtlasTest ();
 
Case 3:
Return new LabelTest ();
 
}
Return NULL;
}

 
 
[Plain]
CCLayer * runThisTest (int index)
{
Switch (index)
{
Case 1:
Return new TextureAtlasTest ();
 
Case 2:
Return new LabelAtlasTest ();
 
Case 3:
Return new LabelTest ();
 
}
Return NULL;
}
Then add the member function:
[Plain]
/*************************************** *********************************/
/* BasicLayer */
/*************************************** *********************************/
BasicLayer: BasicLayer ()
{
CCSize size = CCDirector: shareddire()-> getWinSize ();
 
CCLabelTTF * backLabel = CCLabelTTF: labelWithString ("back", "Arial", 30 );
CCLabelTTF * restartLabel = CCLabelTTF: labelWithString ("restart", "Arial", 30 );
CCLabelTTF * nextLabel = CCLabelTTF: labelWithString ("next", "Arial", 30 );
 
CCMenuItemLabel * backItem = CCMenuItemLabel: itemWithLabel (backLabel, this, menu_selector (BasicLayer: backMenuCallback ));
CCMenuItemLabel * restartItem = CCMenuItemLabel: itemWithLabel (restartLabel, this, menu_selector (BasicLayer: restartMenuCallback ));
CCMenuItemLabel * nextItem = CCMenuItemLabel: itemWithLabel (nextLabel, this, menu_selector (BasicLayer: nextMenuCallback ));
 
CCMenu * backMenu = CCMenu: menuWithItem (backItem );
CCMenu * restartMenu = CCMenu: menuWithItem (restartItem );
CCMenu * nextMenu = CCMenu: menuWithItem (nextItem );
 
AddChild (backMenu, 1 );
AddChild (restartMenu, 1 );
AddChild (nextMenu, 1 );
 
BackItem-> setPosition (ccp (size. width/2-100, 50 ));
RestartItem-> setPosition (ccp (size. width/2, 50 ));
NextItem-> setPosition (ccp (size. width/2 + 100, 50 ));
 
BackMenu-> setPosition (CCPointZero );
RestartMenu-> setPosition (CCPointZero );
NextMenu-> setPosition (CCPointZero );
 
}
 
 
BasicLayer ::~ BasicLayer ()
{
 
}
 
 
Void BasicLayer: backMenuCallback (CCObject * pSender)
{
If (index = 1)
Return;
Index --;
CCScene * scene = new CCScene ();
Scene-> addChild (runThisTest (index ));
CCDirector: sharedDirector ()-> replaceScene (scene );
Scene-> release ();
 
}
 
Void BasicLayer: restartMenuCallback (CCObject * pSender)
{
 
CCScene * scene = new CCScene ();
Scene-> addChild (runThisTest (index ));
CCDirector: sharedDirector ()-> replaceScene (scene );
Scene-> release ();
}
 
Void BasicLayer: nextMenuCallback (CCObject * pSender)
{
If (index = MAX_INDEX)
Return;
Index ++;
CCScene * scene = new CCScene ();
Scene-> addChild (runThisTest (index ));
CCDirector: sharedDirector ()-> replaceScene (scene );
Scene-> release ();
}
 
 
 
/*************************************** *********************************/
/* TextureAtlasTest */
/*************************************** *********************************/
TextureAtlasTest: TextureAtlasTest ()
{
M_atlas = CCTextureAtlas: textureAtlasWithFile ("atlastest.png", 3 );
M_atlas-> retain ();
 
CCSize size = CCDirector: shareddire()-> getWinSize ();
 
// CcV3F_C4B_T2F_Quad quad = {
// {0, 0}, ccc4 (255,255,255,255), {0.0f, 1.0f},}, // bottom left
// {Size. width, 255,255,255}, ccc4 (, 0), {1.0f, 1.0f},}, // bottom right
// {0, size. height, 0}, ccc4 (255,255,255, 0), {0.0f, 0.0f},}, // top left
// {Size. width, size. height, 0 },{ 255,255,255,255}, {1.0f, 0.0f },}, // top right
//};
 
 
CcV3F_C4B_T2F_Quad quad = {
{40, 40, 0}, ccc4 (255,255,255,255), {0.0f, 0.2f},}, // bottom left
{0,255, 80, 0}, ccc4 (,), {0.5f, 0.2f},}, // bottom right
{40,160, 0}, ccc4 (255,255,255,255), {0.0f, 0.0f},}, // top left
{160,160, 0}, ccc4 (0,255, 0,255), {0.5f, 0.0f},}, // top right
};
 
M_atlas-> updateQuad (& quad, 1 );
}
 
TextureAtlasTest ::~ TextureAtlasTest ()
{
M_atlas-> release ();
}
 
Void TextureAtlasTest: draw ()
{
M_atlas-> drawQuads ();
}
 
 
 
 
/*************************************** *********************************/
/* LabelAtlasTest */
/*************************************** *********************************/
LabelAtlasTest: LabelAtlasTest ()
{
CCSize size = CCDirector: shareddire()-> getWinSize ();
 
M_time = 0;
CCLabelAtlas * atlas = CCLabelAtlas: labelWithString ("0123456789", "fps_images.png ,'.');
AddChild (atlas, 0, tagAtlas );
Atlas-> setPosition (ccp (size. width/2, size. height/2 ));
 
Schedule (schedule_selector (LabelAtlasTest: update ));
}
 
 
LabelAtlasTest ::~ LabelAtlasTest ()
{
 
}
 
Void LabelAtlasTest: update (ccTime dt)
{
M_time + = dt;
 
Char str [20] = {0 };
Sprintf (str, "% 2.2f", m_time );
 
CCLabelAtlas * label = (CCLabelAtlas *) getChildByTag (tagAtlas );
Label-> setString (str );
}
 
 
 
/*************************************** *********************************/
/* LabelTest */
/*************************************** *********************************/
 
LabelTest: LabelTest ()
{
CCSize size = CCDirector: shareddire()-> getWinSize ();
 
M_time = 0;
Char str [20] = {0 };
Sprintf (str, "% 2.2f", m_time );
CCLabelTTF * label = CCLabelTTF: labelWithString (str, "Arial", 30 );
AddChild (label, 0, tagLabel );
Label-> setPosition (ccp (size. width/2, size. height/2 ));
 
Schedule (schedule_selector (LabelTest: update ));
}
 
 
LabelTest ::~ LabelTest ()
{
 
}
 
Void LabelTest: update (ccTime dt)
{
M_time + = dt;
 
Char str [20] = {0 };
Sprintf (str, "% 2.2f", m_time );
 
CCLabelTTF * label = (CCLabelTTF *) getChildByTag (tagLabel );
Label-> setString (str );
}

 
Finally, modify the HelloWorld: scene function and change HelloWorld * layer = HelloWorld: node (); To LabelTest * layer = new LabelTest ();
The following describes the CCLabelAtlas * atlas = CCLabelAtlas: labelWithString ("0123456789", "fps_images.png", 16,32, '.'); function.
The first parameter is the displayed content;
The second parameter is the image Resource Name;
The third parameter is the width of each character. The total width of the image is 265px and 16px is the width of each character, 16x16 = 256, here, I divide the blank space behind the image into four characters, so there is a total of 16 characters in width;
The fourth parameter is the height of each character, which is 32 px in width;
The fifth parameter is the start character. When the first character in the character image is '.';

 

Note that the character sequence is the same as that in the ASICII table, and the ASICII code is connected between characters.
 
 
Here I have listed two methods for label setting. One is to use CCLabelTFT, and the other is to use CCLabelAtlas. The usage mechanism of the two is different.
CCLabelTFT is the string to be displayed to generate a bitmap and then render it.
In addition, CCLabelAtlas pre-adds images to the cache.
Therefore, when setString is frequently called, the efficiency of CCLabelTFT is much slower.
Step 4: Compile and run the program. The effect is as follows: