游戏开发之Photoshop导出所有图层信息

引言

相信很多游戏开发者，不管是程序、策划、美术都遇到过这样一个问题：程序员通过手拼接出来的UI界面效果往往达不到美术和策划的要求。导致游戏版本不能够如期正常交付。接下来我们跟随亿元程序员一起探讨一下如何优化这一个问题。

问题是如何产生的？

首先我们清楚，游戏开发在一个团队里，往往是多部门多人协作完成。主要包括以下步骤：

1.需求分析和规划

2.美术设计和素材准备

3.编程和开发

4.测试和调试

5.发布和上线

6.运营和持续更新

7.客户支持和反馈处理

往往我们的问题产生于美术设计和编程开发之间，美术设计的素材通过审核之后，会把素材和效果图提供到程序，程序再按照美术效果图一比一手工拼接。但是由于拼接界面是一个非常精细的活，稍有不慎就会导致素材之间有一定的偏差，从而导致UI整体效果达不到预期的效果，从而造成返工。

如何避免这个问题

通常我们要避免程序拼接效果达不到预期的问题，需要非常规范化的协作流程：

1.与美术进行清晰明确的沟通，确保理解并达成一致的设计目标。

2.在UI拼接前，与美术一起审查效果图，并将不一致的地方进行标注和记录。

3.确保程序员和美术之间有良好的协作和沟通，及时解决和调整不一致的地方。

4.在实际拼接过程中，尽可能使用可视化工具或编辑器，以便直观地展示实际效果。

5.进行多次迭代和测试，及时修复和调整不一致的问题。

6.定期召开项目评审会议，让所有相关人员共同审查和确认最终效果。

7.若出现无法解决的问题，寻求专业人士的帮助或寻找合适的替代方案。

只要我们规范化地遵守上述流程，我们就能大概率避免产生这个问题。

构思

有没有一种可能，程序在拿到美术素材的时候，界面已经是拼接完成的状态，程序只需要编写相应的代码绑定相关的素材以及游戏逻辑就可以完成游戏功能的开发？

答案是有的。其实美术在设计素材完成和审核的时候，效果往往就已经达到了最优的状态。这个时候只要原封不动地将素材给到程序即可。

Photoshop导出所有图层信息

游戏素材在PS里面一般是以不同的图层形式存在，设计完成后，会把所有图层导出成PNG。正常导出的话，我们游戏素材的位置摆放信息不会保存下来。因此我们要解决的问题就是如何把图层的重要信息导出来。

经过研究，Photoshop 通过脚本支持外部自动化。什么意思呢？就是说Photoshop 能够执行我们自定义的脚本，从而去解决我们的需求。我们可以利用 JavaScript 支持编写可以在 Windows 或 macOS 上运行的 Photoshop 脚本。

通过文档的查阅，我们了解到要导出所有图层信息，要用到以下几个API：

1. 获取当前文档中的所有图层：

   var layers = app.activeDocument.layers;
   

2. 获取指定图层的名称、类型、可见性等属性：

   var layer = app.activeDocument.layers[0];
   var name = layer.name;
   var type = layer.kind;
   var visible = layer.visible;
   

3. 获取图层的像素数据: