Cocos2dx游戏教程（七）：“见缝插针”，Label标签的使用

在创建第二场景中我们不仅看到了Menu的创建，其中是不是还有如下的创建方式啊？

//关卡数字
 auto levelTTF = Label::createWithCharMap("fonts/label/label_ball.png", 14, 20, '0');
 levelTTF->setString(StringUtils::format("%d", 1));
 levelTTF->setPosition(level->getContentSize() / 2);
 level->addChild(levelTTF);

是不是显示如下图里面的数字呢？

那么在这一节中将会主要介绍cocos2dx Label的创建方式。

一、Label介绍

cocos2dx 在3.x中，Label支持四种方式的标签创建。并新增了阴影Shadow、轮廓Outline、发光Glow效果的支持。还支持文字内容的行间距、文字间距、自动换行的设置。

在3.x中，废弃了2.x里的CCLabelTTF、CCLabelAtlas、CCLabelBMFont三个字体类，取而代之的是全新的字体标签Label。
实际上Label是将三个字体类进行了融合，进行统一的管理与渲染，这使得创建字体标签Label的方式更加统一，更加方便。

如下图所示，在3.x中支持如下四种创建方式，下面详细的介绍下创建的方法。

二、Label的创建方式

1、createWithSystemFont
顾名思义，该字体的创建方式是通过系统字体创建
我们看一下函数原型

static Label* createWithSystemFont(const std::string& text, const std::string& font, float fontSize,
    	const Size& dimensions = Size::ZERO, TextHAlignment hAlignment = TextHAlignment::LEFT,
        TextVAlignment vAlignment = TextVAlignment::TOP);

使用方式

auto label = Label::createWithSystemFont("hello", "Arial", 24);
label ->setPosition(100, 100);
this->addChild(label );

创建一个“hello”文本，使用“Arial”系统字体，字体大小是24
将label标签设置在屏幕中（100，100）的位置
将label加入到this指代的对象上

2、createWithTTF
函数原型，有两种方式哦

static Label * createWithTTF(const std::string& text, const std::string& fontFilePath, float fontSize,
        const Size& dimensions = Size::ZERO, TextHAlignment hAlignment = TextHAlignment::LEFT,
        TextVAlignment vAlignment = TextVAlignment::TOP);
        
static Label* createWithTTF(const TTFConfig& ttfConfig, const std::string& text, 
        TextHAlignment hAlignment = TextHAlignment::LEFT, int maxLineWidth = 0);

使用方法，以第一个为例，第二个构造下ttfConfig，和第一种是类似的

auto label = Label::createWithTTF("hello", "fonts/arial.ttf", 24);
label ->setPosition(100, 100);
this->addChild(label );

3、createWithBMFont
函数原型

static Label* createWithBMFont(const std::string& bmfontPath, const std::string& text,
        const TextHAlignment& hAlignment = TextHAlignment::LEFT, int maxLineWidth = 0,
        const Vec2& imageOffset = Vec2::ZERO);

使用方法，

auto label = Label::createWithBMFont("font.fnt","hello");
label ->setPosition(100, 100);
this->addChild(label )

4、createWithCharMap
函数原型，有三种种方式哦

static Label * createWithCharMap(const std::string& charMapFile, int itemWidth, int itemHeight, int startCharMap);
static Label * createWithCharMap(Texture2D* texture, int itemWidth, int itemHeight, int startCharMap);
static Label * createWithCharMap(const std::string& plistFile);

（1）使用png创建，这个大家很熟悉吧，就是我们上面使用的创建方式

//关卡数字
 auto levelTTF = Label::createWithCharMap("fonts/label/label_ball.png", 14, 20, '0');
 levelTTF->setString(StringUtils::format("%d", 1));
 levelTTF->setPosition(level->getContentSize() / 2);
 level->addChild(levelTTF);

（2）使用纹理创建

Texture2D* texture = TextureCache::getInstance()->addImage("fonts/label/label_ball.png");
auto lable = Label::createWithCharMap(texture, 14, 20, '0');
lable->setString("1"); 
label ->setPosition(100, 100);
this->addChild(label )

（3）使用plist创建

auto lable = Label::createWithCharMap("fonts/label_ball.plist");
lable->setString("1");
label ->setPosition(100, 100);
this->addChild(label )

这里的plist是一种文件格式，里面记录了用到字符的图片名称，每个字符的宽，高，起始位置，最常见的是第一种和第二种方式，大家可以尝试用不同的方式使用哦。

通过本节的学习，是不是对Label有所了解了呢，下一节让我们加载下游戏数据，关卡将会从文件中读取显示哦