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的一些重要函数及功能：