|
【唠叨】
在3.x中,废弃了2.x里的LabelTTF、LabelAtlas、LabelBMFont三个字体类,取而代之的是全新的字体标签Label。
实际上Label是将三个字体类进行了融合,进行统一的管理与渲染,这使得创建字体标签Label的方式更加统一,更加方便。
本节来学习一下3.x中新的标签类Label,如果对2.x中的三个字体类不了解的话,建议先去看看那三个类的用法,再来学习本节内容,能够更好的理解。
【本节内容】
在3.x中,Label支持四种方式的标签创建。并新增了阴影Shadow、轮廓Outline、发光Glow效果的支持。还支持文字内容的行间距、文字间距、自动换行的设置。
> 创建系统原生字体API : createWithSystemFont
> 创建TTF : createWithTTF (原LabelTTF)
> 创建CharMap : createWithCharMap (原LabelAtlas)
> 创建BMFont : createWithBMFont (原LabelBMFont)
> Label的属性与方法
> 文字效果渲染 : Shadow、Outline、Glow
> 对齐方式 : TextHAlignment、TextVAlignment
> Label的尺寸大小
> 自动换行
> 行间距、文字间距
> 单独设置某个字符
关于图片资源,请在cocos2dx给出的官方样例cpp-tests中寻找。
【createWithSystemFont】
创建系统原生字体的API。
创建方式如下:
使用举例:
【createWithTTF】
创建TTF的方式有以下两种:
> 方式一:与2.x中LabelTTF的创建类似,不过使用的fontFile必须为字体文件。
> 方式二:通过TTF的配置信息数据结构TTFConfig来创建。
1、方式一:与System Font创建类似
注:区别在于fontFile必须为字体文件(如”*.ttf”),即不支持使用系统字体名称来创建。
2、方式二:通过TTFConfig配置来创建
2.1、TTFConfig配置
2.2、使用TTFConfig创建TTF
使用举例:
【createWithCharMap】
CharMap的用法与2.x中的LabelAtlas是一样的,一般用来显示数字。不过它也可以用来显示其他字符,如英文字符。
字体文件资源一般来自一张.png图片,或.plist文件。
注:图片中每个字符的大小必须是固定的,若要改变字体大小,只能通过setScale放缩来实现。
创建CharMap有三种方式:
> 使用.png图片创建
> 使用纹理Texture2D创建
> 使用.plist创建
从图片中从左到右,一块一块截取。从字符startCharMap开始一一对应。
第一块小图片对应字符startCharMap;第二块小图片对应字符startCharMap+1;第三块对应startCharMap+2 …… 以此类推。
注:startCharMap为ASCII码,即:数字 ‘0’ 为48。
0、字符图片资源
digit.png:200*20(每个数字20*20)。
1、使用.png创建
2、使用Texture2D创建
使用方法实际上与.png是类似的。
3、使用.plist创建
在digit.plist里需要配置:用到的字符图片资源.png,每个字符的宽、高,起始字符。
如下所示:
使用plist创建CharMap的方法:
【createWithBMFont】
BMFont的用法与2.x中的LabelBMFont是一样的。
这个类使用之前,需要添加好字体文件,包括一个图片文件(*.png)和一个字体坐标文件(*.fnt),这两个文件名称必须一样。可以下载一个fnt编辑工具来自定义字体。
值得注意的是:
> 在2.x中,可以使用 getChildByTag(i) 来获取第i个字符,对其单独设置属性、动作等。
> 在3.x中,则是使用 getLetter(i) ,而不再是 getChildByTag(i) 。
这个类也没办法指定字体的字号大小,需要用setScale来缩放调整大小。
使用举例:
【Label的属性与方法】
Label继承于:
> SpriteBatchNode : 用于加快字体的渲染速度。
> LabelProtocol : 用于设置Label的字符串内容。
主要函数如下:
【文字渲染效果】
支持三种渲染效果:
> Shadow : 阴影
> Outline : 轮廓,仅支持TTF
> Glow : 发光,仅支持TTF
注:其中Outline与Glow两个效果,只会作用一个。即无法一起使用。
使用举例:
如图所示:
【对齐方式】
> TextHAlignment : 水平对齐方式
– TextHAlignment
– TextHAlignment:CENTER : 居中对齐,默认
– TextHAlignment:RIGHT : 右对齐
> TextVAlignment : 垂直对齐方式
– TextVAlignment::TOP : 顶部,默认
– TextVAlignment::CENTER : 中心
– TextVAlignment::BOTTOM : 底部
仅在设置了Label的尺寸大小setDimensions(width,height),大于显示的字符串内容的尺寸大小,才会起作用。
对齐方式举例,如下几张图片所示:
对齐方式为:
> TextHAlignment
> TextVAlignment::TOP
【自动换行】
在3.x中,自动换行有两种方式。(当然你也可以使用C++里的转移字符’n’进行手动换行)
> 利用lb->setLineBreakWithoutSpace(true),来支持自动换行功能。
> 1. 利用 setMaxLineWidth(maxLineWidth),来控制自动换行。
> 2. 利用 setDimensions(width , height),来控制自动换行。
1、利用setMaxLineWidth
设置每行显示文字的最大宽度。
注:这种方法仅在Label width == 0的情况下,才会有效。
使用方法:
如图:
2、利用setDimensions
使用方法:
如图:
【文字间距】
间距的调整,是在 v3.2 之后才出现的。可以设置文本内容的行间距与文字间距。
注:不支持System Font。
> setLineHeight : 设置行间距
> setAdditionalKerning : 设置额外文字间距
使用举例:
图解:
【单独设置某个字符】
学过2.x中的LabelBMFont的同学,应该知道这个是怎么回事吧?
在3.x中,使用TTF、CharMap、BMFont创建的文字标签,其字符串内容的每个字符都是一个Sprite精灵图片,可以对其进行单独的设置。如精灵放缩、执行动作等。
注:不支持System Font。
> lb->getStringLength() : 获取字符串内容的总长度
> lb->getLetter(i) : 获取第i个位置上的字符
使用举例:
|
cocos2dx3.2技术之新字体标签Label浅析
最新推荐文章于 2024-10-10 22:10:38 发布
本文深入解析了3.x版本中Label类的更新,包括四种创建方式、阴影、轮廓、发光效果、文字间距、自动换行及单独设置字符等功能。详尽介绍了如何创建系统原生字体、TTF、CharMap和BMFont标签,并展示了Label的属性与方法,如文字渲染、对齐方式、尺寸大小和自定义样式。
EFT, //水平对齐方式,默认左对齐:
YNAMIC,









430

被折叠的 条评论
为什么被折叠?



