如何用免费开源工具 free-tex-packer 把 100 张图片打包成 1 张精灵图

【免费下载链接】free-tex-packerFree texture packer项目地址: https://gitcode.com/gh_mirrors/fr/free-tex-packer

深夜加班赶游戏 Demo 的你，正对着资源管理器里一百多张零散的角色帧图发愁：手动拼图集要耗一整晚，用在线工具又担心素材泄露，商业软件动辄几百美元的年费更是劝退。其实，一款完全免费、代码开源的精灵图打包工具 free-tex-packer 就能解决这个难题——它支持自动排列、旋转裁剪、多格式导出，三分钟就能把成堆素材整理成一张规范可用的精灵图。

凌晨两点，他还在手动拼图

做游戏和做网页的人都懂这种痛：小图标、动画帧、UI 切片散落一地，每加载一次都要发好几轮 HTTP 请求。把零散图片拼成一张"精灵图"（Sprite Sheet）是公认的解法，但拼的过程却很折磨人：

• 手工对齐坐标，眼睛都快花掉；
• 图与图之间留白太多，白白浪费画布；
• 排完才发现图集尺寸超标，又要重来；
• 导出格式对不上引擎，还得自己写描述文件。

free-tex-packer 就是冲着这些痛点来的。它把"排版计算、透明裁剪、坐标记录、格式输出"整个流程自动化，你只管把素材丢进去，剩下的交给算法。

一句话概括：它是一个把多张小图自动合成一张大图，并顺手生成配套坐标文件的免费纹理打包工具。

三分钟看懂它能做什么

打开它的能力清单，你会发现它几乎覆盖了精灵图生产的全流程：

这套能力从代码上看也很清晰：排版算法集中在src/client/packers/，导出模板放在src/client/exporters/，而拆分工具则在src/client/splitters/目录下各司其职。

从零到第一张精灵图的完整操作路线

不管你是第一次接触，还是想快速验证效果，照着下面这条路走，几分钟就能看到成果。

第一步：弄到工具

最省事的方式是直接使用在线版本，打开浏览器就能干活。想要完全本地运行，可以克隆仓库自己构建：

git clone https://gitcode.com/gh_mirrors/fr/free-tex-packer

桌面版用户也可以直接下载对应系统的安装包，离线环境下照样流畅使用。

第二步：把素材扔进去

支持拖放操作，你可以把整个图片文件夹拖进窗口，也可以直接拖入 ZIP 压缩包，工具会自动解压并识别常见图片格式。值得一提的是，界面内置了包括简体中文在内的多语言支持，英文不好的同学也能轻松上手。

第三步：按需调参数

打包之前，在设置面板里确认几个关键项：

• 最大图集尺寸：设定输出大图的长宽上限；
• 边距与内边距：控制图片之间的间隔，防止采样时边缘串色；
• 是否启用旋转：开启后算法会旋转部分图片换取更紧凑的排布；
• 是否自动裁剪：去掉图片四周的透明像素，减小最终体积。

第四步：选对导出格式

根据你的目标引擎挑选格式：前端项目选 JSON 或 CSS，Cocos2d 选 plist，Godot 选 tpsheet，Spine 动画则选 atlas。每个格式都有独立配置项，基本能做到"导出即用"。

第五步：生成并下载

点击打包按钮，工具会立刻计算排列方案并预览结果。确认无误后，精灵图 PNG 和对应的坐标描述文件会一起打包给你，直接扔进项目就能跑。

想玩得更深？三个进阶方向

基础流程跑通之后，下面三个能力点值得花时间研究，它们能把工具的价值放大好几倍。

用模板定制自己的导出格式

如果你用的引擎不在预置格式列表里，别急着放弃——工具基于 Mustache 模板引擎构建，支持完全自定义导出格式。模板可以访问三个核心数据对象：rects（每个精灵的位置、尺寸、旋转与裁剪信息）、config（当前图集宽度、高度、缩放等配置）、appInfo（应用名称与版本号）。这意味着任何奇奇怪怪的格式需求，都能通过改模板解决，属于"一次配置，永久复用"的典型。

把成品精灵图拆回单张

修改存量资源时最怕的就是"图集在手，无从下手"。工具提供的拆分器（位于src/client/splitters/）能识别多种主流图集格式，把成品大图按坐标还原成独立小图，改完再重新打包，整个流程闭环。

把打包接进自动化流水线

如果你的项目已经上了构建流程，可以试试官方配套的 Gulp、Grunt、Webpack 插件，把打包动作写进脚本里，每次构建自动执行，彻底告别手动操作。配合 TinyPNG 压缩和批量 ZIP 导入，大型项目的资源管理会轻松很多。

新手最容易踩的四个坑

坑一：开着旋转导出，动画坐标乱了

旋转优化确实能省空间，但部分引擎或帧动画对旋转支持不友好。如果你的动画角色出现了奇怪的翻转，先检查导出设置，把旋转关掉重打一次。

坑二：忘开裁剪，图集莫名变大

很多美术素材四周带着一圈透明像素，不裁剪的话图集会白白胖一圈。记得在设置里勾选自动裁剪，能明显缩小输出体积。

坑三：格式选错，引擎不认账

JSON 和 JSON 之间也有区别：Phaser 3 用带 pivot 的 hash 格式，Pixi.js 用独立模板，Unity 和 UIKit 的 plist 结构也完全不同。导出前先对照引擎文档，选对模板，能省掉半天排错时间。

坑四：素材太多，单张图集放不下

当素材总量超出你设定的最大图集尺寸时，记得开启多图集打包。工具会自动把素材拆分到多张图集中分别输出，避免硬塞导致排列失败。

现在就动手：把精灵图打包变成日常习惯

精灵图打包不是大项目的专属需求，一个 2D 小游戏、一个营销活动页、甚至一套图标库都能用上。与其每次手工拼图，不如花几分钟把这套免费流程跑起来，一劳永逸。

想立刻开始？在本地执行：

git clone https://gitcode.com/gh_mirrors/fr/free-tex-packer

然后把你的素材文件夹拖进界面，选好格式点一下打包——第一张精灵图就会出现在你面前。剩下的，就交给算法和时间吧。

【免费下载链接】free-tex-packerFree texture packer项目地址: https://gitcode.com/gh_mirrors/fr/free-tex-packer