cocos2dx 3.0版本之前,我们一直都是用cclabelTTF,cclabelBMFont,cclabelAtlas来创建文本标签,但是!3.0版本放出来后...看到这里你心里是不是又颤抖了一下?别害怕嘛,我要说的是:3.0版本出来后这些标签也都是还可以用的啦,只是说我们有了更好的选择。


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

所以因为Label,我决定离开LabelTTF和LabelBMFont(这个开头你猜到了么?)
---------------------------------------------------
常用的接口一览(因为很多接口都与LabelTTFT等一样,所以就列一些我所了解的“异类”)
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
//创建普通的文本标签,效果和cclabelTTF::create(...);一样。TTFConfig是什么?下面会介绍
static Label * create( const std::string& text, std::string& fontName, float fontSize,
Size& dimensions = Size::ZERO,TextHAlignment hAlignment = TextHAlignment::LEFT,
TextVAlignment vAlignment = TextVAlignment::TOP);
//通过读取TTFConfig配置的方式创建标签,
Label* createWithTTF( TTFConfig& ttfConfig,TextHAlignment alignment = TextHAlignment::LEFT,monospace!important; font-weight:bold!important; font-size:1em!important; min-height:inherit!important; color:gray!important; background:none!important">int linewidth = 0);
//使用.fnt的方式创建标签,类似cclabelBMFont:create();
Label* createWithBMFont( std::string& bmfontFilePath,
TextHAlignment& alignment = TextHAlignment::LEFT,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> linewidth = 0,
Point& imageOffset = Point::ZERO);
//使用.png的方式创建标签,类似cclabelAtlas::create();
Label * createWithCharMap( std::string& charMapFile,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> itemWidth,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> itemHeight,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> startCharMap);
virtual void enableShadow( Color3B& shadowColor = Color3B::BLACK,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> Size &offset = Size(2,-2),monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> opacity = 0.75f,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> blurRadius = 0);
enableOutline( Color4B& outlineColor,monospace!important; font-size:1em!important; min-height:inherit!important; color:black!important; background:none!important"> outlinesize = -1); //只支持TTF
enableGlow( Color3B& glowColor); //只支持 TTF
disableEffect(); //取消所有特效
//特效的种类有一下四种:
enum class LabelEffect {
norMAL, //普通标签(纯粹的、脱离了低级趣味的label)
OUTLINE,0)!important; background:none!important">//文艺标签(有描边)
SHADOW,0)!important; background:none!important">//2B标签 (有阴影)
GLOW //土豪标签(有荧光)
};
稍微提一下一个新东西:TTFConfig
?
22
//TTFConfig 是一个结构体,里面包含了你要创建一个ttf的label常用配置,如下所示
typedef struct _ttfConfig
{
std::string fontFilePath; //文件路径
fontSize; //字体大小,默认12
GlyphCollection glyphs; //使用的字符集,默认DYNAMIC
const char *customGlyphs; //呵呵
bool distanceFieldEnabled; //我对这个的理解是:是否让文字显得紧凑?默认为false
outlinesize; //字体描边的大小,默认为0
//构造函数
...
//注意:当outlinesize初始化的值大于0时,distanceFieldEnabled则为false
}TTFConfig;
//GlyphCollection有四种类型:
GlyphCollection {
DYNAMIC,
NEHE,
ASCII,
CUSTOM
};
下面简单介绍Label的用法

1、使用.ttf
1)创建


复制代码
  1. TTFConfig config2("fonts/Marker Felt.ttf",30);//初始化TTFConfig,第一个参数为字库的路径,第二个参数为字体大小
  2. auto label2 = Label::createWithTTF(config2,"createWithTTF",TextHAlignment::LEFT);//创建label,并向左对其
  3. label2->setPosition(Point(visibleSize.width/2,300));
  4. label2->setAnchorPoint(Point::ANCHOR_MIDDLE);//设置锚点居中
  5. this->addChild(label2,2);

当然了,也可以用Label创建普通的标签,效果和用cclabelTTF::create()的一样
复制代码
auto label4 = Label::create("create","Marker Felt",30);//
效果如图所示:

2)另字体看起来紧凑点,也就是设置distanceFieldEnabled = true
直接修改config里的distanceFieldEnabled,方式如下:
复制代码
修改config的第五个参数为true


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

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

4)设置描边
复制代码
label2->enableOutline(Color4B(255,125,255),8);//第一个参数为描边的颜色,第二个参数为描边的大小

效果如图所示。注意, 使用描边效果后,distanceFieldEnabled 将变成 false,这也意味着在有描边的情况下是显示不了荧光效果的(我想太多了...)

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


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



  • 2)设置阴影(描边和荧光只能用在.ttf 上)
    复制代码
    label3->enableShadow(Color3B::RED);

    效果如图,可以与上图对比一下。


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


    1)创建
    复制代码
    auto label4= Label::createWithCharMap("fonts/costFont.png",44,'/');//参数分别为:路径;每个字符的宽和高,起始字符
  • label4->setPosition(Point(visibleSize.width/2,200));
  • label4->setAnchorPoint(Point::ANCHOR_MIDDLE);
  • label4->setString("10");//设置显示的内容为”10“this->addChild(label4,2);



  • 2)设置阴影
    复制代码
    label4->enableShadow(Color3B::RED);



    4、取消所有特效
    复制代码
    label->disableEffect();//取消所有特效
    恩,就介绍到这里。具体的用法可以参考testCpp。

    Cocos2dx 3.0 -- 有freeType做靠山的Label的更多相关文章

    1. HTML5自定义视频播放器源码

      这篇文章主要介绍了HTML5自定义视频播放器源码,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

    2. HTML5自定义mp3播放器源码

      这篇文章主要介绍了HTML5自定义mp3播放器源码,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

    3. html5自定义video标签的海报与播放按钮功能

      这篇文章主要介绍了html5自定义video标签的海报与播放按钮功能,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下

    4. CSS中实现动画效果-附案例

      这篇文章主要介绍了 CSS中实现动画效果并附上案例代码及实现效果,就是CSS动画样式处理,动画声明需要使用@keyframes name,后面的name是人为定义的动画名称,下面我们来看看文章的具体实现内容吧,需要的小伙伴可以参考一下

    5. h5页面背景图很长要有滚动条滑动效果的实现

      这篇文章主要介绍了h5页面背景图很长要有滚动条滑动效果的实现,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

    6. html5借用repeating-linear-gradient实现一把刻度尺(ruler)

      这篇文章主要介绍了html5借用repeating-linear-gradient实现一把刻度尺,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    7. 如何在Canvas中添加事件的方法示例

      这篇文章主要介绍了如何在Canvas中添加事件的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    8. HTML5自定义元素播放焦点图动画的实现

      这篇文章主要介绍了HTML5自定义元素播放焦点图动画的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

    9. 有关HTML5页面在iPhoneX适配问题

      这篇文章主要介绍了有关HTML5页面在iPhoneX适配问题,需要的朋友可以参考下

    10. html5简介及新增功能介绍

      这篇文章主要介绍了html5简介及新增功能介绍,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

    随机推荐

    1. 【cocos2d-x 3.x 学习笔记】对象内存管理

      Cocos2d-x的内存管理cocos2d-x中使用的是上面的引用计数来管理内存,但是又增加了一些自己的特色。cocos2d-x中通过Ref类来实现引用计数,所有需要实现内存自动回收的类都应该继承自Ref类。下面是Ref类的定义:在cocos2d-x中创建对象通常有两种方式:这两中方式的差异可以参见我另一篇博文“对象创建方式讨论”。在cocos2d-x中提倡使用第二种方式,为了避免误用第一种方式,一般将构造函数设为protected或private。参考资料:[1]cocos2d-x高级开发教程2.3节[

    2. 利用cocos2dx 3.2开发消灭星星六如何在cocos2dx中显示中文

      由于编码的不同,在cocos2dx中的Label控件中如果放入中文字,往往会出现乱码。为了方便使用,我把这个从文档中获取中文字的方法放在一个头文件里面Chinese.h这里的tex_vec是cocos2dx提供的一个保存文档内容的一个容器。这里给出ChineseWords,xml的格式再看看ChineseWord的实现Chinese.cpp就这样,以后在需要用到中文字的地方,就先include这个头文件然后调用ChineseWord函数,获取一串中文字符串。

    3. 利用cocos2dx 3.2开发消灭星星七关于星星的算法

      在前面,我们已经在GameLayer中利用随机数初始化了一个StarMatrix,如果还不知道怎么创建星星矩阵请回去看看而且我们也讲了整个游戏的触摸事件的派发了。

    4. cocos2dx3.x 新手打包APK注意事项!

      这个在编译的时候就可以发现了比较好弄这只是我遇到的,其他的以后遇到再补充吧。。。以前被这两个问题坑了好久

    5. 利用cocos2dx 3.2开发消灭星星八游戏的结束判断与数据控制

      如果你看完之前的,那么你基本已经拥有一个消灭星星游戏的雏形。开始把剩下的两两互不相连的星星消去。那么如何判断是GameOver还是进入下一关呢。。其实游戏数据贯穿整个游戏,包括星星消除的时候要加到获得分数上,消去剩下两两不相连的星星的时候的加分政策等,因此如果前面没有做这一块的,最好回去搞一搞。

    6. 利用cocos2dx 3.2开发消灭星星九为游戏添加一些特效

      needClear是一个flag,当游戏判断不能再继续后,这个flag变为true,开始消除剩下的星星clearSumTime是一个累加器ONE_CLEAR_TIME就是每颗星星消除的时间2.连击加分信息一般消除一次星星都会有连击信息和加多少分的信息。其实这些combo标签就是一张图片,也是通过控制其属性或者runAction来实现。源码ComboEffect.hComboEffect.cpp4.消除星星粒子效果消除星星时,为了实现星星爆裂散落的效果,使用了cocos2d提供的粒子特效引擎对于粒子特效不了

    7. 02 Cocos2D-x引擎win7环境搭建及创建项目

      官网有搭建的文章,直接转载记录。环境搭建:本文介绍如何搭建Cocos2d-x3.2版本的开发环境。项目创建:一、通过命令创建项目前面搭建好环境后,怎样创建自己的Cocos2d-x项目呢?先来看看Cocos2d-x3.2的目录吧这就是Cocos2d-x3.2的目录。输入cocosnew项目名–p包名–lcpp–d路径回车就创建成功了例如:成功后,找到这个项目打开proj.win32目录下的Hello.slnF5成功了。

    8. 利用cocos2dx 3.2开发消灭星星十为游戏添加音效项目源码分享

      一个游戏,声音也是非常的重要,其实cocos2dx里面的简单音效引擎的使用是非常简单的。我这里只不过是用一个类对所有的音效进行管理罢了。Audio.hAudio.cpp好了,本系列教程到此结束,第一次写教程如有不对请见谅或指教,谢谢大家。最后附上整个项目的源代码点击打开链接

    9. 03 Helloworld

      程序都有一个入口点,在C++就是main函数了,打开main.cpp,代码如下:123456789101112131415161718#include"main.h"#include"AppDelegate.h"#include"cocos2d.h"USING_NS_CC;intAPIENTRY_tWinMain{UNREFERENCED_ParaMETER;UNREFERENCED_ParaMETER;//createtheapplicationinstanceAppDelegateapp;return

    10. MenuItemImage*图标菜单创建注意事项

      学习cocos2dx,看的是cocos2d-x3.x手游开发实例详解,这本书错误一大把,本着探索求知勇于发现错误改正错误的精神,我跟着书上的例子一起调试,当学习到场景切换这个小节的时候,出了个错误,卡了我好几个小时。

    返回
    顶部