mirror of
https://gitee.com/onvia/ccc-tnt-psd2ui
synced 2024-12-26 03:38:24 +00:00
移除 @scale @size,调整为自动计算 scale
This commit is contained in:
parent
6e294f7a19
commit
8d35d76c7a
73
README.md
73
README.md
@ -55,12 +55,8 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#ar"> @ar 锚点</a>
|
<a href="#ar"> @ar 锚点</a>
|
||||||
|
|
||||||
<a href="#size"> @size 尺寸</a>
|
|
||||||
|
|
||||||
<a href="#full"> @full 全屏</a>
|
<a href="#full"> @full 全屏</a>
|
||||||
|
|
||||||
<a href="#scale"> @scale 缩放</a>
|
|
||||||
|
|
||||||
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
||||||
|
|
||||||
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
||||||
@ -75,6 +71,11 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
||||||
|
|
||||||
|
### 移除
|
||||||
|
~~<a href="#size"> @size 尺寸</a>~~
|
||||||
|
|
||||||
|
~~<a href="#scale"> @scale 缩放</a>~~
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 组件
|
### 组件
|
||||||
@ -143,20 +144,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="size"></a>
|
|
||||||
```
|
|
||||||
@size{w:100,h:100}
|
|
||||||
|
|
||||||
节点尺寸 非图片尺寸
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
w?: 宽
|
|
||||||
h?: 高
|
|
||||||
只对填写的参数生效,未填写的则为计算到的值
|
|
||||||
无参数不生效
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="full"></a>
|
<a id="full"></a>
|
||||||
```
|
```
|
||||||
@ -167,20 +155,6 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="scale"></a>
|
|
||||||
```
|
|
||||||
@scale{x:1,y:1}
|
|
||||||
|
|
||||||
节点缩放
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
x?: x 方向
|
|
||||||
y?: y 方向
|
|
||||||
只对填写的参数生效,未填写的则为 1
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="ignore"></a>
|
<a id="ignore"></a>
|
||||||
```
|
```
|
||||||
@ignore
|
@ignore
|
||||||
@ -210,7 +184,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
<a id="img"></a>
|
<a id="img"></a>
|
||||||
```
|
```
|
||||||
@img{name: string,id: 0,bind: 0}
|
@img{name:string,id:number,bind:number}
|
||||||
|
|
||||||
定制图片
|
定制图片
|
||||||
作用图层:图像图层
|
作用图层:图像图层
|
||||||
@ -266,10 +240,45 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
@flipY 的图层不会导出图像
|
@flipY 的图层不会导出图像
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
### 移除
|
||||||
|
<a id="size"></a>
|
||||||
|
```
|
||||||
|
@size{w:100,h:100}
|
||||||
|
|
||||||
|
节点尺寸 非图片尺寸
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
w?: 宽
|
||||||
|
h?: 高
|
||||||
|
只对填写的参数生效,未填写的则为计算到的值
|
||||||
|
无参数不生效
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
<a id="scale"></a>
|
||||||
|
```
|
||||||
|
@scale{x:1,y:1}
|
||||||
|
|
||||||
|
节点缩放
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
x?: x 方向
|
||||||
|
y?: y 方向
|
||||||
|
只对填写的参数生效,未填写的则为 1
|
||||||
|
|
||||||
|
```
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
### 说明
|
### 说明
|
||||||
多个字段可作用在同一个图层上,按需使用
|
多个字段可作用在同一个图层上,按需使用
|
||||||
|
为做到所见所得,移除手动设置 @size 和 @scale,修改为自动计算,使用方式为 `@img{bind:目标id}` `@flipX{bind:目标id}` `@flipY{bind:目标id}`
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@ -39,8 +39,9 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
1. 缓存资源按钮: 手动缓存资源MD5,当你不确定资源是否完全缓存的时候可以执行
|
1. 缓存资源按钮: 手动缓存资源MD5,当你不确定资源是否完全缓存的时候可以执行
|
||||||
2. 强制导出图片选项: 勾选后,即使已经进行缓存的资源同样会导出图片
|
2. 强制导出图片选项: 勾选后,即使已经进行缓存的资源同样会导出图片
|
||||||
3. 只导出图片选项: 可以把此工具只当做是切图工具,同时会将文本图层的字号及颜色输出到文件
|
3. 只导出图片选项: 可以把此工具只当做是切图工具,同时会将文本图层的字号及颜色输出到文件
|
||||||
4. 输出路径输入框: 可以直接导出到指定路径,如果没有填写,默认为 psd 同级目录
|
4. 中文转拼音:最终导出无论是图片名还是节点名如果包含中文,都会转成拼音。
|
||||||
5. 红框区域:拖入 psd 文件夹或 psd 文件,也可以点击红框区域使用选择文件功能
|
5. 输出路径输入框: 可以直接导出到指定路径,如果没有填写,默认为 psd 同级目录
|
||||||
|
6. 红框区域:拖入 psd 文件夹或 psd 文件,也可以点击红框区域使用选择文件功能
|
||||||
|
|
||||||
### 属性
|
### 属性
|
||||||
|
|
||||||
@ -54,12 +55,8 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#ar"> @ar 锚点</a>
|
<a href="#ar"> @ar 锚点</a>
|
||||||
|
|
||||||
<a href="#size"> @size 尺寸</a>
|
|
||||||
|
|
||||||
<a href="#full"> @full 全屏</a>
|
<a href="#full"> @full 全屏</a>
|
||||||
|
|
||||||
<a href="#scale"> @scale 缩放</a>
|
|
||||||
|
|
||||||
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
||||||
|
|
||||||
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
||||||
@ -74,6 +71,11 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
||||||
|
|
||||||
|
### 移除
|
||||||
|
~~<a href="#size"> @size 尺寸</a>~~
|
||||||
|
|
||||||
|
~~<a href="#scale"> @scale 缩放</a>~~
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 组件
|
### 组件
|
||||||
@ -142,20 +144,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="size"></a>
|
|
||||||
```
|
|
||||||
@size{w:100,h:100}
|
|
||||||
|
|
||||||
节点尺寸 非图片尺寸
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
w?: 宽
|
|
||||||
h?: 高
|
|
||||||
只对填写的参数生效,未填写的则为计算到的值
|
|
||||||
无参数不生效
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="full"></a>
|
<a id="full"></a>
|
||||||
```
|
```
|
||||||
@ -166,20 +155,6 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="scale"></a>
|
|
||||||
```
|
|
||||||
@scale{x:1,y:1}
|
|
||||||
|
|
||||||
节点缩放
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
x?: x 方向
|
|
||||||
y?: y 方向
|
|
||||||
只对填写的参数生效,未填写的则为 1
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="ignore"></a>
|
<a id="ignore"></a>
|
||||||
```
|
```
|
||||||
@ignore
|
@ignore
|
||||||
@ -209,7 +184,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
<a id="img"></a>
|
<a id="img"></a>
|
||||||
```
|
```
|
||||||
@img{name: string,id: 0,bind: 0}
|
@img{name:string,id:number,bind:number}
|
||||||
|
|
||||||
定制图片
|
定制图片
|
||||||
作用图层:图像图层
|
作用图层:图像图层
|
||||||
@ -265,10 +240,45 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
@flipY 的图层不会导出图像
|
@flipY 的图层不会导出图像
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
### 移除
|
||||||
|
<a id="size"></a>
|
||||||
|
```
|
||||||
|
@size{w:100,h:100}
|
||||||
|
|
||||||
|
节点尺寸 非图片尺寸
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
w?: 宽
|
||||||
|
h?: 高
|
||||||
|
只对填写的参数生效,未填写的则为计算到的值
|
||||||
|
无参数不生效
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
<a id="scale"></a>
|
||||||
|
```
|
||||||
|
@scale{x:1,y:1}
|
||||||
|
|
||||||
|
节点缩放
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
x?: x 方向
|
||||||
|
y?: y 方向
|
||||||
|
只对填写的参数生效,未填写的则为 1
|
||||||
|
|
||||||
|
```
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
### 说明
|
### 说明
|
||||||
多个字段可作用在同一个图层上,按需使用
|
多个字段可作用在同一个图层上,按需使用
|
||||||
|
为做到所见所得,移除手动设置 @size 和 @scale,修改为自动计算,使用方式为 `@img{bind:目标id}` `@flipX{bind:目标id}` `@flipY{bind:目标id}`
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
File diff suppressed because one or more lines are too long
Binary file not shown.
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 16 KiB |
Binary file not shown.
@ -39,8 +39,9 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
1. 缓存资源按钮: 手动缓存资源MD5,当你不确定资源是否完全缓存的时候可以执行
|
1. 缓存资源按钮: 手动缓存资源MD5,当你不确定资源是否完全缓存的时候可以执行
|
||||||
2. 强制导出图片选项: 勾选后,即使已经进行缓存的资源同样会导出图片
|
2. 强制导出图片选项: 勾选后,即使已经进行缓存的资源同样会导出图片
|
||||||
3. 只导出图片选项: 可以把此工具只当做是切图工具,同时会将文本图层的字号及颜色输出到文件
|
3. 只导出图片选项: 可以把此工具只当做是切图工具,同时会将文本图层的字号及颜色输出到文件
|
||||||
4. 输出路径输入框: 可以直接导出到指定路径,如果没有填写,默认为 psd 同级目录
|
4. 中文转拼音:最终导出无论是图片名还是节点名如果包含中文,都会转成拼音。
|
||||||
5. 红框区域:拖入 psd 文件夹或 psd 文件,也可以点击红框区域使用选择文件功能
|
5. 输出路径输入框: 可以直接导出到指定路径,如果没有填写,默认为 psd 同级目录
|
||||||
|
6. 红框区域:拖入 psd 文件夹或 psd 文件,也可以点击红框区域使用选择文件功能
|
||||||
|
|
||||||
### 属性
|
### 属性
|
||||||
|
|
||||||
@ -54,12 +55,8 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#ar"> @ar 锚点</a>
|
<a href="#ar"> @ar 锚点</a>
|
||||||
|
|
||||||
<a href="#size"> @size 尺寸</a>
|
|
||||||
|
|
||||||
<a href="#full"> @full 全屏</a>
|
<a href="#full"> @full 全屏</a>
|
||||||
|
|
||||||
<a href="#scale"> @scale 缩放</a>
|
|
||||||
|
|
||||||
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
||||||
|
|
||||||
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
||||||
@ -74,6 +71,11 @@ Mac 下首次使用需要先执行根目录下的 `install_depends.sh` 安装 `c
|
|||||||
|
|
||||||
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
||||||
|
|
||||||
|
### 移除
|
||||||
|
~~<a href="#size"> @size 尺寸</a>~~
|
||||||
|
|
||||||
|
~~<a href="#scale"> @scale 缩放</a>~~
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 组件
|
### 组件
|
||||||
@ -142,20 +144,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="size"></a>
|
|
||||||
```
|
|
||||||
@size{w:100,h:100}
|
|
||||||
|
|
||||||
节点尺寸 非图片尺寸
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
w?: 宽
|
|
||||||
h?: 高
|
|
||||||
只对填写的参数生效,未填写的则为计算到的值
|
|
||||||
无参数不生效
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="full"></a>
|
<a id="full"></a>
|
||||||
```
|
```
|
||||||
@ -166,20 +155,6 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="scale"></a>
|
|
||||||
```
|
|
||||||
@scale{x:1,y:1}
|
|
||||||
|
|
||||||
节点缩放
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
x?: x 方向
|
|
||||||
y?: y 方向
|
|
||||||
只对填写的参数生效,未填写的则为 1
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="ignore"></a>
|
<a id="ignore"></a>
|
||||||
```
|
```
|
||||||
@ignore
|
@ignore
|
||||||
@ -209,7 +184,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
<a id="img"></a>
|
<a id="img"></a>
|
||||||
```
|
```
|
||||||
@img{name: string,id: 0,bind: 0}
|
@img{name:string,id:number,bind:number}
|
||||||
|
|
||||||
定制图片
|
定制图片
|
||||||
作用图层:图像图层
|
作用图层:图像图层
|
||||||
@ -265,10 +240,45 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
@flipY 的图层不会导出图像
|
@flipY 的图层不会导出图像
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
### 移除
|
||||||
|
<a id="size"></a>
|
||||||
|
```
|
||||||
|
@size{w:100,h:100}
|
||||||
|
|
||||||
|
节点尺寸 非图片尺寸
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
w?: 宽
|
||||||
|
h?: 高
|
||||||
|
只对填写的参数生效,未填写的则为计算到的值
|
||||||
|
无参数不生效
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
<a id="scale"></a>
|
||||||
|
```
|
||||||
|
@scale{x:1,y:1}
|
||||||
|
|
||||||
|
节点缩放
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
x?: x 方向
|
||||||
|
y?: y 方向
|
||||||
|
只对填写的参数生效,未填写的则为 1
|
||||||
|
|
||||||
|
```
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
### 说明
|
### 说明
|
||||||
多个字段可作用在同一个图层上,按需使用
|
多个字段可作用在同一个图层上,按需使用
|
||||||
|
为做到所见所得,移除手动设置 @size 和 @scale,修改为自动计算,使用方式为 `@img{bind:目标id}` `@flipX{bind:目标id}` `@flipY{bind:目标id}`
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
File diff suppressed because one or more lines are too long
Binary file not shown.
Before Width: | Height: | Size: 16 KiB After Width: | Height: | Size: 17 KiB |
Binary file not shown.
@ -10,12 +10,8 @@
|
|||||||
|
|
||||||
<a href="#ar"> @ar 锚点</a>
|
<a href="#ar"> @ar 锚点</a>
|
||||||
|
|
||||||
<a href="#size"> @size 尺寸</a>
|
|
||||||
|
|
||||||
<a href="#full"> @full 全屏</a>
|
<a href="#full"> @full 全屏</a>
|
||||||
|
|
||||||
<a href="#scale"> @scale 缩放</a>
|
|
||||||
|
|
||||||
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
<a href="#ignore"> @ignore | @ig 忽略导出图片和节点</a>
|
||||||
|
|
||||||
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
<a href="#ignorenode"> @ignorenode | @ignode 忽略导出节点</a>
|
||||||
@ -30,6 +26,11 @@
|
|||||||
|
|
||||||
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
<a href="#flipY"> @flipY 翻转图像 (flip 变种)</a>
|
||||||
|
|
||||||
|
### 移除
|
||||||
|
~~<a href="#size"> @size 尺寸</a>~~
|
||||||
|
|
||||||
|
~~<a href="#scale"> @scale 缩放</a>~~
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 组件
|
### 组件
|
||||||
@ -98,20 +99,7 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="size"></a>
|
|
||||||
```
|
|
||||||
@size{w:100,h:100}
|
|
||||||
|
|
||||||
节点尺寸 非图片尺寸
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
w?: 宽
|
|
||||||
h?: 高
|
|
||||||
只对填写的参数生效,未填写的则为计算到的值
|
|
||||||
无参数不生效
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="full"></a>
|
<a id="full"></a>
|
||||||
```
|
```
|
||||||
@ -122,20 +110,6 @@ check 为 Toggle 的属性,类型为 Sprite
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
<a id="scale"></a>
|
|
||||||
```
|
|
||||||
@scale{x:1,y:1}
|
|
||||||
|
|
||||||
节点缩放
|
|
||||||
作用图层: 所有图层
|
|
||||||
|
|
||||||
参数:
|
|
||||||
x?: x 方向
|
|
||||||
y?: y 方向
|
|
||||||
只对填写的参数生效,未填写的则为 1
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
<a id="ignore"></a>
|
<a id="ignore"></a>
|
||||||
```
|
```
|
||||||
@ignore
|
@ignore
|
||||||
@ -221,10 +195,45 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
@flipY 的图层不会导出图像
|
@flipY 的图层不会导出图像
|
||||||
```
|
```
|
||||||
|
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
### 移除
|
||||||
|
<a id="size"></a>
|
||||||
|
```
|
||||||
|
@size{w:100,h:100}
|
||||||
|
|
||||||
|
节点尺寸 非图片尺寸
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
w?: 宽
|
||||||
|
h?: 高
|
||||||
|
只对填写的参数生效,未填写的则为计算到的值
|
||||||
|
无参数不生效
|
||||||
|
|
||||||
|
```
|
||||||
|
|
||||||
|
<a id="scale"></a>
|
||||||
|
```
|
||||||
|
@scale{x:1,y:1}
|
||||||
|
|
||||||
|
节点缩放
|
||||||
|
作用图层: 所有图层
|
||||||
|
|
||||||
|
参数:
|
||||||
|
x?: x 方向
|
||||||
|
y?: y 方向
|
||||||
|
只对填写的参数生效,未填写的则为 1
|
||||||
|
|
||||||
|
```
|
||||||
|
---
|
||||||
|
---
|
||||||
|
---
|
||||||
|
|
||||||
### 说明
|
### 说明
|
||||||
多个字段可作用在同一个图层上,按需使用
|
多个字段可作用在同一个图层上,按需使用
|
||||||
|
为做到所见所得,移除手动设置 @size 和 @scale,修改为自动计算,使用方式为 `@img{bind:目标id}` `@flipX{bind:目标id}` `@flipY{bind:目标id}`
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -236,15 +245,16 @@ flip 的变种 y 方向镜像图像vv
|
|||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
## 注意事项
|
||||||
### 美术
|
### 美术
|
||||||
- 智能图层 支持
|
- 智能图层 支持
|
||||||
|
- 蒙版,形状这些图层需要栅格化,或转为智能图层使用
|
||||||
- 图层样式
|
- 图层样式
|
||||||
- 颜色叠加 图层图层不支持,文本图层支持
|
- 颜色叠加: 文本图层支持,图像图层不支持
|
||||||
- 描边 文本图层支持
|
- 描边: 文本图层支持
|
||||||
|
- 其他图层样式不支持
|
||||||
|
|
||||||
工具会把 画布外的图像也导出成图片,需要美术将 画布外 不需要导出的图像处理掉
|
工具会把 画布外的图像也导出成图片,需要美术将 画布外 不需要导出的图像处理掉
|
||||||
需要美术将多个碎图组合的图像合并成智能图层使用
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -294,3 +304,4 @@ textOffsetY label节点 Y 偏移
|
|||||||
- 使用 @flip 替换 @mirror
|
- 使用 @flip 替换 @mirror
|
||||||
- @img 增加 {id, bind} 参数
|
- @img 增加 {id, bind} 参数
|
||||||
- 增加 @scale
|
- 增加 @scale
|
||||||
|
- 移除 @scale @size
|
||||||
|
2696
psd2ui-tools/dist/index.js
vendored
2696
psd2ui-tools/dist/index.js
vendored
File diff suppressed because one or more lines are too long
@ -7,14 +7,9 @@
|
|||||||
"build": "tsc -b",
|
"build": "tsc -b",
|
||||||
"watch": "tsc -w",
|
"watch": "tsc -w",
|
||||||
"rollup": "rollup -c",
|
"rollup": "rollup -c",
|
||||||
"test": "node dist/index.js --input ./test/normal-test.psd --cache-remake --output ./out/",
|
"test": "ts-node src/index.ts --force-img --input ./test/scale-demo.psd --project-assets ./out/ --cache ./cache/cache.json --output ./out/",
|
||||||
"help": "node dist/index.js --h",
|
"help": "node dist/index.js --h",
|
||||||
"test-dir": "node dist/index.js --input E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\test --output E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\out --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
"test-init": "node dist/index.js --init --project-assets ./out/ --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
||||||
"test-psd": "node dist/index.js --input E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\test\\normal-test.psd --output E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\out --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
|
||||||
"test-cache": "node dist/index.js --input E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\test\\normal-test.psd --output E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\out --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json --project-assets E:\\Demo\\CC249JSTest\\assets --cache-remake",
|
|
||||||
"test-dir-no-output": "node dist/index.js --input E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\test --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
|
||||||
"test-psd-no-output": "node dist/index.js --input E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\test\\normal-test.psd --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
|
||||||
"test-init": "node dist/index.js --init --project-assets E:\\Demo\\CC249JSTest\\assets --cache E:\\Git\\ccc-framework-3d\\tools\\psd2ui\\cache\\cache.json",
|
|
||||||
"test-png9": "ts-node src/index.ts --engine-version v342 --pinyin --input ./test/png9.psd --output ./out/",
|
"test-png9": "ts-node src/index.ts --engine-version v342 --pinyin --input ./test/png9.psd --output ./out/",
|
||||||
"test-png9-2": "node dist/index.js --engine-version v342 --pinyin --input ./test/png9.psd --output ./out/"
|
"test-png9-2": "node dist/index.js --engine-version v342 --pinyin --input ./test/png9.psd --output ./out/"
|
||||||
},
|
},
|
||||||
|
@ -23,6 +23,6 @@ module.exports = {
|
|||||||
json(),
|
json(),
|
||||||
// resolve(),
|
// resolve(),
|
||||||
commonjs(),
|
commonjs(),
|
||||||
terser()
|
// terser()
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
@ -31,6 +31,7 @@ import { exportImageMgr } from './ExportImageMgr';
|
|||||||
import { CCUIOpacity } from './engine/cc/CCUIOpacity';
|
import { CCUIOpacity } from './engine/cc/CCUIOpacity';
|
||||||
import { CCUITransform } from './engine/cc/CCUITransform';
|
import { CCUITransform } from './engine/cc/CCUITransform';
|
||||||
import { CCVec3 } from './engine/cc/values/CCVec3';
|
import { CCVec3 } from './engine/cc/values/CCVec3';
|
||||||
|
import { Vec3 } from './values/Vec3';
|
||||||
|
|
||||||
|
|
||||||
/***
|
/***
|
||||||
@ -124,7 +125,7 @@ export class Main {
|
|||||||
|
|
||||||
// 创建缓存文件
|
// 创建缓存文件
|
||||||
if (args.cache && !fs.existsSync(args.cache)) {
|
if (args.cache && !fs.existsSync(args.cache)) {
|
||||||
writeCache();
|
await writeCache();
|
||||||
}
|
}
|
||||||
|
|
||||||
// 在没有缓存文件或者 指定重新缓存的时候,读取项目资源
|
// 在没有缓存文件或者 指定重新缓存的时候,读取项目资源
|
||||||
@ -278,16 +279,15 @@ export class Main {
|
|||||||
|
|
||||||
// 劫持尺寸设置,使用 psd 中配置的尺寸,这里不对原数据进行修改
|
// 劫持尺寸设置,使用 psd 中配置的尺寸,这里不对原数据进行修改
|
||||||
let size = new CCSize(layer.size.width, layer.size.height);
|
let size = new CCSize(layer.size.width, layer.size.height);
|
||||||
if (layer.attr?.comps.size) {
|
// if (layer.attr?.comps.size) {
|
||||||
let _attrSize = layer.attr.comps.size;
|
// let _attrSize = layer.attr.comps.size;
|
||||||
size.width = _attrSize.w ?? size.width;
|
// size.width = _attrSize.w ?? size.width;
|
||||||
size.height = _attrSize.h ?? size.height;
|
// size.height = _attrSize.h ?? size.height;
|
||||||
|
// }
|
||||||
|
|
||||||
}
|
// // 对缩放进行处理
|
||||||
|
// size.width = Math.round(Math.abs(size.width / layer.scale.x));
|
||||||
// 对缩放进行处理
|
// size.height = Math.round(Math.abs(size.height / layer.scale.y));
|
||||||
size.width = Math.round(Math.abs(size.width / layer.scale.x));
|
|
||||||
size.height = Math.round(Math.abs(size.height / layer.scale.y));
|
|
||||||
|
|
||||||
// 配置的位置 Y 偏移
|
// 配置的位置 Y 偏移
|
||||||
let offsetY = 0;
|
let offsetY = 0;
|
||||||
@ -342,6 +342,18 @@ export class Main {
|
|||||||
} else {
|
} else {
|
||||||
// 查找绑定的图像
|
// 查找绑定的图像
|
||||||
let _layer = imageMgr.getSerialNumberImage(layer);
|
let _layer = imageMgr.getSerialNumberImage(layer);
|
||||||
|
|
||||||
|
|
||||||
|
// 根据原始图片自动计算缩放
|
||||||
|
let scaleX = layer.textureSize.width / _layer.textureSize.width;
|
||||||
|
let scaleY = layer.textureSize.height / _layer.textureSize.height;
|
||||||
|
if (scaleX != 1 || scaleY != 1) {
|
||||||
|
layer.scale = new Vec3((layer.isFlipX() ? -1 : 1) * scaleX, (layer.isFlipY() ? -1 : 1) * scaleY, 1);
|
||||||
|
node._trs.setScale(layer.scale.x, layer.scale.y, layer.scale.z);
|
||||||
|
node._lscale = new CCVec3(layer.scale.x, layer.scale.y, layer.scale.z);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// 使用已缓存的 图片 的 uuid
|
// 使用已缓存的 图片 的 uuid
|
||||||
let imageWarp = imageCacheMgr.get(_layer.md5);
|
let imageWarp = imageCacheMgr.get(_layer.md5);
|
||||||
sprite.setSpriteFrame(imageWarp ? imageWarp.textureUuid : _layer.textureUuid);
|
sprite.setSpriteFrame(imageWarp ? imageWarp.textureUuid : _layer.textureUuid);
|
||||||
@ -417,14 +429,14 @@ export class Main {
|
|||||||
}
|
}
|
||||||
console.log(`保存图片 [${_layer.imgName}] md5: ${_layer.md5}`);
|
console.log(`保存图片 [${_layer.imgName}] md5: ${_layer.md5}`);
|
||||||
imageWarp && (imageWarp.isOutput = true);
|
imageWarp && (imageWarp.isOutput = true);
|
||||||
let fullpath = path.join(out, `${_layer.imgName}.png`);
|
let fullPath = path.join(out, `${_layer.imgName}.png`);
|
||||||
fs.writeFileSync(fullpath, _layer.imgBuffer);
|
fs.writeFileSync(fullPath, _layer.imgBuffer);
|
||||||
this.saveImageMeta(_layer, fullpath);
|
this.saveImageMeta(_layer, fullPath);
|
||||||
});
|
});
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
saveImageMeta(layer: PsdImage, fullpath: string) {
|
saveImageMeta(layer: PsdImage, fullPath: string) {
|
||||||
let _layer = imageMgr.getSerialNumberImage(layer);
|
let _layer = imageMgr.getSerialNumberImage(layer);
|
||||||
let imageWarp = imageCacheMgr.get(_layer.md5);
|
let imageWarp = imageCacheMgr.get(_layer.md5);
|
||||||
if (!imageWarp) {
|
if (!imageWarp) {
|
||||||
@ -448,7 +460,7 @@ export class Main {
|
|||||||
meta = meta.replace(/\$BORDER_LEFT/g, s9.l as any);
|
meta = meta.replace(/\$BORDER_LEFT/g, s9.l as any);
|
||||||
meta = meta.replace(/\$BORDER_RIGHT/g, s9.r as any);
|
meta = meta.replace(/\$BORDER_RIGHT/g, s9.r as any);
|
||||||
|
|
||||||
fs.writeFileSync(fullpath + `.meta`, meta);
|
fs.writeFileSync(fullPath + `.meta`, meta);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@ -42,7 +42,7 @@ export class PsdImage extends PsdLayer {
|
|||||||
this.md5 = fileUtils.getMD5(this.imgBuffer);
|
this.md5 = fileUtils.getMD5(this.imgBuffer);
|
||||||
|
|
||||||
this.textureSize = new Size(canvas.width, canvas.height);
|
this.textureSize = new Size(canvas.width, canvas.height);
|
||||||
this.scale = new Vec3((this.isFilpX() ? -1 : 1) * this.scale.x, (this.isFilpY() ? -1 : 1) * this.scale.y, 1);
|
this.scale = new Vec3((this.isFlipX() ? -1 : 1) * this.scale.x, (this.isFlipY() ? -1 : 1) * this.scale.y, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
onCtor() {
|
onCtor() {
|
||||||
@ -64,12 +64,12 @@ export class PsdImage extends PsdLayer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/** 是否是 x 方向镜像图片 */
|
/** 是否是 x 方向镜像图片 */
|
||||||
isFilpX() {
|
isFlipX() {
|
||||||
return typeof this.attr.comps.flipX?.bind !== 'undefined';
|
return typeof this.attr.comps.flipX?.bind !== 'undefined';
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 是否是 y 方向镜像图片 */
|
/** 是否是 y 方向镜像图片 */
|
||||||
isFilpY() {
|
isFlipY() {
|
||||||
return typeof this.attr.comps.flipY?.bind !== 'undefined';
|
return typeof this.attr.comps.flipY?.bind !== 'undefined';
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -89,8 +89,8 @@ export class PsdImage extends PsdLayer {
|
|||||||
// this.position.x = this.position.x - this.parent.size.width * this.parent.anchorPoint.x + this.size.width * this.anchorPoint.x;
|
// this.position.x = this.position.x - this.parent.size.width * this.parent.anchorPoint.x + this.size.width * this.anchorPoint.x;
|
||||||
// this.position.y = this.position.y - this.parent.size.height * this.parent.anchorPoint.y + this.size.height * this.anchorPoint.y;
|
// this.position.y = this.position.y - this.parent.size.height * this.parent.anchorPoint.y + this.size.height * this.anchorPoint.y;
|
||||||
// 如果是镜像图片,则特殊处理
|
// 如果是镜像图片,则特殊处理
|
||||||
let arX = (this.isFilpX() ? (1 - this.anchorPoint.x) : this.anchorPoint.x);
|
let arX = (this.isFlipX() ? (1 - this.anchorPoint.x) : this.anchorPoint.x);
|
||||||
let arY = (this.isFilpY() ? (1 - this.anchorPoint.y) : this.anchorPoint.y);
|
let arY = (this.isFlipY() ? (1 - this.anchorPoint.y) : this.anchorPoint.y);
|
||||||
this.position.x = this.position.x - this.rootDoc.size.width * this.rootDoc.anchorPoint.x + this.size.width * arX;
|
this.position.x = this.position.x - this.rootDoc.size.width * this.rootDoc.anchorPoint.x + this.size.width * arX;
|
||||||
this.position.y = this.position.y - this.rootDoc.size.height * this.rootDoc.anchorPoint.y + this.size.height * arY;
|
this.position.y = this.position.y - this.rootDoc.size.height * this.rootDoc.anchorPoint.y + this.size.height * arY;
|
||||||
}
|
}
|
||||||
|
@ -40,8 +40,8 @@ export interface PsdAttr {
|
|||||||
igimg?: {};
|
igimg?: {};
|
||||||
|
|
||||||
full?: {};
|
full?: {};
|
||||||
size?: { w?: number, h?: number };
|
// size?: { w?: number, h?: number };
|
||||||
scale?: { x?: number, y?: number };
|
// scale?: { x?: number, y?: number };
|
||||||
img?: { id?: number, name?: string, bind?: number }
|
img?: { id?: number, name?: string, bind?: number }
|
||||||
flip?: { bind: number, x?: number, y?: number }
|
flip?: { bind: number, x?: number, y?: number }
|
||||||
flipX?: { bind: number }
|
flipX?: { bind: number }
|
||||||
@ -93,8 +93,9 @@ export abstract class PsdLayer {
|
|||||||
this.name = this.chineseToPinyin(this.attr?.name || this.name);
|
this.name = this.chineseToPinyin(this.attr?.name || this.name);
|
||||||
|
|
||||||
// 使用配置的缩放系数
|
// 使用配置的缩放系数
|
||||||
let _scale = this.attr?.comps.scale;
|
// let _scale = this.attr?.comps.scale;
|
||||||
this.scale = new Vec3(_scale?.x ?? 1, _scale?.y ?? 1, 1);
|
// this.scale = new Vec3(_scale?.x ?? 1, _scale?.y ?? 1, 1);
|
||||||
|
this.scale = new Vec3(1, 1, 1);
|
||||||
}
|
}
|
||||||
|
|
||||||
abstract onCtor();
|
abstract onCtor();
|
||||||
@ -195,10 +196,10 @@ export abstract class PsdLayer {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// 检查冲突
|
// // 检查冲突
|
||||||
if (obj.comps.full && obj.comps.size) {
|
// if (obj.comps.full && obj.comps.size) {
|
||||||
console.warn(`PsdLayer->${obj.name} 同时存在 @full 和 @size`);
|
// console.warn(`PsdLayer->${obj.name} 同时存在 @full 和 @size`);
|
||||||
}
|
// }
|
||||||
|
|
||||||
return obj;
|
return obj;
|
||||||
}
|
}
|
||||||
|
Binary file not shown.
Loading…
Reference in New Issue
Block a user