如何在SpriteBuilder中使用BM Font Label

开始不知道,还真有点小繁琐。

mac系统上创建BM Font的工具有不少,我主要用hiero和GlyphDesigner;前者是java写的,后者是mac原生的,功能都差不多。
还有一个类似的工具bmGlyph。

首先根据不同平台解决方案建立不同的字体尺寸,建议大小如下表:

Table 11-2. Bitmap font scaling for each resources folder

Absolute (iPad screen is 512x384)
UI Scale (iPad screen is 1024x768)
resources-phone
25% (i.e., Font size: 12)
50% (i.e., Font size: 24)
resources-phonehd
50% (i.e., Font size: 24)
100% (i.e., Font size: 48)
resources-tablet
50% (i.e., Font size: 24)
50% (i.e., Font size: 24)
resources-tablethd
100% (i.e., Font size: 48)
100% (i.e., Font size: 48) 

创建完毕后导出为.fnt和.png两个文件,比如1.fnt和1.png
在SpriteBuilder中创建一个Fonts文件夹,然后根据上面创建的字体文件名在Fonts中建立1.bmfont文件夹然后在其中依次建立4个子文件夹:
resources-phone, resources-phonehd, resources-tablet, and resources-tablethd,然后按照不同的平台放入不同尺寸的字体文件(1.fnt和1.png)。

为了示例,我只是将1.fnt和1.png拷贝4次放到4个文件夹中,实际项目中需要修改尺寸以对应不同平台。

注意你建立的1.bmfont后,该文件夹名字会自动变为1.bmfont. ,即后面会多出一个点;这个先不用管,后面会说明处理办法。

这时的文件夹类似如下布局:

只不过图中的字体名称为gd。

在SpriteBuilder中File View视图中鼠标右键点击1.bmfont.文件夹选择Show in Finder,在打开的Finder窗口中将1.bmfont.改为1.bmfont。再回到File View视图中,发现字体图标发生了变化:

接下来,在场景中拖入一个Label BM-Font控件:

将其Font file属性设置为1.bmfont:

你可以将该Label链接到一个变量,然后就可以在Xcode中代码引用了。

我添加了一段倒计时代码,从10到0,然后切换game over场景:

-(void)updateCountDownLabel:(CCTime)dt{
    _countdownSecs += dt;
    if (_countdownSecs >= _totalSecs) {
        CCScene *gameoverScene = [CCBReader loadAsScene:@"Gameover"];
        [[CCDirector sharedDirector] replaceScene:gameoverScene];
    }

    float tmp = _totalSecs - _countdownSecs;
    int sec = tmp * 100 / 100;
    int msec = (int)(tmp*100)%100;
    NSString *str = [NSString stringWithFormat:@"%2d %2d",sec,msec];
    //[_countDownLabel setString:str];
    [_countDownLabelBMF setString:str];
}

-(void)update:(CCTime)delta{
    [self updateCountDownLabel:delta];
}

最终效果如下图:

时间: 2024-10-07 10:18:10

如何在SpriteBuilder中使用BM Font Label的相关文章

如何在SpriteBuilder中设置对象的通用属性

大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 我们知道在SpriteBuilder中可以为对象设置自定义类从而可以进行特殊属性的赋值. 比如我们需要在物理世界中设置重力值,在代码中改来改去略显麻烦,我们可以直接在自定义的属性中设置重力值. 但是一般情况下,我们可能还想设置一些内置对象的属性,比如CCNode等.但是如果你不自定义类,对象是不显示定义属性界面的.这时我们也可以手动设置自定义类,不过该类名就是

SpriteBuilder中使用TrueType字体的一些障碍

在实践中,有一些小的陷阱和障碍可能阻止你使用一般的TrueType字体. 第一个,必须要有一个有效的字体文件.在Finder中双击该.ttf文件,应该会打开Font Book app,显示一个象形符号的字母表.如果没有显示或发生错误,则改字体很可能是损坏的或者不是正确的字体格式. 接下来你要考虑的是字体名不一定和该字体文件的名字一致.字体有3个名字: 字体文件的名字 字体族的名字(family name) 字体的名字 为了使用SpriteBuilder,字体名字和字体文件的名字(除去文件扩展)应

如何在Frontpage2003中运用css设置网页字体

css|frontpage|网页 在网页界面的设计过程中,许多人考虑最多的是用什么图形与色彩来装饰网页,或是在网页上加上什么动画特效:而对于网页的字体却不太重视.结果往往是有些网站的字体不是太小就是太大,严重影响阅览;而有的网站整页用的都是标准字体,毫无个性而言.其实,字体作为网站内容的载体,有其独特的重要性,是不应该忽视的. 运用Html,我们可以对字体的大小及字形进行简单的修改,但要进行统一地控制.创建特殊效果,就必须要用到css.它能让您更有效地控制网页外观,并可以扩充精确指定网页元素位置

lsp-如何在OPNET中配置MPLS以及LSP,急!卡了好多天

问题描述 如何在OPNET中配置MPLS以及LSP,急!卡了好多天 现在由于链路的带宽选择,流量都是走lsr1-3-4,小弟想配置一条静态lsp,让user2的流量都走lsr1-2-4,急,希望知道的亲能帮下忙! 解决方案 参考:https://www.scribd.com/doc/180346146/MPLS-in-OPNET-14-5-STD-docx 解决方案二: lsp原来真没弄过,刚上网查了一下,普级一下知识 MPLS网络结构 MPLS网络的基本构成单元是标签交换路由器LSR(Labe

LFCS 系列第五讲:如何在 Linux 中挂载/卸载本地文件系统和网络文件系统(Samba 和 NF

LFCS 系列第五讲:如何在 Linux 中挂载/卸载本地文件系统和网络文件系统(Samba 和 NF Linux 基金会已经发起了一个全新的 LFCS(Linux 基金会认证系统管理员Linux Foundation Certified Sysadmin)认证,旨在让来自世界各地的人有机会参加到 LFCS 测试,获得关于有能力在 Linux 系统中执行中间系统管理任务的认证.该认证包括:维护正在运行的系统和服务的能力.全面监控和分析的能力以及何时向上游团队请求支持的决策能力. LFCS 系列第

如何在 Ubuntu 中检查笔记本 CPU 的温度

夏天到了,笔记本过热是最近一个常见的问题.监控硬件温度或许可以帮助你诊断笔记本为什么会过热.本篇中,我们会了解如何在Ubuntu中检查CPU的温度. 我们将使用一个GUI工具Psensor,它允许你在Linux中监控硬件温度.用Psensor你可以: 监控cpu和主板的温度 监控NVidia GPU的文档 监控硬盘的温度 监控风扇的速度 监控CPU的利用率 Psensor最新的版本同样提供了Ubuntu中的指示小程序,这样使得在Ubuntu中监控温度变得更加容易.你可以选择在面板的右上角显示温度

高手帮个忙啊,VS2005环境下如何在Picturebos中让图片随便变化?

问题描述 高手帮个忙啊,VS2005环境下如何在Picturebos中让图片随便变化?并记录变化顺序,要求不使用数据库,图片都在Resources中,请高手帮帮啊,最好给个代码,谢谢啦! 解决方案 解决方案二:usingSystem;usingSystem.Collections.Generic;usingSystem.ComponentModel;usingSystem.Data;usingSystem.Drawing;usingSystem.Text;usingSystem.Windows.

PS网页设计教程XV——如何在Photoshop中创建一个充满活力的作品集的网页设计

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试翻译这些优秀的教程.因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教. 约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一些参数,以红色的

PS网页设计教程V——如何在Photoshop中创建一个商业网站布局

作为编码者,美工基础是偏弱的.我们可以参考一些成熟的网页PS教程,提高自身的设计能力.套用一句话,"熟读唐诗三百首,不会作诗也会吟". 本系列的教程来源于网上的PS教程,都是国外的,全英文的.本人尝试翻译这些优秀的教程.因为翻译能力有限,翻译的细节上还有待推敲,希望广大网友不吝赐教. 约定: 1.本文的软件是Photoshop CS5版本 2.原教程的截图是英文的,本人在重新制作的基础上,重新截了中文版的图 3.原文中有些操作没有给出参数.本人在反复测试的情况下测定了一些参数,以红色的