使用命令行工具提升cocos2d-x开发效率(一)之TexturePacker篇

转载 2014年08月21日 23:27:47


转自:http://www.cnblogs.com/flyFreeZn/p/3587770.html

[原创]使用命令行工具提升cocos2d-x开发效率(一)之TexturePacker篇

TexturePacker是一个常用的制作sprite sheet的工具,它提供了很多实用的功能。

一般我们制作sprite sheet都是使用他的gui版本,纯手工操作,就像下面这张图示的一样。

刚开始我们的项目也是使用这种方式,但后来发现这种方式在开发中有很大的问题。随着图片的增多,sprite sheet会越来越多,为了生成这些sprite sheet需要做很多重复的手工劳动,再考虑到给Android平台打包的sprite sheet配置和iOS的不同,还有包括图片变更,配置优化等情况,算下来光打包sprite sheet就需要巨大的工作量,这还不考虑由于手工误操作造成的各种问题。

于是我就考虑,如何尽可能地减少打包sprite sheet的工作量,提高开发的效率。后来通过搜索,看到raywenderlich上一篇关于使用TexturePacker的文章,里面比较详细地介绍了TexturePacker的用法,特别还提到了它的命令行工具的使用以及这个工具和xcode的集成,这给了我想要的答案。

接下来讲一下我在项目中如何使用这个TexturePacker的命令行工具以及实用它的一些经验。

具体下载和安装TexturePacker以及它命令行工具的方法就不说了,上面提到的那篇文章里有较详细的说明。一些准备就绪后,我们可以在命令行里执行texturepacker命令,正常情况下你将会看到texturepacker的各种参数以及使用方法的说明,如下图:

接下来为了方便说明,我们新建一个测试工程foo,这里以quick-cocos2d-x-2.2.1-rc引擎创建的工程为例,创建好后目录结构如下图:

我们需要一个目录去保存所有原始的(未打到sprite sheet里的)图片,这里我们新建个目录叫originalImages,然后找些图片,丢进这个目录,并将他们分类到不同的文件夹,接着我们再创建一个目录,用来存放我们打包sprite sheet的脚本工具,我们起名叫tools,然后,我们再创建一个目录spriteSheets,用于存放打好的图片,最后,一般我们会将工程用到的图片存放到res/images目录里面,所以为了清楚,再创建一个这个文件夹,最终目录结构如下图所示:

接下来我说一下思路,我们的脚本工具存放在tools文件夹中,运行之后会去遍历originalImages这个目录下的所有文件夹,然后将每个文件夹中的图片打包为一个sprite sheet,这个sprite sheet名字与该文件夹的名字相同,接着将打包后的sprite sheet文件复制两份,一份存入spriteSheets目录中,另一份拷贝到我们程序使用图片的目录。举例来说,当我运行脚本,会生成三份sprite sheet,分别是button.png,button.plist,checkBox.png,checkBox.plist,common.png,common.plist,他们分别会存放入spriteSheets目录和res目录下的images目录中(一般res目录下的images目录用来存放程序中用到的图片)。

好的,一切准备就绪,我们开始说说这个脚本究竟要如何编写。

首先我们需要大概了解一下texturepacker的一些常用参数。

--format : 指定sprite sheet的格式,默认是cocos2d,做cocos2d-x项目的话,就选cocos2d就行。可选的选项如下:

--texture-format:非常重要的一个属性,指定texture的格式。如果我们做iOS上的游戏,一般都会使用PVR,因为这个format的texture是专门为苹果iPhone和iPad的图形处理器优化的,而Android因为设备硬件多种多样,所以我们一般可能会选用png格式的,感兴趣的朋友可以自己搜索一下相关内容。这个参数如果不指定值的话texturepacker会尝试去根据sprite sheet的命名来自动选择一个合适的format。具体的选项如下:

--data:指定data文件的名字,也就是plist文件的名字

--sheet:sprite sheet文件的名字

--enable-rotation:是否开启旋转。一般我们会开启,为了更有效率的将散图打在一起。

--scale:在创建sprite sheet之前为所有散图做一个调整scale的操作,比如,如果是0.5,那么就把原始图都压缩一般大小,再存入sprite sheet中

--shape-padding:设置每个图片在sprite sheet中的间隔,默认是2

--max-size:sprite sheet的最大尺寸,你不可能将所有图片都打入到一张sprite sheet里,因为没有设备能支持这样的sprite sheet,于是需要限定大小:)。

--opt:这个是很重要的一个属性,决定了sprite sheet的像素格式,这个属性可以很大程序改变sprite sheet所占的内存。常用的选项如下:

 --trim:为了能在一张sprite sheet加入更多的图片,裁减掉原始图片的空白像素,但是使用的时候还是按照图片的原始尺寸来使用。

 --smart-update:智能更新,为了避免重复生成相同内容的sprite sheet,texturepacker会检查现存的sprite sheet和将要生成的sprite sheet内容是否相同,如果不同再生成新的,如果相同则不生成。

好了,最后我们上脚本:(脚本写的一般,见笑了)

复制代码
 1 #! /bin/bash
 2 
 3 CURRENT_DIR=`dirname $0`
 4 
 5 # input paths
 6 IMAGE_DIR=$CURRENT_DIR/../originalImages
 7 
 8 # path that game proj use
 9 GAME_IMAGE_PATH=$CURRENT_DIR/../res/images
10 
11 # temporary path to place the sprite sheets
12 OUTPUT_PATH=$CURRENT_DIR/../spriteSheets
13 OUTPUT_PATH_PVR=$OUTPUT_PATH/packagedPVR
14 OUTPUT_PATH_PNG=$OUTPUT_PATH/packagedPNG
15 
16 # path of the texture packer command line tool
17 TP=/usr/local/bin/TexturePacker
18 
19 # $1: Source Directory where the assets are located
20 # $2: Output File Name without extension
21 # $3: RGB Quality factor
22 # $4: Scale factor
23 # $5: Max-Size factor
24 # $6: Texture Type (PNG, PVR.CCZ)
25 # $7: Texture format
26 pack_textures() {
27 
28     ${TP} --smart-update \
29         --texture-format $7 \
30         --format cocos2d \
31         --data "$2".plist \
32         --sheet "$2".$6 \
33         --maxrects-heuristics best \
34         --enable-rotation \
35         --scale $4 \
36         --shape-padding 1 \
37         --max-size $5 \
38         --opt "$3" \
39         --trim \
40         $1/*.png 
41 
42 }
43 
44 # check the output path
45 
46 if [ -d $OUTPUT_PATH ];then
47     :
48 else
49     mkdir $OUTPUT_PATH
50 fi
51 
52 if [ -d $OUTPUT_PATH_PVR ]
53 then
54     :
55 else
56     mkdir $OUTPUT_PATH_PVR
57 fi
58 
59 if [ -d $OUTPUT_PATH_PNG ]
60 then
61     :
62 else
63     mkdir $OUTPUT_PATH_PNG
64 fi
65 
66 # do the job
67 for i in $IMAGE_DIR/*
68 do
69     if [ -d $i ] 
70     then
71         spriteSheetName=`basename $i`
72         pack_textures $i $OUTPUT_PATH_PNG/$spriteSheetName 'RGBA8888' 1 2048 'png' "png"
73         pack_textures $i $OUTPUT_PATH_PVR/$spriteSheetName 'RGBA8888' 1 2048 'pvr.ccz' "pvr2ccz"
74     fi
75 done
76 
77 # cp them to the game proj image path
78 
79 cp -f $OUTPUT_PATH_PVR/* $GAME_IMAGE_PATH
复制代码

将脚本的内容保存到一个文件中,命名后把后缀改为command,比如我是这个样子的:

然后记得在命令行里改一下脚本的权限,最后双击一下脚本,新鲜的sprite sheets就打包出来了,如果有什么图片的改动,只需要修改originalImages这个目录下的图片,然后双击一下脚本,新的sprite sheet就生成好了,再也没有了无聊烦人的手工劳动,向TP的GUI说再见吧!是不是很爽?:)

最后简单说一下在脚本里我们做的事情:在脚本中我们针对originalImages里面每一个文件夹中的图,生成了两份sprite sheet,这两份唯一的区别是一份是pvr2ccz格式的,一份是png格式的,其他的属性都相同:像素格式RGBA8888,scale为1,最大尺寸为2048*2048。在生成完成后,将所有的sprite sheet拷贝到了spriteSheets这个文件夹,并把其中pvr格式的sprite sheet拷贝到了我们工程使用的图片目录里。

OK,大概就是这样子,那个脚本可以根据项目具体需求去改,我写的很简单,也没加什么log,这个其实完全可以写得更智能话写,这就留给各位去发挥了。

感谢大家的收看~ 如果有问题可以留言或者私信我,我会尽量回覆大家。

最近刚开始专门写博客,如果表达的不好,或者有其他方面问题,也请大家多提宝贵意见:)

 

最最后,原创文章,转载请注明出处,谢谢:)

TexturePacker 图片打包工具讲解与使用并且批处理打多包以及资源加密

TexturePacker这个词从字面来说就是Texture(纹理) + Packer(打包)。它是一款把若干资源图片拼接为一张大图的工具。 官方网址:点击打开链接 手机游戏开发中,为了提高图片渲...
  • song_hui_xiang
  • song_hui_xiang
  • 2013年07月13日 00:23
  • 19486

让你的Android开发效率提高10倍的开源工具库AndroidTools的使用

# AndroidTools持续更新请star项目 github地址:AndroidTools (喜欢这个工具的,可以star一下,以后方便找到,Happy coding!)English READM...
  • dongdong230
  • dongdong230
  • 2017年01月22日 16:48
  • 1893

Shell小工具, 这些工具极大的提高了我的工作效率

我的Shell作品      下面列出的Shell作品都是这些年工作中写些的,写这些脚本的惟一目的就是提高工作效率.事实证明,这些脚本对我的工作效率有了很大的提高,而且这些脚本有些我已经推广给项目...
  • u011634421
  • u011634421
  • 2014年03月22日 01:16
  • 6528

cocos2d-x位图字体生成工具Bitmap Font Generator的使用(内含命令行)

对于Bitmap Font Generator的使用方法网上的也有很多文章进行了说明,但是可能并不够全面 本文可能也没有那么全面,但是绝对有新颖的地方。 首先,说下为什么要使用这款工具作为cocos2...
  • jinjian2009
  • jinjian2009
  • 2013年07月18日 21:00
  • 6972

cocos2d-x3.2总结(二)使用TexturePacker工具创建和使用纹理图集

游戏进行过程中通常需要加载多张图片。如果每次只加载一张,则需要加载多次,那么这样就需要很长的时间和比较多的内存。如果我们把需要加载的多张图片整合到一张图片,则需要加载一次,那么这样仅花费一次的时间。而...
  • cbbbc
  • cbbbc
  • 2014年08月01日 11:02
  • 1378

【Cocos2d-x】 一个简单的将plist分割为原图的命令行工具

缘起 在学习Cocos2d-x时,经常需要到网上下载一些游戏实例。很多源码中的图片资源都是经过Texture Packer打包过的plist文件而没有提供单个的原图片文件。于是我就想着写一个脚本把打包...
  • Xiejingfa
  • Xiejingfa
  • 2015年08月27日 10:37
  • 3536

【Cocos2d-x游戏引擎开发笔记(22)】TexturePacker的使用

转载自:http://blog.csdn.net/zhy_cheng/article/details/8680931。 首先要解释一下,为什么要使用TexturePacker? 这是应为我...
  • lannan91
  • lannan91
  • 2015年03月04日 14:06
  • 232

【Cocos2d-x游戏引擎开发笔记(22)】TexturePacker的使用

原创文章,转载请标明出处:http://blog.csdn.net/zhy_cheng/article/details/8680931。 首先要解释一下,为什么要使用TexturePacker? ...
  • zhy_cheng
  • zhy_cheng
  • 2013年03月16日 13:45
  • 10380

如何使用命令行编译运行cocos2d-x的android工程

使用create_project.py生成工程后,如果使用Eclipse导入Android工程编译会遇到许多各种各样的“麻烦”,并且使用Eclipse编译的效率也非常的低。那么有没有其它方法来编译呢?...
  • u011781834
  • u011781834
  • 2014年03月30日 21:10
  • 1313

Cocos2d-x 周边工具 之 TexturePacker

Cocos2d-x 周边工具 之 TexturePacker 纹理图集
  • lx417147512
  • lx417147512
  • 2015年09月26日 16:46
  • 1082
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:使用命令行工具提升cocos2d-x开发效率(一)之TexturePacker篇
举报原因:
原因补充:

(最多只允许输入30个字)