UniPsd提供完整的复合组件的构建。通过定义识别与模糊匹配的方式，绑定复合组件的元素，开发人员可按需进行选择。后续详细的组件生产规范，请参考UniPsd各复合组件制作。以下是所有常用复合组件的预览效果。

复合组件.png

1. 按钮(Button)

一个复杂的按钮通过包括图标、背景图和文本等 ，以下展示了一个最简单的按钮的制作方法。

Button_1.png

Psd的制作方法：

1）. 将按钮包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@button”的组件标识

Button_1_模糊.png Button_1_定义.png

2. 复选框（Toggle）

复选框主要包含背景与选中元素，如下图所示

Toggle_1.png

Psd的制作方法：

1）. 将复选框包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@toggle”的组件标识

Toggle_1_模糊.png Toggle_1_定义.png

3. 输入框（Input）

我们通过一个搜索输入框的形式举例说明，如下图所示

Input_1.png

Psd的制作方法：

1）. 将输入框包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@input”的组件标识

Input_1_模糊.png Input_1_定义.png

4. 滑块控件（Sliders）

常见滑块样式如图所示，当然我们可以给滑块添加其它文本等元素，更多样式可以查看UniPsd提示的演示文件。

slider_1.png

Psd的制作方法：

1）. 将滑块包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@slider”的组件标识

slider_1_模糊.png slider_1_定义.png

5. 滚动条（Scrollbar）

常见滚动条样式如图所示：

scrollbar_1.png

Psd的制作方法：

1）. 将滚动条包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@scollbar”的组件标识

scrollbar_1_模糊.png scrollbar_1_定义.png

6. 多项单选组（Toggle Group）

单选组的处理是自动完成的，我们制作人员只需要将多个Toggle组件，存放在同一个文件夹组当中，工具就会默认识别为单选组。在进行Prefab构建时，就会添加ToggleGroup（UGUI）的组件。

Toggle_Group_1.png ToggleGroup_1.png

7. 滚动视图（Scrollview）

scrollview_1.png

Psd的制作方法：

1）. 将滚动视图包含的元素，存放在同一文件夹组当中

2）. 在文件夹的名称后添加“@scrollview”的组件标识

scrollview_1_模糊.png

8. 总结

1. 对于元素的分类存放，是处理组件的必要操作。工具会分析组内子节点的信息，在模糊匹配中进行识别。

2. 组后面的“@”+组件名，是用于定义最终的导出组件类型。每个关键字，都会最终转换为对应GUI框架的脚本组件。

UniPSD下载地址