Cocos2d-x之Label

|   版權聲明：本文爲博主原創文章，未經博主容許不得轉載。

 

　　在遊戲開發中常常會使用標籤文字，例如，遊戲介紹，玩家積分，菜單選項，文字提示等等。
     LabelTTF 直接支持使用 TTF 字庫，能夠支持所有的中文，可是效率稍低。LabelBMFont 適合顯示特定的文字，經過預先將文字生成圖片，提升了效率，不能支持所有中文。若是使用的文字很少，組合多，可是文字的編碼是連續的，好比數字，或者英文字符，那麼 LabelAtlas 更加適合你。實際上 Label 須要從字庫中抽取字形，經過字形建立圖片紋理，而後才能顯示出來。
cocos2d的三種建立標籤的方法：            

1. LabelTTF 方法：
    LabelTTF,字體標籤，即經過使用系統字體來建立標籤
2. LabelBMFont 方法：
    LabelBMFont，位圖標籤，每個字都是一個位圖精靈   
3. LabelAtlas 方法：
    LabelAtlas，圖集標籤，經過一張圖片和配置信息來建立文字

LabelTTF字體標籤：
LabelTTF字體標籤使用較少，由於渲染的效率相於LabelBMFont和LabelAtlas的渲染效率較差，建立LabelTTF字體標籤時：通常使用靜態的create()方法來建立，由於這樣不用手動的來管理內存的問題
LabelTTF的建立方法以下：
1.    LabelTTF* LabelTTF::create(const std::string& string, const std::string& fontName, float fontSize)
該方法第一個參數表示將要顯示的文字，第二個參數表示使用字體的名稱，第三個參數表示字體的大小
2.    LabelTTF* LabelTTF::create(const std::string& string, const std::string& fontName, float fontSize, const Size& dimensions, TextHAlignment hAlignment, TextVAlignment vAlignment)
該方法第一個參數表示將要顯示的文字，第二個參數表示使用字體的名稱，第三個參數表示字體的大小，第四個參數表示顯示區域的大小，第五個參數表示水平對齊的方法，第六個參數表示垂直對齊的方法
水平對齊的枚舉常量：

enum class TextHAlignment
{
    LEFT,
    CENTER,
    RIGHT,
};
enum class TextVAlignment
{
    TOP,
    CENTER,
    BOTTOM,
};

3.    除了上述建立方法，LabelTTF的經常使用方法有
    virtual void setString(const char* label);和 virtual const char* getString(void);
    這兩個方法的做用是設置文本的內容和得到文本的內容。在遊戲中要使用一個定時器來時時更新遊戲的分數或者積分等等

.h files

#ifndef _LABELDEMO_SCENE_H_
#define _LABELDEMO_SCENE_H_
#include "cocos2d.h"
class LabelDemo : public cocos2d::Layer
{
private:
	cocos2d::Size visibleSize;
	cocos2d::Vec2 origin;
	//設置積分的字體標籤變量的定義
	cocos2d::LabelTTF* scoreLabel;
public:
	static cocos2d::Scene* createScene();
	virtual bool init();
	void Label_1();
	void Label_2();
	//更新積分的函數
	void updateScore(float dt);
	CREATE_FUNC(LabelDemo);
};
#endif // _LABELDEMO_SCENE_H_



.cpp files

#include "LabelDemoScene.h"
USING_NS_CC;
int Score = 0;
Scene* LabelDemo::createScene()
{
	auto scene = Scene::create();
	auto layer = LabelDemo::create();
	scene->addChild(layer);
	return scene;
}
bool LabelDemo::init()
{
	if (!Layer::init())
	{
		return false;
	}
	visibleSize = Director::getInstance()->getVisibleSize();
	origin = Director::getInstance()->getVisibleOrigin();
	Label_1();
	Label_2();
	scoreLabel = LabelTTF::create("Score: ", "Arial", 24);
	//設置錨點
	scoreLabel->setAnchorPoint(Vec2(0, 1));
	//設置積分顯示的位置在左上角
	scoreLabel->setPosition(10, visibleSize.height - 10);
	addChild(scoreLabel);
	//設置一個定時器
	schedule(schedule_selector(LabelDemo::updateScore));
	return true;
}
void LabelDemo::updateScore(float dt)
{
	Score++;
	scoreLabel->setString(__String::createWithFormat("Score: %5d", Score)->getCString());
}
void LabelDemo::Label_1()
{
	auto label = LabelTTF::create("LabelTest", "fonts/Marker Felt.ttf", 24);
	label->setPosition(Vec2(origin.x + visibleSize.width / 3 - label->getContentSize().width,
		origin.y + visibleSize.height / 3 - label->getContentSize().height));
	addChild(label);
}
void LabelDemo::Label_2()
{
	//首先要建立一個大小固定的顏色圖層，而後再建立一個文本標籤再將此標籤放到顏色圖層中去
	Size size = Size(70, 70);
	auto colorlayer = LayerColor::create(Color4B(255, 125, 0, 255), size.width, size.height);
	LabelTTF* label = LabelTTF::create(
		"Lipei",
		"fonts/Marker Felt.tt",
		24,
		size,
		//	TextHAlignment和TextVAlignment兩個水平和垂直的對齊方式；有
		//	CENTER, LEFT, RIGHT三個基準變量，分別表示居中，居右，居左對齊
		TextHAlignment::CENTER,
		TextVAlignment::CENTER
		);
	label->setPosition(Vec2(origin.x + colorlayer->getContentSize().width / 2,
		origin.y + colorlayer->getContentSize().height / 2));
	colorlayer->addChild(label);
	colorlayer->setPosition(Vec2(origin.x + visibleSize.width / 3,
		origin.y + visibleSize.height / 3));
	addChild(colorlayer);
}

 

LabelTTF的一些重要函數及功能：

 

LabelBMFont位圖標籤：

        LabelBMFont類繼承自SpriteBatchNode，使用的圖片能夠批量加載，這樣提升了渲染的效率。另外，能夠可以把每個字符當作一個Sprite使用，這意味着每個單獨的字符均可以有本身的動做，例如放大，旋轉，縮小，改變透明度等等。依賴於.fnt文件來建立字體，還有一個png的對應字體文件圖片，LabelTTF 每次調用改變文字的時候，都會建立一個新的 OpenGL 紋理。這意味着改變文字和建立一個新的標籤同樣慢。 因此，當須要頻繁的更新的時候，少去使用標籤對象。而 LabelAtlas 或者 LabelBMFont 能夠實現這種效果。
通常使用LabelBMFont類的靜態方法create來建立LabelBMFont實例

static LabelBMFont* create(const char* str, const char* fnFile);
第一個參數是要顯示的內容
第二個參數是fnt配置文件，該配置文件中描述類使用哪一個圖片文件，以及每一個字符圖片的屬性

 

實例：

.h files

#ifndef _LABELBMFONTTEST_SCENE_H_
#define _LABELBMFONTTEST_SCENE_H_
#include "cocos2d.h"
class labelBmFont : public cocos2d::Layer
{
private:
	cocos2d::Size visible;
	cocos2d::Vec2 origin;
public:
	static cocos2d::Scene* createScene();
	virtual bool init();
	void Test_1();
	//對齊方式的測試
	void Test_2();
	CREATE_FUNC(labelBmFont);
};
#endif // _LABELBMFONTTEST_SCENE_H_



.cpp files

#include "LabelBMFontTest.h"
USING_NS_CC;
Scene* labelBmFont::createScene()
{
	auto scene = Scene::create();
	auto layer = labelBmFont::create();
	scene->addChild(layer);
	return scene;
}
bool labelBmFont::init()
{
	if (!Layer::init())
	{
		return false;
	}
	visible = Director::getInstance()->getVisibleSize();
	origin = Director::getInstance()->getVisibleOrigin();
	Test_1();
	Test_2();
	return true;
}
void labelBmFont::Test_1()
{
	auto labelBMFont = LabelBMFont::create("MyGame", "bitmapFontTest3.fnt", 24);
	labelBMFont->setPosition(Vec2(origin.x + visible.width / 2,
		origin.y + visible.height - labelBMFont->getContentSize().height));
	//下面顯示單個字符的動做；
	//首先要取到那個要執行特定動做的字符
	//getChildByTag表示要取到的那個字符在數組中的位置；由於My Game存儲在數組中
	//0表示 M；以此類推
	Sprite* l1 = (Sprite*)labelBMFont->getChildByTag(1);//取得y
	Sprite* l2 = (Sprite*)labelBMFont->getChildByTag(4);//取得m
	//執行動做
	auto s = RotateBy::create(2, 360);
	auto blink = Blink::create(1, 5);
	//重複執行該動做,閃爍 旋轉
	auto repeat = RepeatForever::create(blink);
	auto repeat1 = RepeatForever::create(s);
	//運行此動做
	l1->runAction(repeat);
	l2->runAction(repeat1);
	this->addChild(labelBMFont);
}
void labelBmFont::Test_2()
{
	auto label = LabelBMFont::create
		("Lipei",
		"bitmapFontTest3.fnt",
		24,
		TextHAlignment::CENTER,
		Vec2::ZERO
		);
	label->setPosition(Vec2(visible.width / 2 + origin.x,
		origin.y + visible.height / 2));
	Sprite* l0 = (Sprite*)label->getChildByTag(0);
	auto s = RotateBy::create(2, 360);
	auto repeat = RepeatForever::create(s);
	l0->runAction(repeat);
	this->addChild(label);
}

 

 LabelAtlas圖集標籤:
      LabelAtlas和LabelBMFont相似也須要從一個圖片文件中取得字符，可是他們的實現原理是不一樣的。比較重要的是，LabelAtlas的字符要按照 ASCII 順序排列，咱們要設置第一個字符的 ASCII 編碼，這樣，Cocos2d-x 就能夠直接計算出不一樣字符對應的圖形了。這個類會將傳入的圖片"分紅"指定寬高的小塊，根據須要得到字符的ASCII與startCharMap指定的圖中的第一個字符的ASCII計算偏移量，取得對應的小塊。這就須要圖片中的字符是按照ASCII的順序連續排列的，咱們先來看下LabelAtlas的基本實例化方法create：

static LabelAtlas* create(const char* string, const char* charMapFile, unsigned int itemWidth, unsigned int itemHeight, unsigned int startCharMap);
第一個參數是要顯示的字符；
第二個參數是圖片文件的路徑；
第三個參數是字符寬度；
第四個參數是字符高度；
第五個參數是開始字符

 

實例：

.h files

#ifndef _LABELATALSTEST_SCENE_H_
#define _LABELATALSTEST_SCENE_H_
#include "cocos2d.h"
class labelAtals : public cocos2d::Layer
{
private:
	cocos2d::Size visible;
	cocos2d::Vec2 origin;
public:
	static cocos2d::Scene* createScene();
	virtual bool init();
	void Test1();
	void Test2();
	CREATE_FUNC(labelAtals);
};
#endif // _LABELATALSTEST_SCENE_H_



.cpp files

#include "LabelAtalsTest.h"
USING_NS_CC;
Scene* labelAtals::createScene()
{
	auto scene = Scene::create();
	auto layer = labelAtals::create();
	scene->addChild(layer);
	return scene;
}
bool labelAtals::init()
{
	if (!Layer::init())
	{
		return false;
	}
	visible = Director::getInstance()->getVisibleSize();
	origin = Director::getInstance()->getVisibleOrigin();
	Test1();
	Test2();
	return true;
}
void labelAtals::Test1()
{
	auto label = LabelAtlas::create("Hit Rats", "tuffy_bold_italic-charmap.plist");
	label->setPosition(Vec2(origin.x + visible.width / 2 - label->getContentSize().width / 2,
		origin.y + visible.height / 2));
	this->addChild(label);
}
void labelAtals::Test2()
{
	//第一個參數爲： 要顯示的字符串
	//第二個參數爲： 配置配置文件 .png 格式的
	//第三，四個參數表示顯示字體的寬和高
	//第五個參數表示爲：開始顯示的字符
	LabelAtlas* label1 = LabelAtlas::create("123 made", "tuffy_bold_italic-charmap.png", 48, 64, '2');
	label1->setPosition(Vec2(origin.x + visible.width / 2 - label1->getContentSize().width / 2,
		origin.y + visible.height / 3));
	this->addChild(label1);
}

  

 

LabelAtlas的一些重要函數及功能：