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

posted @ 2016-08-23 09:45  Geore  阅读(934)  评论(0编辑  收藏  举报