Cocos2dx 3.0 过渡篇 (二十一)自从Label有了freeType做靠山以后...

转载 2015年07月07日 22:46:09
cocos2dx 3.0版本之前,我们一直都是用CCLabelTTF,CCLabelBMFont,CCLabelAtlas来创建文本标签,但是!3.0版本放出来后...看到这里你心里是不是又颤抖了一下?别害怕嘛,我要说的是:3.0版本出来后这些标签也都是还可以用的啦,只是说我们有了更好的选择。

cocos2dx3.0添加了一种新的文本标签,这种标签不同的地方有:使用freetype来使它在不同的平台上有相同的视觉效果;由于使用更快的缓存代理,它的渲染也将更加快速;同时它还提供了绘边、阴影等特性。


所以因为Label,我决定离开abelTTF和LabelBMFont(这个开头你猜到了么?)
---------------------------------------------------

常用的接口一览(因为很多接口都与LabelTTFT等一样,所以就列一些我所了解的“异类”)

  1. //创建普通的文本标签,效果和CCLabelTTF::create(...);一样。TTFConfig是什么?下面会介绍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);      //通过读取TTFConfig配置的方式创建标签,static Label* createWithTTF(const TTFConfig& ttfConfig, const std::string& text, TextHAlignment alignment = TextHAlignment::LEFT, int lineWidth = 0);//使用.fnt的方式创建标签,类似CCLabelBMFont:create();    static Label* createWithBMFont(const std::string& bmfontFilePath, const std::string& text,        const TextHAlignment& alignment = TextHAlignment::LEFT, int lineWidth = 0,         const Point& imageOffset = Point::ZERO);        //使用.png的方式创建标签,类似CCLabelAtlas::create();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);//只支持TTFvirtual void enableGlow(const Color3B& glowColor);//只支持 TTF virtual void disableEffect();//取消所有特效//特效的种类有一下四种:enum class LabelEffect {    NORMAL,        //普通标签(纯粹的、脱离了低级趣味的label)    OUTLINE,   //文艺标签(有描边)    SHADOW,      //2B标签  (有阴影)    GLOW       //土豪标签(有荧光)};  
稍微提一下一个新东西:TTFConfig

  1. //TTFConfig 是一个结构体,里面包含了你要创建一个ttf的label常用配置,如下所示typedef struct _ttfConfig{    std::string fontFilePath;   //文件路径    int fontSize;               //字体大小,默认12    GlyphCollection glyphs;     //使用的字符集,默认DYNAMIC    const char *customGlyphs;   //呵呵    bool distanceFieldEnabled;  //我对这个的理解是:是否让文字显得紧凑?默认为false  int outlineSize;            //字体描边的大小,默认为0      //构造函数    ...   //注意:当outlineSize初始化的值大于0时,distanceFieldEnabled则为false}TTFConfig;//GlyphCollection有四种类型:enum class GlyphCollection {        DYNAMIC,    NEHE,    ASCII,    CUSTOM};  

下面简单介绍Label的用法

1、使用.ttf
1)创建

  1. TTFConfig config2("fonts/Marker Felt.ttf",30);//初始化TTFConfig,第一个参数为字库的路径,第二个参数为字体大小auto label2 = Label::createWithTTF(config2,"createWithTTF",TextHAlignment::LEFT);//创建label,并向左对其label2->setPosition(Point(visibleSize.width/2,300));label2->setAnchorPoint(Point::ANCHOR_MIDDLE);//设置锚点居中this->addChild(label2,2);  
当然了,也可以用Label创建普通的标签,效果和用CCLabelTTF::create()的一样

  1. auto label4 = Label::create("create","Marker Felt",30);//  
效果如图所示:


2)另字体看起来紧凑点,也就是设置distanceFieldEnabled = true
直接修改config里的distanceFieldEnabled,方式如下:

  1. TTFConfig config2("fonts/Marker Felt.ttf",30,GlyphCollection::DYNAMIC,nullptr,true);//修改config的第五个参数为true  


3)设置glow(荧光)效果,(我也不知道该怎么描述glow这词...)

  1. label2->enableGlow(Color3B::GREEN);//荧光颜色为绿色  
效果如图所示。这里有个地方要注意下,想要显示荧光效果,必须令distanceFieldEnabled = true,否则看不到效果。


4)设置描边

  1. label2->enableOutline(Color4B(255,125,0,255),8);//第一个参数为描边的颜色,第二个参数为描边的大小  
效果如图所示。注意,使用描边效果后,distanceFieldEnabled 将变成 false,这也意味着在有描边的情况下是显示不了荧光效果的(我想太多了...)


5)设置阴影

  1. label2->enableShadow(Color3B::RED,Size(2,-2),0.2,0.5);//第一个参数为阴影颜色,第二个参数为阴影相对于标签的坐标,第三个参数设置透明度,第四个参数与模糊有关  


2、使用.fnt 的label
1)创建

  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();  


2)设置阴影(描边和荧光只能用在.ttf 上)

  1. label3->enableShadow(Color3B::RED);  
效果如图,可以与上图对比一下。


3、使用.png
加入我们有这么一张图,使用方法如下:


1)创建

  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");//设置显示的内容为”10“this->addChild(label4,2);  


2)设置阴影

  1. label4->enableShadow(Color3B::RED);  


4、取消所有特效
  1. label->disableEffect();//取消所有特效  


恩,就介绍到这里。具体的用法可以参考testCpp。

这篇博文内容虽比较简单,但却是极耗精力的....

Cocos2dx 3.0 过渡篇 (二十一)自从Label有了freeType做靠山以后...

cocos2dx 3.0版本之前,我们一直都是用CCLabelTTF,CCLabelBMFont,CCLabelAtlas来创建文本标签,但是!3.0版本放出来后...看到这里你心里是不是又颤抖了一下...

Cocos2dx 3.0 过渡篇 (二十一)自从Label有了freeType做靠山以后...enableShadow

Cocos2dx 3.0 过渡篇 (二十一)自从Label有了freeType做靠山以后... 分类: cocos2d-x学习笔记2014-03-27 20:25 3818人阅读 评论(...

【教程分享】Cocos2dx 3.0 -- 有freeType做靠山的Label

cocos2dx 3.0版本之前,我们一直都是用CCLabelTTF,CCLabelBMFont,CCLabelAtlas来创建文本标签,但是!3.0版本放出来后...看到这里你心里是不是又颤抖了一下...

Cocos2dx 3.0 过渡篇(十六)用ClippingNode做游戏的新手引导

本篇介绍的是用ClippingNode 做游戏的新手引导,额,或者说是做新手引导的一种可尝试的方式。 ClippingNode的解释,我盗用Jacky的话来说就是: CCClipingNode是一...

Cocos2dx 3.0 过渡篇(十六)用ClippingNode做游戏的新手引导

CCClipingNode是一个可裁剪节点,简单理解: (1)首先它是一个节点,继承于CCNode,所以它可以像普通节点一样放入CCLayer,CCScene,CCNode中。 (2)作为节点,它就可...
  • start530
  • start530
  • 2014年03月09日 17:24
  • 12407

Cocos2dx 3.0 过渡篇(九)浅谈容器Map

尊重原创,转载请注明来自:star特530的CSDN博客 http://blog.csdn.net/start530/article/details/19284301 本篇接着上...

Cocos2dx 3.0 过渡篇(三) 触摸机制

尊重原创,转载请注明来自:star特530的CSDN博客 http://blog.csdn.net/start530/article/details/18325493 本来在中午休息时间打算...
  • CyWn_d
  • CyWn_d
  • 2014年04月28日 10:43
  • 517

Cocos2dx 3.0 过渡篇(二十六)C++11多线程std::thread的简单使用(上)

本篇介绍的是线程! 在cocos2dx 2.0时代,我们使用的是pthread库,是一套用户级线程库,被广泛地使用在跨平台应用上。但在cocos2dx 3.0中并未发现有pthread的支持文件,原...

Cocos2dx 3.0 过渡篇(二十六)C++11多线程std::thread的简单使用

转自star特530的博客。http://blog.csdn.net/star530/article/details/24186783andhttp://blog.csdn.net/star530/a...

Cocos2dx 3.0 过渡篇(七)EditBox和ControlSlider不得不说的故事

正月放假这阶段发生了好多事。对我的影响很大。 迫于家庭压力,谈了四年的女友和我提出了分手,是的,她做出了这个决定。我很难受,她也很痛苦。 消沉了好几天,现在,我满血满状态的复活了。我是 这么容易放弃的...
  • start530
  • start530
  • 2014年02月08日 20:04
  • 10361
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:Cocos2dx 3.0 过渡篇 (二十一)自从Label有了freeType做靠山以后...
举报原因:
原因补充:

(最多只允许输入30个字)