【Cocos2d-html5游戏引擎学习笔记(3)】渲染文字

我们开始从文字最基本的渲染说起吧。cocos2d-html5的渲染文字和cocos2d-x的方法差不多，介绍常用的方法。

在介绍之前先介绍一点cocos2d-html5的一些语法特点，在cocos2d-x里面的一些类都是CCLabelTTF::create()，以CC开头，再使用工厂方法create出来，而cocos2d-html5也是重新覆写满足于cocos2d的语法特点，一般是cc.LabelTTF.create()。所以这样学起来会比较轻松，如果你有cocos2d-x的语法基础。

比较常用的有三种

第一种：

var size = cc.Director.getInstance().getWinSize(); //获取屏幕的大小

var label1 = cc.LabelTTF.create("你好cocos2d-html5", "Microsoft Yahei", 30);
label1.setPosition(cc.p(size.width/2,size.height/2));
this.addChild(label1);

cc.LabelTTF.create的

第一个参数是你要显示的文字，中英文都可以支持；
第二个参数是系统自带的字体；
第三个参数是字体的大小。

效果如下

第二种：

var label1 = cc.LabelBMFont.create("Hello Cocos2d-html5", bitmapFontTest5.fnt);
label1.setPosition(cc.p(size.width/2,size.height/2));
this.addChild(label1);

cc.LabelBMFont.create的
第一个参数是你要显示的文字；
第二个参数是.fnt文字文件。

效果如下

第三种：

var label1 = cc.LabelAtlas.create("HELLO COCOS", larabie-16.plist);
label1.setPosition(cc.p(size.width/2,size.height/2));
this.addChild(label1);

cc.LabelAtlas.create的
第一个参数是你要显示的文字；
第二个参数是.plist文字文件。

效果如下

好了，三种文字显示方式就是这样。

基本的常用的其实第二种，这种渲染的效果是效率最高的，因为它的原理就是显示一张字符图片中需要显示的文字，每次都只是渲染了一次，而第一种方式是每新建一个文字就要渲染一次。

后面我们就开始介绍菜单渲染了。

PS：我也是边学边写博客，我把以前写的游戏又拿出来在cocos2d-html5上重新写了一次，嘿嘿，挺不错的，效果在下面，大家一起好好学这个引擎吧，加油