Cocos2d-x优化中关于背景图片优化

由于背景图片长时间在场景中保存而且图片很多我们可以对其进行一些优化。我们通过如下几个方面考虑优化
1、不要Alpha通道
背景图片的特点是不需要透明的所以纹理格式可以采用不带有Alpha通道格式所以RBG565格式比较适合背景图片。
2、拼图
背景图片与其它的图片纹理格式的不同我们在创建精灵表的时候没有办法将RBG565格式的背景图片与其它的纹理图片如RGBA4444做在一个精灵表所以基于格式的考虑我们可以将多个背景放置在一个精灵表中的但是要注意这个精灵表拼接成的大图文件不能太大一些老设备对于单个文件大小是有限制的如iPod touch 4是单个文件不能超过2048 * 2048像素大小。
3、加载到纹理缓存的时机
什么时候加载背景图片到纹理缓存呢这个问题主要看这个背景图片的场景使用使用频率如果频率高就要在游戏初始化时候加载。频率比较低的场景背景图片可以考虑进入场景时候加载。在图片进行加载的时候由于背景图片比较大加载时间比较长可以考虑异步加载。
4、小纹理图片重复贴图
如果场景的背景采用单色或有规律的图形我们可以采用小纹理图片重复贴图实现。我们在第8章案例采用了一个128x128纹理图片BackgroundTile.png反复贴图上这样可以减少内存消耗。核心代码如下
//贴图的纹理图片宽高必须是2的n次幂128x128
auto bg = Sprite::create("BackgroundTile.png", 
Rect(0, 0, visibleSize.width, visibleSize.height));
//贴图的纹理参数水平重复平铺垂直重复平铺
Texture2D::TexParams tp = {GL_LINEAR, GL_LINEAR, GL_REPEAT, GL_REPEAT};
bg->getTexture()->setTexParameters(tp);
bg->setPosition(origin + Vec2(visibleSize.width/2, visibleSize.height/2));
addChild(bg, 0);

5、考虑使用瓦片地图
背景可以考虑采用瓦片地图实现。瓦片地图由于只需要几个小图片就可以构建一个很大的游戏背景它的性能自不用多说但是它的缺点也是由于采用几个瓦片拼接而成背景上有很多重复的区域如果用户不在乎这些当然选择瓦片地图构建背景是我们首选方式。另外在设计瓦片地图的时候地图中的层不要超过4层。

6、背景z深度的优化
有的时候为了达到动态视差效果背景被分成了几个图片如图所示我们可以把云、树木、草地和山分别放置在不同背景图片中我们通过设置z轴顺序z-order。

这种情况下我们开启深度测试。OpenG ES中的深度测试是采用深度缓存器算法消除场景中的不可见面。在Cocos2d-x中开启深度测试可以在AppDelegate.cpp中修改代码如下
bool AppDelegate::applicationDidFinishLaunching() {
    … … 
director->setDepthTest(true);

    return true;

}

director->setDepthTest(true)开启深度测试director是Director类是的对象指针。深度测试默认是关闭如果开启深度测试会消耗更多的电量。

更多内容请关注最新Cocos图书《Cocos2d-x实战 C++卷》‍

本书交流讨论网站http://www.cocoagame.net

更多精彩视频课程请关注智捷课堂Cocos课程http://v.51work6.com

欢迎加入Cocos2d-x技术讨论群257760386

《Cocos2d-x实战 C++卷》现已上线各大商店均已开售‍

京东http://item.jd.com/11584534.html

亚马逊http://www.amazon.cn/Cocos2d-x%E5%AE%9E%E6%88%98-C-%E5%8D%B7-%E5%85%B3%E4%B8%9C%E5%8D%87/dp/B00PTYWTLU

当当http://product.dangdang.com/23606265.html

互动出版网http://product.china-pub.com/3770734

《Cocos2d-x实战 C++卷》源码及样章下载地址

源码下载地址http://51work6.com/forum.php?mod=viewthread&tid=1155&extra=page%3D1 

样章下载地址http://51work6.com/forum.php?mod=viewthread&tid=1157&extra=page%3D1

欢迎关注智捷iOS课堂微信公共平台

时间: 2024-10-30 13:54:24

Cocos2d-x优化中关于背景图片优化的相关文章

如何在博客文章中添加背景图片

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 博客文章中添加背景图片 一.blog贴图(仅限网易博客) 其实贴图的显示问题和图片的来源有关.如果blog中插入的图片是来自网易相册的,就可以在主页显示,其它来源的图片就不能了.因此,大家想要贴图在主页显示,只要把图片先存入网易相册,再调用相册里的图片链接就ok了!(贴图应在设计视图完成!)设计图可以到我图网里下载http://www.ooo

CSS网页设计中使用背景图片须注意路径问题

css|背景图片|设计|网页|网页设计|问题 网页设计技巧文章,CSS网页设计中使用背景图片须注意路径问题. 在传统的表格布局中,背景图片是直接应用于表格的,一般情况下CSS的background-image属性使用非常少,或者说根本就不使用.应用CSS网页布局,实现内容与表现.行为相分离,作为页面框架.装饰等图片我们就直接剥离到CSS文件中,通过CSS进行定义. 我们通常用link的方法直接引用一个CSS文件到HTML(或其它活动文档)文件中.我们会发现有时候我们的图片无法显示了.此时,请查看

如何在word2013中添加背景图片

  word2013中添加背景图片的步骤如下: 步骤一:打开word2013版:"设计"功能区--"页面背景"组(最右边)--"页面颜色". 步骤二:打开"页面颜色"的下拉三角形--选择"填充效果". 步骤三:点击"填充效果"弹出对话框--选择"图片". 步骤四:继续选择"选择图片"--弹出对话框--第一次它默认必应搜索图片,点击脱机工作,然后出现

html5-HTML5中设置背景图片大小

问题描述 HTML5中设置背景图片大小 插入一张背景图片,设置成图片平铺,不重复铺,怎么弄啊 ,求大神把具体步骤发下,O(∩_∩)O谢谢! 解决方案 如果平铺又不重复,其实是拉伸,设置background-size为100%如果不重复,设置background-repeat:为no-repeat

java 中何使面板中的背景图片随面面变大变而改变

问题描述 请问各位java高手java中何使面板中的背景图片随面面变大变而改变???在此我表示感谢! 解决方案 解决方案二:一般的解决方法是在背景图片的属性里找到Anchor的属性,将里面的四个都选上就可以了.解决方案三:大哥,能不能给我讲具体点呀?我是新手,有些东西不那么明白!

为啥li中的背景图片显示不出来

问题描述 为啥li中的背景图片显示不出来 代码如下: <style type="text/css"> #topnav{ height:36px; background-color:silver; border: 1px solid seagreen; } #topnav ul{ /*line-height:30px;*/ margin: 5px; padding: 0px; border-bottom: solid; border-bottom-width: 2px; bo

seo优化中不容忽视的页面优化

seo优化中页面的优化是很重要的,合理的对网站页面进行优化,使网站更加适合搜索引擎的检索.但是还是有很多的企业在网站建设完成后对于页面的优化并不重视,title没有写,要么关键词布局不合理,要么网页代码过于复杂,这些问题都会直接影响网站的优化效率.其实对于页面的优化并不是很难,只需要注意网站页面优化的几个要点几个: 1.mate标签的优化 对于Meta标签,主要有title.description.keywords三个地方,页面的tittle在页面的优化中是占比较重要的部分,通常设置为20-25

浅析网站SEO优化中关于站内优化的技巧

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 对于网站SEO优化来说,相信许多站长们都略有了解.一般情况下,网站SEO优化主要分为站内优化与站外优化两个部份.对于站外优化来说,如果简单来说说,其实就是指网站的外链建设,常见的方法,例如:借助于友情链接,论坛,百度帖吧,目录提交,收藏夹,博客,以及分类信息等等.相信上述方法,对于略懂网站SEO优化的朋友来说,都很子解,在这里笔者也就不再一一

WPS演示中设置背景图片的方法

  操作步骤 1.打开WPS演示中的一篇幻灯片,在正文部分,点击鼠标右,在弹出的快捷菜单中选择"背景"命令; 2.在幻灯片的正文部分会出现一个"背景"的对话框,点击下面的倒三角按钮,在弹出的下拉菜单中选择"填充效果"命令; 3.在"填充效果"的对话框中选择"图片"选项卡,点击"选择图片"选项; 4.在跳出的"选择图片"对话框中选择自己喜欢的图片,然后点击"打