iOS_31_cocos2d_Label

最终效果图:

cocos2d v3中Label只有2种:

一、CCLabelTTF

注意事项:

CCLabelTTF,可以随时setString,改变文字,

但是:非常耗性能,

因为,它会为每一个新的string,创建一个新的纹理,进行渲染,

因此,不能频繁地改变文字的内容;

只有显示固定的文字时,才建议使用CCLabelTTF

二、CCLabelBMFont

使用注意事项:

BMFont是专门为了频繁更换label内容而生,

因为,每一个字符如a、b、1都是一个sprite,

都对应着一个图片/纹理,

因此会以占用更多的内存为代价,

从而提高了渲染的效率(因为一个sprite对应的纹理只需渲染一次)

另外一个好处是:

由于每一个字符都是一个精灵,所以可以runAction

这里面用到的fnt可以使用【Glyph Designer软件】生成

BMFont不能设置大小size,但是可以通过设置scale缩放

并且,BMFont不能设置高度,仅能设置宽度

////  LabelScene.m//  31_cocos2D入门////  Created by beyond on 14-9-26.//  Copyright (c) 2014年 com.beyond. All rights reserved.//  演示3种Label的场景#import "LabelScene.h"@interface LabelScene(){    CCLabelTTF *_labelTTF;        CCLabelBMFont *_bmFont;        // CCLabelAtlas *_atlas;}@end@implementation LabelScene#pragma mark - 覆盖父类方法-(id)init{    if (self=[super init]) {        // 1、场景Node 允许交互        self.userInteractionEnabled = YES;    }    return self;}// 直接覆写,即:不用创建一个sprite In Center- (void)addSpriteInCenter{}// 实现父类的方法,添加一个按钮到屏幕上- (void)addShowBtns{    // 1.使用CCLabelTTF    [self addBtn:@"【CCLabelTTF】" position:ccp(0, 0) target:self sel:@selector(labelTTFClicked)];        // 2.使用CCLabelBMFont    [self addBtn:@"【CCLabelBMFont】" position:ccp(0, 0.1) target:self sel:@selector(labelBMFontClicked)];    // 3.让BMFont的每一个字符精灵,产生Action    [self addBtn:@"【BMFont字符精灵动画】" position:ccp(0, 0.2) target:self sel:@selector(labelBMFont_SpriteActionClicked)];    }// 1.使用CCLabelTTF- (void)labelTTFClicked{    _bmFont.string = @"";    _bmFont = nil;        // CCLabelTTF,可以随时setString,改变文字,但是:非常耗性能,因为,它会为每一个新的string,创建一个新的纹理,进行渲染,因此,不能频繁地改变文字的内容;只有固定的文字才建议使用CCLabelTTF    CGSize dimension = self.contentSize;    _labelTTF = [CCLabelTTF labelWithString:@"Hello Beyond" fontName:@"Marker Felt" fontSize:67 dimensions:dimension];    _labelTTF.horizontalAlignment = CCTextAlignmentCenter;    _labelTTF.verticalAlignment = CCVerticalTextAlignmentCenter;    _labelTTF.position =  ccp(self.contentSize.width/2,self.contentSize.height/2);        // 添加到场景中    [self addChild:_labelTTF];}// 2.使用CCLabelBMFont- (void)labelBMFontClicked{    _labelTTF.string = @"";    _labelTTF = nil;        // BMFont是专门为了频繁更换label内容而生,因为,每一个字符如a、b、1等都是一个sprite,都对应着一个图片/纹理,因此会以占用更多的内存为代价,从而提高了渲染的效率(因为一个sprite对应的纹理只需渲染一次)    // 另外一个好处是,由于每一个字符都是一个精灵,所以可以runAction    // 这里面的fnt可以使用 【Glyph Designer 】生成    // BMFont不能设置大小size,但是可以通过设置scale缩放    // BMFont不能设置高度,仅能设置宽度        _bmFont = [CCLabelBMFont labelWithString:@"Hello Beyond" fntFile:@"Marion.fnt" width:400 alignment:CCTextAlignmentCenter];    _bmFont.position =  ccp(self.contentSize.width/2,self.contentSize.height/2);    // _bmFont.scale = 1;        // 添加到场景中    [self addChild:_bmFont];}// 3.演示labelBMFont的每一个字符精灵的动画- (void)labelBMFont_SpriteActionClicked{    _bmFont.string = @"";    _bmFont = nil;    _labelTTF.string = @"";    _labelTTF = nil;    // 1.先创建一个BMFont    CCLabelBMFont *bmfont = [CCLabelBMFont labelWithString:@"Hello Beyond" fntFile:@"Marion.fnt" width:350 alignment:CCTextAlignmentCenter];    bmfont.position =  ccp(self.contentSize.width/2,self.contentSize.height/2);    // _bmFont.scale = 1;        // 添加到场景中    [self addChild:bmfont];                // BMFont 另外一个好处是,由于每一个字符都是一个精灵,所以可以runAction    // 2. 取出 BMFont 第0个字符精灵    CCSprite *firstCharSprite = [bmfont.children objectAtIndex:0];    CCActionJumpBy *jump = [CCActionJumpBy actionWithDuration:0.5 position:CGPointZero height:40 jumps:2];    // 延时    CCActionDelay *delay = [CCActionDelay actionWithDuration:1];    // 先跳后,延时1秒    CCActionSequence *sequence = [CCActionSequence actionOne:jump two:delay];    // 让第0个字符精灵永远执行动作    [firstCharSprite runAction:[CCActionRepeatForever actionWithAction:sequence]];            // 3.取出 BMFont 第6个字符精灵    CCSprite *sixCharSprite = [bmfont.children objectAtIndex:6];    // 让第6个字符精灵永远执行动作    [sixCharSprite runAction:[CCActionRepeatForever actionWithAction:[CCActionRotateBy actionWithDuration:3 angle:360]]];}#pragma mark - 时钟方法- (void)update:(CCTime)delta{    if (_labelTTF != nil) {        [self showLabelTTF];    } else if(_bmFont != nil){        [self showBMFont];    }}#pragma mark - 自定义方法- (void)showLabelTTF{    // 随机数字+字母    _labelTTF.string =  [NSString stringWithFormat:@"%f %c", CCRANDOM_MINUS1_1() * 1000, 'a' + (int)(CCRANDOM_0_1() * 26)];}- (void)showBMFont{    // 随机数字+字母    _bmFont.string = [NSString stringWithFormat:@"%f %c", CCRANDOM_MINUS1_1() * 1000, 'a' + (int)(CCRANDOM_0_1() * 26)];}/* // 虽然Atalas已不再使用,但是其特点还是介绍一下 // Atalas 使用的是plist文件,同时,它要求图片里面每一个char要有相同的宽度和高度,并且按ascii顺序排列 ,因为Atalas就是根据ascii值到Plist中去截取对应位置的对应size的图片,作为文字使用 // Atalas适合于 像高速显示少数的几个数字,如左下角的帧率,这样的文字(字符) */@end

CCLabelBMFont需要用到的软件:

Glyph Designer (类似的工具还有Hiero)

glyph n.象形文字,象形符号

软件默认打开界面:

使用了抗锯齿、径向填充（Gradient Fill Glyph）

实心填充(solid fill)

一般情况下:

会先用小字号(如64)生成一个非视网膜屏幕下的图片,如a.png

再用大字号(如128)生成视网膜屏幕下的图片,如a-hd.png

视网膜屏幕下用的a-hd.png,字号大小是上面的2倍,为128

点击【Export】，生成cocos2d使用的fnt文件

此时,在Documents路径下会生成2个文件

.fnt和.png

其中.fnt就是对图片的描述文件,描述每一个字符char在图片中的位置等信息

用文件编辑器打开.fnt,可以看到该文件描述的File是"Marion.png"

在cocos2d v3中,Atlas已经不再使用,这仍简单介绍一下

Atlas 使用的是plist文件,

它要求图片里面每一个char要有相同的宽度和高度,并且按ascii顺序排列 ,

因为Atlas就是根据ascii值到Plist中去截取对应位置的对应size的图片,作为文字使用

Atlas适合于 像高速地动态地显示少数的几个数字,如左下角的帧率(只有0~9),这样的文字(字符)