[译~未完]cocos2d Labels and Fonts 标签和字体
Labels and Fonts 标签和字体
Introduction 介绍
cocos2d 支持 TTF (True Type Fonts) 标签和纹理 atlas 标签.
Pros and Cons of TTF labels: ( Label
)
- + All the pros of TTF fonts: any size, kerning support, etc.
- + 简单实用,不需要外部编辑器.
- - 创建和更新很慢,因为一个新的纹理将要被创建
Pros and Cons of texture atlas labels: ( LabelAtlas
, BitmapFontAtlas
)
- + 创建和更新很快,因为它不需要创建新的纹理.
- + 字体可以自定义 (shadows, gradients, blur, etc)
- - 依赖于外部的编辑器: AngelCode / Hiero editor, GIMP / Photoshop
Label objects 标签对象
Creating labels 创建标签的简单方式
例如:
Label *label = [Label labelWithString:@"Hello World" fontName:@"Marker Felt" fontSize:24]; [self add: label];
fontName
是要使用的 TTF 格式字体的名字
从 v0.8.2 版本开始,你可以使用自定义的TTF文件. 只需要把.ttf 文件加入到工程. 例如自定义的TTF 文件:
Label *label = [Label labelWithString:@"Hello World" fontName:@"Schwarzwald Regular" fontSize:24]; [self add: label];
从 v0.8.2版本开始:
- 使用FontLabel 库来读取字体.
- 如果不成功将会使用
UIFont
类 (like in v0.8.1)
重要: OpenGL 纹理的大小将会根据字体的大小和名字自动计算出来.
创建标签的复杂方式:
你同样可以使用 API创建:
Label *left = [Label labelWithString:@"Hello World" dimensions:CGSizeMake(480,50)
alignment:UITextAlignmentLeft fontName:@"Marker Felt" fontSize:32]; [self add: left];
如果你使用了这种方式,那么你必须传递一个OpenGL纹理的维度,如果这个纹理不够大,那么只能创建出来一部分了。
可能的对齐方式:
UITextAlignmentLeft
(左对齐)UITextAlignmentCenter
(居中)UITextAlignmentRight
(右对齐)
Updating更新
Like any object that implements the CocosNodeLabel
protocol you can update it using the setString
method. Example:
[label setString: @"Hello World 2"];
重要: 每次调用 setString
的时候,一个新的OPENGL 纹理将会被创建. 这意味着setString
和创建一个新的标签一样慢.所以,当你需要频繁的更新它们的时候,尽可能的不用去使用标签对象。而应该使用LabelAtlas或者是BitmapFontAtlas
Alignment 对齐
使用anchorPoint
属性可以改变对齐方式. 例如:
//left alignment [label setAnchorPoint: ccp(0, 0.5f)]; // right alignment [label setAnchorPoint: ccp(1, 0.5f)]; // center aligment (default) [label setAnchorPoint: ccp(0.5f, 0.5f)];
Texture Atlas labels
一共有两种类型的 atlas:
BitmapFontAtlas
LabelAtlas
BitmapFontAtlas
Introduction 介绍
BitmapFontAtlas 可以创建一个很快的标签有以下几个原因
:
- bitmap (image) 可以通过编辑器自定义
- 可以没有任何时间中断去创建或者更新一个标签
- It is very flexible. Each letter of the label can be treated like an
AtlasSprite
- 有内核的支持
The BitmapFontAtlas
label parses the Angel Code Font format to create a label. To create these kind of labels, you can use any of these editors:
- http://www.n4te.com/hiero/hiero.jnlp (java version)
- http://slick.cokeandcode.com/demos/hiero.jnlp (java version)
- http://www.angelcode.com/products/bmfont/ (windows only)
Java版本编辑器 vs. Windows版本的编辑器:
- Windows 编辑器是官方的Angel Code 编辑器
- Java版本编辑器: 可以在Mac使用
- Java 版本编辑器: 可以有一些额外的特性例如 shadow, gradient, blur
创建一个BitmapFontAtlas
通过如下的方式可以创建一个对象:
BitmapFontAtlas *label = [BitmapFontAtlas bitmapFontAtlasWithString:@"Hello World" fntFile:
@"bitmapFontTest.fnt"]; [self add:label]
操作
由于 BitmapFontAtlas
是 AtlasSpriteManager的子类,你可以以AtlasSprite的形式操纵其中的任何一个字符。第一个字符以tag=0的形式加载,第二个是依次加1。等等。。例如
:
BitmapFontAtlas *label = [BitmapFontAtlas bitmapFontAtlasWithString:@"Bitmap Font Atlas"
fntFile:@"bitmapFontTest.fnt"]; AtlasSprite *char_B = (AtlasSprite*) [label getChildByTag:0]; // character 'B' AtlasSprite *char_m = (AtlasSprite*) [label getChildByTag:3]; // character 'm'
LabelAtlas
Introduction 介绍
LabelAtlas是cocos2d里面最快的。但是是BitmapFontAtlas子类。它落后的兼容性还是被维护的,但是你可以使用BitmapFontAtlas替换。
Creating a LabelAtlas 创建一个LableAtlas
LabelAtlas *label = [LabelAtlas labelAtlasWithString:@"Hello World" charMapFile:
@"tuffy_bold_italic-charmap.png" itemWidth:48 itemHeight:64 startCharMap:' ']; [self add:label];
- charMapFile是一个包含所有字符的图像文件。每一个符号都可以按着ASCII进行排序,并且不能包含多于256的符号在里面
itemWidth
是字符的宽度像素为单位itemHeight
是字符里面的最高的以像素为单位startCharMap
是Map里面的第一个字符.
LabelAtlas / BitmapFontAtlas 如何更新
像其他的 CocosNodeLabel
协议中的对象一样。我们使用 setString
方法进行更新.
[label setString:@"Hello World 2"];
更新一个 LabelAtlas
或者是 BitmapFontAtlas
基本上不耗费什么时间
LabelAtlas / BitmapFontAtlas 的对齐方式
如果你要修改对齐方式可以使用anchorPoint
属性.例如:
//left alignment [label setAnchorPoint: ccp(0, 0.5f)]; // right alignment [label setAnchorPoint: ccp(1, 0.5f)]; // center aligment (default) [label setAnchorPoint: ccp(0.5f, 0.5f)];
作者:Alexliu(alex dotNet Learning)
出处:http://alexliu.cnblogs.com/
本文版权归作者和博客园共有,欢迎转载,转载请注明。并且保留文章链接。否则保留追究法律责任的权利。