转载请注明出处:
http://blog.csdn.net/lttree
上次是文字的部分,介绍了一下 BMFont的相关东西;
这次是图片部分——TexturePacker
这是 德国的CodeAnDWeb团队开发的纹理图集编辑软件,相当强大哟~
说正事= =。
what is 纹理图集 is what-在做一款游戏的时候,会用到大量的图片,可能有些是背景、按钮等单张图片,也可能是动画这样的一系列的图片,
如果一张一张的放在文件夹,不方便查找,也不方便使用,效率还低下。
-但是,如果把这些图片都放进一张大图里面,引擎在读取这些东西时候,就很快速,在使用的时候,还可以裁取其中一部分使用,
这样 提高了效率、减少了内存的消耗 。
-纹理图集 和 之前的BMFont的差不多,
有两个文件,一个存储 位置,一个存储图片,
但BMFont是 .fnt 和 .png;而纹理图集 是 .pList 和 .png(iOS系统用的 .pvr)
——这就是 纹理图集
TexturePacker 支持windows 和 Mac OS这两个 *** 作系统(这点很方便~)
而且,不止是Cocos2d-x,TexturePacker工具 支持很多游戏引擎,这点,在界面中专门有选项,让你选择生成哪个引擎的,总之就是很强大的啦。
额,对了,这么炫酷的东东,当然,收费的啦,
虽然,也可以免费试用,但是免费的版本有些功能不能试用,最最关键的是,最后生成的图片的部分纹理会无法显示。(要么交钱,要么…)
现在来看看TexturePacker的界面吧~
(PS:我用的是 3.0.9版本)
主界面:
加点注释:
输出设置:
+这里说一下 Premultiply @R_404_5997@ 这个勾选与否的区别就像下面这张图:
( 图片来自 visualcatsharp 的博客 )
+关于 Image Format,它有14种类型,
前面的RGBA ,RGB就是 红绿蓝三个通道,A就是透明度
(剩下的就不是很了解了 o(╯□╰)o。。)
+关于 Dithering (抖动),这个就是为了防止像素点之间色差过大造成的颜色阶梯,如果有颜色阶梯,那就勾选它吧,它会让问题变好一些
构图设置:
+Size constraints,宽高尺寸的限制,有三种(2的次幂,任何尺寸,除2的次幂外任何尺寸),为了方便传统游戏引擎,默认用2的n次幂,但是用 OpenGL 2.0技术的引擎(比如Cocos2d-x)就没有限制了
+Scale mode,图像在缩放的时候会失真,这个选项就是来处理这个问题
布局设置:
这次,就拿FlappyBird的主界面做例子吧~
先找到相应图片(如果没有,不要紧~文章末尾会给出链接~)
1.打开TextuerPacker,在工具栏中,找 Add Sprites 或者 Edit菜单下的 Add Sprite,甚至可以 直接从文件夹 选中相应图片,拖动到 图片文件列表 那部分。
2.右边有一大部分空白,很浪费空间啊,有木有,所以,稍微设置下(不要说我抠门,能省一点是一点sa~)
在 构图设置 中,如果 Force squared(必须是正方形)选中的话,取消选中;
然后在 上面 Size constraints(尺寸限制),就不要2的次幂了,来个any size
3.可以publish了~
已经生成了 这两种文件,我们可以来创建场景了。
+先加载纹理图集:
// 预处理——获取可视屏幕尺寸visibleSize = Director::getInstance()->getVisibleSize();SpriteFrameCache *cache = SpriteFrameCache::getInstance();cache->addSpriteFramesWithfile("tp_demo.pList","tp_demo.png");
+将背景图片提取出来,加载到场景中:
Sprite *bg = Sprite::createWithSpriteFramename("bird_bg.png"); bg->setposition(Vec2(visibleSize.wIDth/2,visibleSize.height/2)); this->addChild(bg);
+加载 标题 logo:
Sprite *Title = Sprite::createWithSpriteFramename("bird_logo.png"); Title->setposition(Vec2(visibleSize.wIDth/2,visibleSize.height/9*6)); this->addChild(Title);
+加载 小鸟飞行动画:
Sprite *sp = Sprite::createWithSpriteFramename("bird_hero01.png"); sp->setposition(Vec2(visibleSize.wIDth/2,visibleSize.height/9*4)); this->addChild(sp); Vector< SpriteFrame* > sfme = Vector< SpriteFrame* >(4); for( int i = 1 ; i < 4 ; i++ ){ SpriteFrame* fname = cache -> spriteFrameByname( StringUtils::format("bird_hero%02d.png",i) ); sfme.pushBack( fname );}Animation *animation = Animation::createWithSpriteFrames( sfme,0.1f ); sp->runAction ( RepeatForever::create(Animate::create(animation )));
+加载 开始 按钮:
Sprite *btn = Sprite::createWithSpriteFramename("bird_start_btn.png"); Sprite *btn_pressed = Sprite::createWithSpriteFramename("brID_start_btn_pressed.png"); auto imageItem = MenuItemSprite::create( btn,btn_pressed,NulL,CC_CALLBACK_1(TPacker::menuimgCallback,this));imageItem->setposition(Vec2(visibleSize.wIDth/2,visibleSize.height/9*2));auto menu = Menu::create(imageItem,NulL);menu->setposition(Vec2::ZERO);this->addChild(menu);
ok,运行吧~
这篇文章就到这里了,
下一个就是 音频处理 的部分了。
本篇文章的 素材+代码: >这里<
总结以上是内存溢出为你收集整理的Cocos2d-x 周边工具 之 TexturePacker全部内容,希望文章能够帮你解决Cocos2d-x 周边工具 之 TexturePacker所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)