cocos2dx 3.0版本之前,我们一直都是用CCLabelTTF,CCLabelBMFont,CCLabelAtlas来创建文本标签,
但是!3.0版本放出来后...看到这里你心里是不是又颤抖了一下?别害怕嘛,我要说的是:
3.0版本出来后这些标签也都是还可以用的啦,只是说我们有了更好的选择。
cocos2dx3.0添加了一种新的文本标签,这种标签不同的地方有:使用freetype来使它在不同的平台上有相同的视觉效果;由于使用更快的缓存代理,它的渲染也将更加快速;同时它还提供了绘边、阴影等特性。
所以因为Label,我决定离开abelTTF和LabelBMFont(这个开头你猜到了么?)
---------------------------------------------------
常用的接口一览(因为很多接口都与LabelTTFT等一样,所以就列一些我所了解的“异类”)
-
- static Label * create(const std::string& text, const std::string& fontName, 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 alignment = TextHAlignment::LEFT, int lineWidth = 0);
-
-
- static Label* createWithBMFont(const std::string& bmfontFilePath, const std::string& text,
- const TextHAlignment& alignment = TextHAlignment::LEFT, int lineWidth = 0,
- const Point& imageOffset = Point::ZERO);
-
-
- static Label * createWithCharMap(const std::string& charMapFile, int itemWidth, int itemHeight, int startCharMap);
-
- virtual void enableShadow(const Color3B& shadowColor = Color3B::BLACK,const Size &offset = Size(2,-2), float opacity = 0.75f, int blurRadius = 0);
- virtual void enableOutline(const Color4B& outlineColor,int outlineSize = -1);
- virtual void enableGlow(const Color3B& glowColor);
-
- virtual void disableEffect();
-
-
- enum class LabelEffect {
-
- NORMAL,
- OUTLINE,
- SHADOW,
- GLOW
- };
稍微提一下一个新东西:TTFConfig
-
- typedef struct _ttfConfig
- {
- std::string fontFilePath;
- int fontSize;
- GlyphCollection glyphs;
- const char *customGlyphs;
- bool distanceFieldEnabled;
- int outlineSize;
-
-
- ...
-
- }TTFConfig;
-
-
- enum class GlyphCollection {
-
- DYNAMIC,
- NEHE,
- ASCII,
- CUSTOM
- };
下面简单介绍Label的用法
1、使用.ttf
1)创建
- TTFConfig config2("fonts/Marker Felt.ttf",30);
- auto label2 = Label::createWithTTF(config2,"createWithTTF",TextHAlignment::LEFT);
- label2->setPosition(Point(visibleSize.width/2,300));
- label2->setAnchorPoint(Point::ANCHOR_MIDDLE);
- this->addChild(label2,2);
当然了,也可以用Label创建普通的标签,效果和用CCLabelTTF::create()的一样
- auto label4 = Label::create("create","Marker Felt",30);
效果如图所示:
![](https://img-blog.csdn.net/20140327201402218?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
2)另字体看起来紧凑点,也就是设置distanceFieldEnabled = true
直接修改config里的distanceFieldEnabled,方式如下:
- TTFConfig config2("fonts/Marker Felt.ttf",30,GlyphCollection::DYNAMIC,nullptr,true);
![](https://img-blog.csdn.net/20140327201443484?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
3)设置glow(荧光)效果,(我也不知道该怎么描述glow这词...)
- label2->enableGlow(Color3B::GREEN);
效果如图所示。这里有个地方要注意下,想要显示荧光效果,必须令distanceFieldEnabled = true,否则看不到效果。
![](https://img-blog.csdn.net/20140327201456671?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
4)设置描边
- label2->enableOutline(Color4B(255,125,0,255),8);
效果如图所示。注意,使用描边效果后,distanceFieldEnabled 将变成 false,这也意味着在有描边的情况下是显示不了荧光效果的(我想太多了...)
![](https://img-blog.csdn.net/20140327201525390?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
5)设置阴影
- label2->enableShadow(Color3B::RED,Size(2,-2),0.2,0.5);
![](https://img-blog.csdn.net/20140327201550296?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
2、使用.fnt 的label
1)创建
- auto label3 = Label::createWithBMFont("fonts/bitmapFontTest.fnt", "createWithBMFont");
- label3->setPosition(Point(visibleSize.width/2,250));
- label3->setAnchorPoint(Point::ANCHOR_MIDDLE);
- this->addChild(label3,2);
- label3->enableShadow();
![](https://img-blog.csdn.net/20140327201628734?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
2)设置阴影(描边和荧光只能用在.ttf 上)
- label3->enableShadow(Color3B::RED);
效果如图,可以与上图对比一下。
![](https://img-blog.csdn.net/20140327201642375?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
3、使用.png
加入我们有这么一张图,使用方法如下:
![](https://img-blog.csdn.net/20140327201705156?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
1)创建
- auto label4= Label::createWithCharMap("fonts/costFont.png",30,44,'/');
- label4->setPosition(Point(visibleSize.width/2,200));
- label4->setAnchorPoint(Point::ANCHOR_MIDDLE);
- label4->setString("10");
- this->addChild(label4,2);
![](https://img-blog.csdn.net/20140327201738000?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
2)设置阴影
- label4->enableShadow(Color3B::RED);
![](https://img-blog.csdn.net/20140327201751078?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3RhcnQ1MzA=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
4、取消所有特效
恩,就介绍到这里。具体的用法可以参考testCpp。
这篇博文内容虽比较简单,但却是极耗精力的....
尊重原创,转载请注明来源:http://blog.csdn.net/start530/article/details/22313087