Spine入门 —— 纹理打包

总述(Overview)

Spine 能帮你把分散的图片打包成一张完整的纹理贴图集或精灵表(spritesheet)以便在 运行时更有效率的渲染。Spine 的纹理打包器(texture packer)是一个通用工具。它即可以 用于为 Spine 的骨骼打包纹理,也可以单独运行为你打包应用程序所需的所有图片资源。

大多数图形 API(如: OpenGL)的工作原理是这样的,绑定一张纹理,然后渲染,完 成之后再绑定一张再渲染,如此往复直到全部完成。绑定纹理相对来说需要消耗大量的系统 资源,所以理想的情况是把一堆小图储存为一张大图,然后就可以一次绑定,再将各区域分 多次渲染。Spine 能有效的将大量小图打包成大图,每张小图的定位信息储存在一个采样文 件中,它们可以通过名称在程序中引用。

Spine 使用了多种先进打包算法。对各种尺寸进行海量尝试,然后选择最优打包方案。

打包(Packing)

纹理打包器可以通过两种方式运行:

  1. 当导出 “JSON” 或 “二进制” 动画数据时,勾选CreateAtlas:

这个方法可以便捷的同时导出动画数据和打包纹理,但是每套骨架会各自分别打包输出 图片,并且忽略目录结构directory structure和 JSON 文件JSON files。要将多套骨架的图片信息打包在一起,请使用下面的方法运行 打包器。

  1. 在主菜单中选择 Texture Packer:

然后指定图片路径进行打包:
输入目录:(Input directory),输出目录:(Output directory),贴图集名称:(Atals name)

设置(Settings)

有许多参数用于控制如何打包图片:

一眼看上去可能让人望而生畏,但大多数情况下用默认设置就可以了。需要特别注意的 地方有: 1) 最大长/宽值(Max width/height), 2) 是否勾选了预乘 alpha(premultiplied alpha), 3) 是否勾选了去除白边。 **如果使用了网络,那应该取消去除白边(Strip whitespace X/Y)。

区域(Regions)

Strip whitespace X/Y:移除输入图片边缘的空白像素。移除的量储存在 Atlas 文件中,因此图片可以 在你的应用程序中绘制就好像没裁剪过一样。如果使用了网格,应该取消移除空白边缘的选项。

Rotation:将某些图片旋转 90 度能高率的打包。应用程序必须特别注意要正确绘制这些地区。

Alias:如果两张图片的所有像素完全相同,那么只打包一次。

Ignore blank images:完全透明的图片不打包。

Alpha threshold 移除空白边缘时,Alpha 低于此值的,被视为 0。

区域填充(Region padding)

Padding X/Y:打包的各图片区域之间的填充像素。某些纹理过滤会平均混合相邻像素,所以推 荐区域间填充 2 个像素以避免相邻的区域互相影响。

Edge padding:填充也将应用到图片页面的边缘。

Duplicatepadding:拷贝相邻的像素用于填充。如果纹理过滤选择了填充像素,此设置能消除"接缝" 瑕疵。

页面(Pages)

Min width/height:输出图片的最小页面尺寸。

Max width/height:输出图片的最大页面尺寸。如果图片大于此值,将分多页输出。

Power of two:确保输出图片的尺寸大小为 2 的幂。某些游戏开发包有此需求。

Square:确保输出的图片长宽相等。某些纹理压缩算法有此需求(如: PVRT)。

输出(Output)

Format:输出 PNG 或 JPG 图片。

JPG quality:输出的 JPG 的压缩质量。
Packing:Atlas 打包图片尽可能紧凑的在一起。Grid 打包图片均匀的排列在网格中 (众所周知的精灵表 spritesheet)。

Premultiply alpha:将 alpha 与每个 R、G 和 B 通道相乘。推荐在适合的情况下用proper blending.

Bleed:设置透明像素到最近的非透明像素的 RGB 值。以免在对透明像素进行 RGB 采样 时造成纹理过滤的瑕疵[filtering artifacts](http://esotericsoftware.com/forum/viewtopic.php?p=13480#p1 3480)

Scale:为每个比例单独输出完整的 Atlas。

Suffix:每个缩放比例 Atlas 的后辍。如果留空,不同尺寸将使用相同文件名,分别输 出到以尺寸命名的子文件夹中。

选项(Options)

Atlas extension:atlas 数据文件的扩展名。

Combine subdirectories:将当前目录和所有子目录的图片打包在同一张图片上。忽略所有子目录中的设置 文件 Pack.json。

Flatten paths:目录信息将从图片文件名字中移除。图片的文件名必须唯一。

Use indexes:使用图片名称无需移除任何图片索引后缀(在最后一个下划线之后的任意字符)

Fast:打包速度更快,但效果不受影响。

Debug:在输出的页面上,为所有图片区域绘制边框。

运行库(Runtime)

以下这些设置意在应用程序运行时,提示相关信息。

Filter min/mag:纹理过滤的缩小和放大设置。

Wrap X/Y:重复贴图纹理的设置。

Format:贴图纹理在内存中使用的格式。

目录结构(Directory structure)

Spine 能为应用程序一次性打包所有图片。给定一个目录,它就会递归扫描其下的图片 文件。将当前目录和所有子目录中 Spine 找到的图片文件拼成一张更大的纹理贴图,称作" 页"。如果图片大小超过了一页的最大尺寸,将会分成多页。

同一个目录下的图片会打包在同一页上。如果一页能放下所有图片,那就不需要分目录 存放,因为每个应用程序只绑定一张纹理。否则,把图片分类放在不同的子文件夹下,可以 最大限度地减少纹理绑定次数。

例如:应用程序可希望把所有的 "game" 图片和 "pause menu" 图片分别放在不同的文 件夹里,这样连续绘制这两张图片只要:先绑定 "game" 并绘制(绑定一次),完成后再绑 定 "pause menu" 再绘制(再绑定一次)。
如果这些文件都放在同一个目录下,将会被混合 打包在多个页面中,每个页面中都有 "game" 和 "pause menu" 图片。这样一来,在绘制 "game" 和 "pause menu" 时都需要执行多次绑定纹理的操作,而无法像之前那样各绑定一次 就能完成绘制。

按文件夹分类图片,还能将纹理设置相关的图片组织在一起。比如每张图运行时的内存 格式(RGBA, RGB, 等等),过滤(nearest, linear, 等等)。图片需要不同的纹理设置,就要分为 不同的页面打包,这时应该将图片用文件夹分开放置。

用文件夹来组织,还是用 Spine 将所有子目录打包到一起,请看 Combine subdirectories 设置。

为了避免子目录的路径出现在 atlas 文件的图片名称中,请看 Flatten paths 设置。

JSON 结构(JSON Configuration)

每个文件夹可以包含一个 "pack.json" 文件用于具体指定此文件夹下图片的打包设置。 每个子文件夹继承其父级的设置。子文件夹中的设置会覆盖父级的设置。

下面是一个 JSON 文件的例子,包含了所有可用的设置。

{
pot: true,
paddingX: 2,
paddingY: 2,
bleed: true, 
edgePadding: true, 
duplicatePadding: false, 
rotation: false, 
minWidth: 16,
minHeight: 16,
maxWidth: 1024, 
maxHeight: 1024,
square: false, 
stripWhitespaceX: false, 
stripWhitespaceY: false, 
alphaThreshold: 0,
filterMin: Nearest,
filterMag: Nearest,
wrapX: ClampToEdge,
wrapY: ClampToEdge,
format: RGBA8888,
alias: true,
outputFormat: png, 
jpegQuality: 0.9, 
ignoreBlankImages: true, 
fast: false,
debug: false, 
combineSubdirectories: false, 
flattenPaths: false, 
premultiplyAlpha: false, 
useIndexes: true,
grid: false,
scale: [ 1 ],
scaleSuffix: [ "" ]
}

注意这是 libgdx 的 "minimal" JSON 格式,因此双引号通常是可选的。 不是所有的设置都需要指定,可以省略部分或全部。例如:取消填充(padding)和合并目录(combine subdirectories)那么 JSON 可以写成这样:

{
paddingX: 0,
paddingY: 0, combineSubdirectories: false
}

在设置 Settings对话框有一个保存 JSON Save JSON 按钮能保存当前设 置。此文件会命名为 pack.json 将它放要输入图片的文件夹下就成了此目录的设置文件, 用不着手动创建设置文件。

九宫格(Ninepatches)

九宫格一般不用于 Spine 骨骼,但有其它的用途。
不算扩展名,如果一个图片文件的名称以".9"结尾,那么它将被识别为九宫格。可以手 动创建九宫格图片,也可以使用这个工具[this tool]。图片必须有 1px 的透明边框。左上边 缘可以有一条连续的黑线用于定义切割信息,九宫格中哪部分将会伸展。在右下边缘可以有 一条连续的黑线用来定义填充信息,内容如何在九宫格中填充。图片打包时,1px 的透明边 框会被移除,切割和填充信息会储存在 atlas 数据文件里。

图片索引(Image indexes)

图片索引一般不用于 Spine 骨骼,但有其它的用途。
如果一个图片文件名以下划线加数字结尾(例如: animation_23.png),这个数字将被 识别为索引,图片的索引会储存在 atlas 文件中。储存图片文件名时不包含下划线和索引。 这样便可以通过索引在一个列表中检索这些图片。这样能更方便的打包精灵动画避免搞乱帧 的顺序。

标签: spine

?>