cocos2dx中使用JPG图和只带Alpha的PNG图合成渲染[转]

http://www.cnblogs.com/elang/p/4104452.html
https://blog.csdn.net/u012839224/article/details/44895033

手游控制安装包的大小是非常重要的,这里介绍一种方法。将带Alpha通道的PNG图片分拆成RGB和Alpha分别保存,其中保存RGB的这张图把它转换成JPG格式的文件,保存Alpha图片的就用PNG格式的。原理是JPG格式的压缩率比较的高可以减小图片的大小,但是它没有Alpha,而Alpha数据单独拎出来一般比较小,所以直接用PNG格式来保存。问题是怎样分拆PNG图片,又怎样在程序中怎样将两张图片的数据合并起来以达到和直接用一张带Alpha的PNG图渲染出来是一样的效果。这里提供我自己的方法,给大家参考下,有错误的地方希望大家指出来,谢谢!

1. 将PNG图片分拆,也就是将一张PNG图片生成出一张带RGB的JPG+一张带Alpha的PNG,我使用的工具是imagemagick。这里以bg.png为例:

首先ImageMagick工具提取出Alpha通道,(命令: convert bg.png -channel A -alpha extract bgAlpha.png)

然后在将bg.png转成JPG格式 输出为bg.jpg。jpg格式已经不包含Alpha通道,而且jpg的压缩率比较高(这是采用这种方法可以减小图片大小的根本所在)。(convert bg.png bg.jpg)

这样就得到了bg.jpg 和bgAlpha.png,这两张图片就是我们需要的资源。这样转换之后bg.jpg+bgAlpha.png的大小大概比bg.png的 小2~3倍

2. 在程序中合成

由于在win,Android平台采用的JPG和PNG解析库和IOS上的不同,所以在程序中要分别处理,这里介绍下在IOS上的方法(win和Android平台解析参照CCImage的_initWithJpgData和_initWithPngData 方法,合并和IOS的平台类似,不同地方文中会指出), 这个方法添加在CCImage.mm 文件中即可使用(cocos2dx版本是2.2.2)。

bool CCImage::initWithRgbAndAlpha(const char * jpgFilePath, const char * pngFilePath)
 {
     bool bRet = false;
     
    do {
     
         // 获得JPG文件的数据
         unsigned long nSizeJpg = 0;
         unsigned char* pBufferJpg = CCFileUtils::sharedFileUtils()->getFileData(
                                         CCFileUtils::sharedFileUtils()->fullPathForFilename(jpgFilePath).c_str(),
                                         "rb",
                                         &nSizeJpg);
         // 保证JPG文件数据必须是存在的
         if (pBufferJpg == NULL && nSizeJpg <= 0) {return true;}
         
         
         // 获得Alpha文件的数据
         unsigned long nSizePng = 0;
         unsigned char* pBufferPng = CCFileUtils::sharedFileUtils()->getFileData(
                                         CCFileUtils::sharedFileUtils()->fullPathForFilename(pngFilePath).c_str(),
                                         "rb",
                                         &nSizePng);
         
         tImageInfo jpgInfo = {0};
         
         jpgInfo.hasShadow = false;
         jpgInfo.hasStroke = false;
         
         
         // 利用CCImage原有的方法解析JPG
         bRet = _initWithData(pBufferJpg, nSizeJpg, &jpgInfo);
         unsigned char* jpgData = jpgInfo.data; 
         
         if (!bRet) {return false;}
         
         
       
         tImageInfo pngInfo = {0};
         
         pngInfo.hasShadow = false;
         pngInfo.hasStroke = false;
         
         //利用CCImage原有的方法解析Alpha文件  
         bRet = _initWithData(pBufferPng, nSizePng, &pngInfo);
         unsigned char* pngData = pngInfo.data;
         
         if (!bRet) {return false;}
         
       
         unsigned short jpgHeight = (short)jpgInfo.height;
         unsigned short jpgWidth = (short)jpgInfo.width;
         
         int jpgDataLen = jpgHeight * jpgWidth;
         
         int pngIndex = 0;
         int jpgIndex = 0;
         
         m_pData = new unsigned char[jpgHeight * jpgWidth * 4];
         unsigned int *tmpData = (unsigned int *)m_pData;
         
         // 合并两个文件的数据
         for(int i = 0; i < jpgDataLen; i++)
         {  
         
              // 这个宏和CC_RGB_PREMULTIPLY_ALPHA是一样的,作用是将R,G,B 三个颜色值分别乘Alpha值得到合并的R,G,B值, 
             *tmpData++ = CC_RGB_PREMULTIPLY_ALPHA_IOS(
                                 jpgData[jpgIndex], // R
                                 jpgData[jpgIndex + 1], // G
                                 jpgData[jpgIndex + 2], // B
                                 pngData[pngIndex]);  //A
 
             // 两张图片在解析之后都为32位了,所以+4 (Android或者win上 不带Alpha通道的png文件和jpg文件解析之后是24位的,这是主要区别的地方)
             jpgIndex += 4;
             pngIndex += 4;
         }
         
         m_nHeight = (short)jpgInfo.height;
         m_nWidth = (short)jpgInfo.width;
         
         m_nBitsPerComponent = jpgInfo.bitsPerComponent;
         m_bPreMulti = true;
         m_bHasAlpha = true;
         
         CC_SAFE_DELETE_ARRAY(pBufferPng);
         CC_SAFE_DELETE_ARRAY(pBufferJpg);
         CC_SAFE_DELETE_ARRAY(jpgData);
         CC_SAFE_DELETE_ARRAY(pngData);
         
         bRet = true;
         
     } while (0);
     
     return bRet;
}

这个方法执行之后bg.jpg和bgAlpha.png合并完成,当前的CCImage对象生成的纹理就和直接用bg.png初始化后生成的纹理效果是一样的了。

另外附上一个将png图片分拆成Jpg和Alpha的shell脚本(shell不太熟,将就着用_),使用这个脚本的前提是你已经安装了imagemagick,这个脚本运行之后会遍历当前目录下的所有png文件,然后分拆这些文件,并且会删除原png文件。(如果不想删除原png文件,把rm $src去掉即可)

#!/bin/sh
 convert_img(){
     for file in `ls -a $1`
         do
         if [ x"$file" != x"." -a x"$file" != x".." ];then
             str="$1/$file"
             length=${#str}
 
             sufLength=$(($length - 4))
             strSuf=${str:$sufLength:$length}
 
             if [ x"$strSuf" = x".png" ];then
                 src=${str:2:$length}
                 dst=${str:2:$dstLength}
 
                 dstLength=$(($length - 6))
 
                 dstSuf="mask"
                 dstJpg=".jpg"
 
                 convert $src -channel A -alpha extract $dst$dstSuf
                 convert $src  $dst$dstJpg
 
                 `rm $src`
                 echo $src
 
             elif [ -d "$1/$file" ];then
                 convert_img "$1/$file"
             fi
         fi
         done
 }
 
convert_img .
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,456评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,370评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,337评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,583评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,596评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,572评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,936评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,595评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,850评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,371评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,951评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2 342

推荐阅读更多精彩内容