mirror of
https://gitee.com/onvia/ccc-tnt-psd2ui
synced 2024-12-26 03:38:24 +00:00
README.md
This commit is contained in:
onvia
parent
1d04792b25
commit
7aeacc0549
52
README.md
52
README.md
@ -6,7 +6,7 @@
|
|||||||
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
||||||
大大提升了预制体制作的效率
|
大大提升了预制体制作的效率
|
||||||
|
|
||||||
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `extensions\psd2ui\test\demo.psd`
|
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `test\demo.psd`
|
||||||
|
|
||||||
支持的 CocosCreator 版本：`2.4.x`、 `3.4.+` ，截止到目前可以支持到 `3.7.x`
|
支持的 CocosCreator 版本：`2.4.x`、 `3.4.+` ，截止到目前可以支持到 `3.7.x`
|
||||||
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
||||||
@ -23,26 +23,12 @@
|
|||||||
|
|
||||||
### 特别注意
|
### 特别注意
|
||||||
工具只适用于新界面的首次导出，如果界面已经开发到一定程度，但是因需求变化，界面结构发生变化，想重新导出，需要谨慎使用。
|
工具只适用于新界面的首次导出，如果界面已经开发到一定程度，但是因需求变化，界面结构发生变化，想重新导出，需要谨慎使用。
|
||||||
如果导出之后缺少某些图片，请确认是否写入了缓存，写入缓存的
|
如果导出之后缺少某些图片，请确认是否写入了缓存，写入缓存的不会重新导出。
|
||||||
如果出现资源丢失的情况，请确认在项目中是否被手动删除了。
|
如果出现资源丢失的情况，请确认在项目中是否被手动删除了。
|
||||||
不建议将输出目录设置为 项目的 `assets` 文件夹下，可能由于编辑器的权限导致不可预期的错误。
|
不建议将输出目录设置为 项目的 `assets` 文件夹下，可能由于编辑器的权限导致不可预期的错误。
|
||||||
|
|
||||||
### PS脚本
|
|
||||||
这里提供了一个图层重命名的 PS 脚本，可以批量对图层进行命名
|
|
||||||
使用方式有两种：
|
|
||||||
1. 将脚本放入 PhotoShop文件夹中的 `\Presets\Scripts` 文件夹下，然后在 `Photoshop左上角-> 文件 -> 脚本-> PS脚本-图层重命名` 就行看到
|
|
||||||
2. 脚本放在任意位置，然后在 `Photoshop左上角-> 文件 -> 脚本-> 浏览` 在打开的选择文件弹窗选择找到我们的脚本
|
|
||||||
|
|
||||||
然后根据需求填入参数就行了
|
#### 界面说明
|
||||||
|
|
||||||
隐藏功能：
|
|
||||||
> 【替换】 选项可以实现批量替换
|
|
||||||
> 例如有5个图层： 头，身体，手臂，手掌，大腿
|
|
||||||
> 则界面上填入
|
|
||||||
> 把：头,身体,手臂,手掌,大腿
|
|
||||||
> 替换为：head,body,arm,palm,thigh
|
|
||||||
|
|
||||||
### 界面说明
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -52,7 +38,7 @@
|
|||||||
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
||||||
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
||||||
|
|
||||||
## 属性
|
### 属性
|
||||||
|
|
||||||
<a href="#Btn"> @Btn | @btn 按钮</a>
|
<a href="#Btn"> @Btn | @btn 按钮</a>
|
||||||
|
|
||||||
@ -282,7 +268,7 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 例如
|
#### 例如
|
||||||
```
|
```
|
||||||
节点名@Btn@size{w:100,h:100}
|
节点名@Btn@size{w:100,h:100}
|
||||||
|
|
||||||
@ -293,13 +279,13 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
## 注意事项
|
## 注意事项
|
||||||
### 美术
|
### 美术
|
||||||
- 智能图层 支持
|
- 智能图层 支持
|
||||||
|
- 蒙版，形状这些图层需要栅格化，或转为智能图层使用
|
||||||
- 图层样式
|
- 图层样式
|
||||||
- 颜色叠加： 文本图层支持，图像图层不支持
|
- 颜色叠加： 文本图层支持，图像图层不支持
|
||||||
- 描边： 文本图层支持
|
- 描边： 文本图层支持
|
||||||
- 其他图层样式不支持
|
- 其他图层样式不支持
|
||||||
|
|
||||||
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
||||||
需要美术将多个碎图组合的图像合并成智能图层或栅格化后使用，除非它们是作为碎图使用
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -336,7 +322,6 @@ cc3.7.x 可以配置为
|
|||||||
"36": 0
|
"36": 0
|
||||||
},
|
},
|
||||||
"textLineHeightOffset": 0
|
"textLineHeightOffset": 0
|
||||||
```
|
|
||||||
|
|
||||||
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
||||||
|
|
||||||
@ -350,3 +335,28 @@ cc3.7.x 可以配置为
|
|||||||
## 已知bug
|
## 已知bug
|
||||||
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
||||||
|
|
||||||
|
|
||||||
|
## PS脚本
|
||||||
|
这里提供了一个图层重命名的 PS 脚本，可以批量对图层进行命名
|
||||||
|
|
||||||
|
使用方式有两种：
|
||||||
|
1. 将脚本放入 PhotoShop文件夹中的 `\Presets\Scripts` 文件夹下，然后在 `Photoshop左上角-> 文件 -> 脚本-> PS脚本-图层重命名` 就行看到
|
||||||
|
2. 脚本放在任意位置，然后在 `Photoshop左上角-> 文件 -> 脚本-> 浏览` 在打开的选择文件弹窗选择找到我们的脚本
|
||||||
|
|
||||||
|
然后根据需求填入参数就行了
|
||||||
|
|
||||||
|
隐藏功能：
|
||||||
|
> 【替换】 选项可以实现批量替换
|
||||||
|
> 例如有5个图层： 头，身体，手臂，手掌，大腿
|
||||||
|
> 则界面上填入
|
||||||
|
> 把：头,身体,手臂,手掌,大腿
|
||||||
|
> 替换为：head,body,arm,palm,thigh
|
||||||
|
|
||||||
|
|
||||||
|
<font size=5 ><b>
|
||||||
|
不要跟我说在 PS 里调整图层！！<br>
|
||||||
|
批量重命名！！<br>
|
||||||
|
强制导出！！<br>
|
||||||
|
一把梭哈！！<br>
|
||||||
|
我只要位置信息！！！<br>
|
||||||
|
</br></font>
|
||||||
|
|||||||
@ -6,13 +6,12 @@
|
|||||||
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
||||||
大大提升了预制体制作的效率
|
大大提升了预制体制作的效率
|
||||||
|
|
||||||
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `extensions\psd2ui\test\demo.psd`
|
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `test\demo.psd`
|
||||||
|
|
||||||
支持的 CocosCreator 版本：`2.4.x`
|
支持的 CocosCreator 版本：`2.4.x`
|
||||||
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 工具特性
|
### 工具特性
|
||||||
相同的图像只会导出一张图片
|
相同的图像只会导出一张图片
|
||||||
如果是相同的图像但是大小不同，则可以使用 `bind` 功能进行绑定，具体使用可以字段说明和示例文件
|
如果是相同的图像但是大小不同，则可以使用 `bind` 功能进行绑定，具体使用可以字段说明和示例文件
|
||||||
@ -22,7 +21,14 @@
|
|||||||
工具在首次使用时会自动执行一次缓存项目所有资源 MD5 值
|
工具在首次使用时会自动执行一次缓存项目所有资源 MD5 值
|
||||||
美术导出的图片 MD5 值可能与本工具导出的图片 MD5 值不一致，所以当出现相同的图片时请考虑这种情况
|
美术导出的图片 MD5 值可能与本工具导出的图片 MD5 值不一致，所以当出现相同的图片时请考虑这种情况
|
||||||
|
|
||||||
### 界面说明
|
### 特别注意
|
||||||
|
工具只适用于新界面的首次导出，如果界面已经开发到一定程度，但是因需求变化，界面结构发生变化，想重新导出，需要谨慎使用。
|
||||||
|
如果导出之后缺少某些图片，请确认是否写入了缓存，写入缓存的不会重新导出。
|
||||||
|
如果出现资源丢失的情况，请确认在项目中是否被手动删除了。
|
||||||
|
不建议将输出目录设置为 项目的 `assets` 文件夹下，可能由于编辑器的权限导致不可预期的错误。
|
||||||
|
|
||||||
|
|
||||||
|
#### 界面说明
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -32,7 +38,7 @@
|
|||||||
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
||||||
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
||||||
|
|
||||||
## 属性
|
### 属性
|
||||||
|
|
||||||
<a href="#Btn"> @Btn | @btn 按钮</a>
|
<a href="#Btn"> @Btn | @btn 按钮</a>
|
||||||
|
|
||||||
@ -262,7 +268,7 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 例如
|
#### 例如
|
||||||
```
|
```
|
||||||
节点名@Btn@size{w:100,h:100}
|
节点名@Btn@size{w:100,h:100}
|
||||||
|
|
||||||
@ -273,13 +279,13 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
## 注意事项
|
## 注意事项
|
||||||
### 美术
|
### 美术
|
||||||
- 智能图层 支持
|
- 智能图层 支持
|
||||||
|
- 蒙版，形状这些图层需要栅格化，或转为智能图层使用
|
||||||
- 图层样式
|
- 图层样式
|
||||||
- 颜色叠加： 文本图层支持，图像图层不支持
|
- 颜色叠加： 文本图层支持，图像图层不支持
|
||||||
- 描边： 文本图层支持
|
- 描边： 文本图层支持
|
||||||
- 其他图层样式不支持
|
- 其他图层样式不支持
|
||||||
|
|
||||||
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
||||||
需要美术将多个碎图组合的图像合并成智能图层或栅格化后使用，除非它们是作为碎图使用
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -316,7 +322,6 @@ cc3.7.x 可以配置为
|
|||||||
"36": 0
|
"36": 0
|
||||||
},
|
},
|
||||||
"textLineHeightOffset": 0
|
"textLineHeightOffset": 0
|
||||||
```
|
|
||||||
|
|
||||||
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
||||||
|
|
||||||
@ -330,3 +335,28 @@ cc3.7.x 可以配置为
|
|||||||
## 已知bug
|
## 已知bug
|
||||||
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
||||||
|
|
||||||
|
|
||||||
|
## PS脚本
|
||||||
|
这里提供了一个图层重命名的 PS 脚本，可以批量对图层进行命名
|
||||||
|
|
||||||
|
使用方式有两种：
|
||||||
|
1. 将脚本放入 PhotoShop文件夹中的 `\Presets\Scripts` 文件夹下，然后在 `Photoshop左上角-> 文件 -> 脚本-> PS脚本-图层重命名` 就行看到
|
||||||
|
2. 脚本放在任意位置，然后在 `Photoshop左上角-> 文件 -> 脚本-> 浏览` 在打开的选择文件弹窗选择找到我们的脚本
|
||||||
|
|
||||||
|
然后根据需求填入参数就行了
|
||||||
|
|
||||||
|
隐藏功能：
|
||||||
|
> 【替换】 选项可以实现批量替换
|
||||||
|
> 例如有5个图层： 头，身体，手臂，手掌，大腿
|
||||||
|
> 则界面上填入
|
||||||
|
> 把：头,身体,手臂,手掌,大腿
|
||||||
|
> 替换为：head,body,arm,palm,thigh
|
||||||
|
|
||||||
|
|
||||||
|
<font size=5 ><b>
|
||||||
|
不要跟我说在 PS 里调整图层！！<br>
|
||||||
|
批量重命名！！<br>
|
||||||
|
强制导出！！<br>
|
||||||
|
一把梭哈！！<br>
|
||||||
|
我只要位置信息！！！<br>
|
||||||
|
</br></font>
|
||||||
|
|||||||
@ -6,13 +6,12 @@
|
|||||||
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
美术同学把效果做好，我们只需要调整一下图层就可以了。
|
||||||
大大提升了预制体制作的效率
|
大大提升了预制体制作的效率
|
||||||
|
|
||||||
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `extensions\psd2ui\test\demo.psd`
|
插件文件夹提供了一个能够正确导出为预制体的的 psd 文件可以作为参考 `test\demo.psd`
|
||||||
|
|
||||||
支持的 CocosCreator 版本：`3.4.+` ，截止到目前可以支持到 `3.7.x`
|
支持的 CocosCreator 版本：`3.4.+` ，截止到目前可以支持到 `3.7.x`
|
||||||
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
如果无法拖放 psd 文件或文件夹，可能是 CocosCreator 的权限不够，尝试使用管理员方式打开 CocosCreator 或者使用 打开文件 功能
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 工具特性
|
### 工具特性
|
||||||
相同的图像只会导出一张图片
|
相同的图像只会导出一张图片
|
||||||
如果是相同的图像但是大小不同，则可以使用 `bind` 功能进行绑定，具体使用可以字段说明和示例文件
|
如果是相同的图像但是大小不同，则可以使用 `bind` 功能进行绑定，具体使用可以字段说明和示例文件
|
||||||
@ -22,7 +21,14 @@
|
|||||||
工具在首次使用时会自动执行一次缓存项目所有资源 MD5 值
|
工具在首次使用时会自动执行一次缓存项目所有资源 MD5 值
|
||||||
美术导出的图片 MD5 值可能与本工具导出的图片 MD5 值不一致，所以当出现相同的图片时请考虑这种情况
|
美术导出的图片 MD5 值可能与本工具导出的图片 MD5 值不一致，所以当出现相同的图片时请考虑这种情况
|
||||||
|
|
||||||
### 界面说明
|
### 特别注意
|
||||||
|
工具只适用于新界面的首次导出，如果界面已经开发到一定程度，但是因需求变化，界面结构发生变化，想重新导出，需要谨慎使用。
|
||||||
|
如果导出之后缺少某些图片，请确认是否写入了缓存，写入缓存的不会重新导出。
|
||||||
|
如果出现资源丢失的情况，请确认在项目中是否被手动删除了。
|
||||||
|
不建议将输出目录设置为 项目的 `assets` 文件夹下，可能由于编辑器的权限导致不可预期的错误。
|
||||||
|
|
||||||
|
|
||||||
|
#### 界面说明
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -32,7 +38,7 @@
|
|||||||
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
4. 输出路径输入框： 可以直接导出到指定路径，如果没有填写，默认为 psd 同级目录
|
||||||
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
5. 红框区域：拖入 psd 文件夹或 psd 文件，也可以点击红框区域使用选择文件功能
|
||||||
|
|
||||||
## 属性
|
### 属性
|
||||||
|
|
||||||
<a href="#Btn"> @Btn | @btn 按钮</a>
|
<a href="#Btn"> @Btn | @btn 按钮</a>
|
||||||
|
|
||||||
@ -262,7 +268,7 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 例如
|
#### 例如
|
||||||
```
|
```
|
||||||
节点名@Btn@size{w:100,h:100}
|
节点名@Btn@size{w:100,h:100}
|
||||||
|
|
||||||
@ -273,13 +279,13 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
## 注意事项
|
## 注意事项
|
||||||
### 美术
|
### 美术
|
||||||
- 智能图层 支持
|
- 智能图层 支持
|
||||||
|
- 蒙版，形状这些图层需要栅格化，或转为智能图层使用
|
||||||
- 图层样式
|
- 图层样式
|
||||||
- 颜色叠加： 文本图层支持，图像图层不支持
|
- 颜色叠加： 文本图层支持，图像图层不支持
|
||||||
- 描边： 文本图层支持
|
- 描边： 文本图层支持
|
||||||
- 其他图层样式不支持
|
- 其他图层样式不支持
|
||||||
|
|
||||||
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
工具会把 画布外的图像也导出成图片，需要美术将 画布外 不需要导出的图像处理掉
|
||||||
需要美术将多个碎图组合的图像合并成智能图层或栅格化后使用，除非它们是作为碎图使用
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -316,7 +322,6 @@ cc3.7.x 可以配置为
|
|||||||
"36": 0
|
"36": 0
|
||||||
},
|
},
|
||||||
"textLineHeightOffset": 0
|
"textLineHeightOffset": 0
|
||||||
```
|
|
||||||
|
|
||||||
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
// textOffsetY: Label节点 Y 偏移，当你使用了定制的字体的时候，可能在 PS 中与 CocosCreator 中表现不一致，可以使用这个参数进行处理，字号为 key，偏移量为值
|
||||||
|
|
||||||
@ -330,3 +335,28 @@ cc3.7.x 可以配置为
|
|||||||
## 已知bug
|
## 已知bug
|
||||||
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
使用 强制导出图片选项时，输入为多个 psd 或含有多个 psd 文件的文件夹时，如果在不同 psd 含有相同 md5 的图像，则会在各自目录下生成相同 uuid 的图片
|
||||||
|
|
||||||
|
|
||||||
|
## PS脚本
|
||||||
|
这里提供了一个图层重命名的 PS 脚本，可以批量对图层进行命名
|
||||||
|
|
||||||
|
使用方式有两种：
|
||||||
|
1. 将脚本放入 PhotoShop文件夹中的 `\Presets\Scripts` 文件夹下，然后在 `Photoshop左上角-> 文件 -> 脚本-> PS脚本-图层重命名` 就行看到
|
||||||
|
2. 脚本放在任意位置，然后在 `Photoshop左上角-> 文件 -> 脚本-> 浏览` 在打开的选择文件弹窗选择找到我们的脚本
|
||||||
|
|
||||||
|
然后根据需求填入参数就行了
|
||||||
|
|
||||||
|
隐藏功能：
|
||||||
|
> 【替换】 选项可以实现批量替换
|
||||||
|
> 例如有5个图层： 头，身体，手臂，手掌，大腿
|
||||||
|
> 则界面上填入
|
||||||
|
> 把：头,身体,手臂,手掌,大腿
|
||||||
|
> 替换为：head,body,arm,palm,thigh
|
||||||
|
|
||||||
|
|
||||||
|
<font size=5 ><b>
|
||||||
|
不要跟我说在 PS 里调整图层！！<br>
|
||||||
|
批量重命名！！<br>
|
||||||
|
强制导出！！<br>
|
||||||
|
一把梭哈！！<br>
|
||||||
|
我只要位置信息！！！<br>
|
||||||
|
</br></font>
|
||||||
|
|||||||
Binary file not shown.
Binary file not shown.
Loading…
Reference in New Issue
Block a user