spine-texture-packer

# 总述（Overview）

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

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

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

# 打包（Packing）

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

**1)** 当导出 “JSON” 或 “二进制” 动画数据时，勾选`Create Atlas`：

![](/img/packer-create-atlas.gif)

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

**2)** 在主菜单中选择 `Texture Packer`：

![](/img/packer-menu.gif)

然后指定图片路径进行打包：
输入目录：（Input directory），输出目录：（Output directory），贴图集名称：（Atals name）

![](/img/packer-dialog.gif)

# 设置（Settings）

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

![](/img/packer-settings.gif)

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

## 区域（Regions）

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Strip whitespace X/Y</td><td>移除输入图片边缘的空白像素。移除的量储存在 Atlas 文件中，因此图片可以在你的应用程序中绘制就好像没裁剪过一样。<b>如果使用了网格，应该取消移除空白边缘的选项。</b></td></tr>
<tr><td>Rotation</td><td>将某些图片旋转90度能高率的打包。应用程序必须特别注意要正确绘制这些地区。</td></tr>
<tr><td>Alias</td><td>如果两张图片的所有像素完全相同，那么只打包一次。</td></tr>
<tr><td>Ignore blank images</td><td>完全透明的图片不打包。</td></tr>
<tr><td>Alpha threshold</td><td>移除空白边缘时，Alpha 低于此值的，被视为0。</td></tr>
</table>

## 区域填充（Region padding）

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Padding X/Y</td><td>打包的各图片区域之间的填充像素。某些纹理过滤会平均混合相邻像素，所以推荐区域间填充2个像素以避免相邻的区域互相影响。</td></tr>
<tr><td>Edge padding</td><td>填充也将应用到图片页面的边缘。</td></tr>
<tr><td>Duplicate padding</td><td>拷贝相邻的像素用于填充。如果纹理过滤选择了填充像素，此设置能消除"接缝"瑕疵。</td></tr>
</table>

## 页面（Pages）

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Min width/height</td><td>输出图片的最小页面尺寸。</td></tr>
<tr><td>Max width/height</td><td>输出图片的最大页面尺寸。如果图片大于此值，将分多页输出。</td></tr>
<tr><td>Power of two</td><td>确保输出图片的尺寸大小为 2 的幂。某些游戏开发包有此需求。</td></tr>
<tr><td>Square</td><td>确保输出的图片长宽相等。某些纹理压缩算法有此需求(如： PVRT)。</td></tr>
</table>

## 输出（Output）

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Format</td><td>输出 PNG 或 JPG 图片。</td></tr>
<tr><td>JPG quality</td><td>输出的 JPG 的压缩质量。</td></tr>
<tr><td>Packing</td><td>`Atlas` 打包图片尽可能紧凑的在一起。`Grid` 打包图片均匀的排列在网格中。(众所周知的精灵表spritesheet)。</td></tr>
<tr><td>Premultiply alpha</td><td>将 alpha 与每个 R、G 和 B 通道相乘。推荐在适合的情况下用[proper blending](http://esotericsoftware.com/forum/viewtopic.php?p=15772).</td></tr>
<tr><td>Bleed</td><td>设置透明像素到最近的非透明像素的RGB值。以免在对透明像素进行 RGB 采样时造成纹理过滤的瑕疵[filtering artifacts](http://esotericsoftware.com/forum/viewtopic.php?p=13480#p13480)。</td></tr>
<tr><td>Scale</td><td>为每个比例单独输出完整的 Atlas。</td></tr>
<tr><td>Suffix</td><td>每个缩放比例 Atlas 的后辍。如果留空，不同尺寸将使用相同文件名，分别输出到以尺寸命名的子文件夹中。</td></tr>
</table>

## 选项（Options）

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Atlas extension</td><td> atlas 数据文件的扩展名。</td></tr>
<tr><td>Combine subdirectories</td><td>将当前目录和所有子目录的图片打包在同一张图片上。忽略所有子目录中的设置文件 Pack.json。</td></tr>
<tr><td>Flatten paths</td><td>目录信息将从图片文件名字中移除。图片的文件名必须唯一。</td></tr>
<tr><td>Use indexes</td><td>使用图片名称无需移除任何图片索引后缀(在最后一个下划线之后的任意字符)</td></tr>
<tr><td>Fast</td><td>打包速度更快，但效果不受影响。</td></tr>
<tr><td>Debug</td><td>在输出的页面上，为所有图片区域绘制边框。</td></tr>
</table>

## 运行库（Runtime）

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

<table>
<tr><th>设置</th><th>描述</th></tr>
<tr><td>Filter min/mag</td><td>纹理过滤的缩小和放大设置。</td></tr>
<tr><td>Wrap X/Y</td><td>重复贴图纹理的设置。</td></tr>
<tr><td>Format</td><td>>贴图纹理在内存中使用的格式。</td></tr>
</table>
# 目录结构（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](#Settings)对话框有一个保存JSON `Save JSON` 按钮能保存当前设置。此文件会命名为 `pack.json` 将它放要输入图片的文件夹下就成了此目录的设置文件，用不着手动创建设置文件。


# 九宫格（Ninepatches）

九宫格一般不用于 Spine 骨骼，但有其它的用途。

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

# 图片索引（Image indexes）

图片索引一般不用于 Spine 骨骼，但有其它的用途。

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