FairyGUI Editor(UI编辑器) v3.10.5 官方版 xx

FairyGUI Editor是一款跨平台的开源性UI设计开发软件。FairyGUI 编辑器采用强大的可视化直观界面，无需代码即可编辑，采用独特的FairyBatching技术，可自动优化复杂界面的DC数量，支持如图文混排、表情输入、虚拟列表、循环列表，像素级点击检测、打字效果等，提供多个主流游戏引擎SDK，操作更加灵活高效。

【基本介绍】

FairyGUI提供了一个强大的UI编辑器，使用习惯与Adobe系列软件保持一致，美术设计师和策划都可以轻松上手。
与市场上其他UI编辑器不同，FairyGUI编辑器重视设计师体验，摒弃了脚本和配置文件这些需要代码思维的操作。借助FairyGUI提供的 组件、关联、控制器 以及 动效，我们可以在不写代码的情况下使用编辑器轻松地制作大量复杂的带有动画效果的自动布局的UI。
FairyGUI提供了多个游戏引擎SDK：Unity、Cocos2d-x、Cry Egine, Havok Vision/Project Anarchy、白鹭、LayaAir、Haxe、Pixi、Flash、Starling，未来还将支持UE4、LibGDX等。借助FairyGUI-SDK，你可以轻松在UI中使用3D对象、粒子等元素，而且FairyGUI还解决了环形进度条、像素点击测试、图文混排、循环列表、虚拟列表、曲面UI、VR输入等UI开发中常见的痛点。

【软件功能】

1、强大的文本控件。支持动态字体，位图字体，以及外部工具(例如BMFont等)制作的位图字体，同时支持HTML语法和UBB语法，支持复杂的图文混排。输入文本支持IOS原生表情的直接输入。支持字体的描边效果，阴影效果，支持渐变色文字。
2、强大的列表控件，支持多种布局，支持虚拟列表和循环列表，即使列表项目数量巨大也拒绝卡顿。虚拟列表还支持不等高ITEM、多种ITEM资源混合等高级特性。支持表格、树等高级列表控件。
3、支持图片的九宫格和平铺处理，支持九宫格内各个宫格的平铺处理。支持图片变色和灰度。
4、所见即所得。操作简易，使用习惯与Adobe系列软件保持一致，策划和美术设计师都可以轻松上手。
5、在编辑器即可组合各种复杂UI组件，无需编写代码。不需要程序员编码扩展UI组件。
6、支持平移、缩放、旋转、倾斜、翻转等常规的2D变换。
7、支持基础的绘图功能，例如矩形、圆形、多边形等。
8、支持序列帧动画编辑和使用。自带序列帧动画编辑器，同时支持导入由Flash CS、Animate CC等工具制作的动画。
9、内置多种手势支持。
10、编辑器提供时间轴设计UI动效，可以组合透明度、位置、大小、颜色等十几种属性的动画效果。并可实时看到每帧的效果。支持插入声音。支持嵌套动效。
11、支持矩形遮罩和自定义图形遮罩。
12、支持滤镜。
13、支持逐像素检测的点击检测方式。
14、支持将UI组件绑定到任何模型上，例如实现曲面UI。
15、内置文本的打字效果。
16、内置普通窗口管理器，弹出窗口管理器，拖放管理器。
17、支持事件的冒泡机制。
18、封装了所有输入方式的底层细节，无论是鼠标输入、单点触摸输入、多点触摸输入、VR输入，你都只需要使用相同的事件侦听方式处理UI交互。
19、支持在UI层中插入任何3D物体，例如模型、粒子、骨骼动画等。
20、编辑状态下使用分散的素材，发布时自动打包图集。支持定义多个图集，Unity版本自动支持抽出A通道的压缩方式。

【安装教程】

下载FairyGUI-Editor
下载好后，即可得到文件夹 FairyGUI-Editor，双击打开，找到 FairyGUI-Editor.exe ，具体如下图


双击打开 FairyGUI-Editor.exe 即可打开应用，具体如下图

为了方便实用，选择 FairyGUI-Editor.exe，右键发送到桌面作为快捷方式，具体如下图

【使用教程】

打开项目和创建项目
启动FairyGUI编辑器后，首先显示的是打开项目/创建项目的窗口：

历史记录 曾经打开过的项目可以直接从列表中点击打开。
删除 点击右上的垃圾桶按钮删除选定的打开历史记录。
打开其他 通过选择一个项目描述文件 xxx.fairy 打开一个已有项目。
打开目录 通过选择项目所在的目录打开一个已有项目。适用于打开2.x版本的项目。

编辑器支持同时打开多个项目。Windows平台下，可以直接启动多个FairyGUI编辑器。Mac平台下，你可以在打开一个项目后，再点击菜单“文件”->“在新窗口打开项目”打开其他项目。

在指定位置创建一个新的UI项目。
项目名称 任意的项目名称。
项目类型 UI项目类型，即目标平台。不同的平台类型在资源组织、发布上有一定的差别。不需要担心这里选择错了项目类型，在项目创建后可以随时调整UI项目类型，操作位置在菜单“文件”->“项目属性”里。

资源管理
FairyGUI的项目在文件系统的结构为：

FairyGUI是以包为单位组织资源的。包在文件系统中体现为一个目录。assets目录下每个目录都是一个包。包内的每个资源都有一个是否导出的属性，一个包只能使用其他包设置为已导出的资源，而不设置为导出的资源是不可访问的。同时，只有设置为导出的组件才可以使用代码动态创建。
包发布后可以得到一个描述文件和一张或多张纹理集（不同平台的文件数量和打包方式可能有差别）。FairyGUI是不处理包之间的依赖关系的，如果B包导出了一个元件B1，而A包的A1元件使用了元件B1，那么在创建A1之前，必须保证B包已经被载入，否则A1里的B1不能正确显示（但不会影响程序正常运行）。这个载入需要由开发者手动调用，FairyGUI不会自动载入。
如何划分包，有一个原则，就是不要建立交叉的引用关系。例如避免A包使用B包的资源，B包使用C包的资源这类情况。我们一般都建立一个或多个公共包，把整个项目需要频繁使用到的资源放在这里，把一些基础组件，例如按钮、滚动条、窗口背景等也放到这里。其他包需要使用时直接从公共包拖入就可以了。除了公共包，其他包相互之间尽量不发生引用关系。简洁的依赖关系可以使程序员更轻松地控制UI资源的载入和卸载。
包划分的粒度一般没有一个硬性的规定。在具体实践中，有不同的方案，比如有的人喜欢分的比较细，一个模块一个包；有的人喜欢包少一点，就把不同UI模块的资源和组件都堆在一起。这些方案对UI的运行性能影响都不大。但是图片资源尽量不要太分散，因为不同包的图片是不能打在同一张纹理集上的，如果资源太分散，可能造成纹理集的留空过多，浪费空间。

增删改资源
你可以直接在文件管理器（或Finder）进行这些操作：
增加资源 可以直接将素材放置到包目录里。也可以将另外项目的包直接拷入到assets目录。然后点击库面板上面的刷新按钮。
移动资源 可以将素材在包内各个文件夹里移动。但不能跨包移动，否则引用关系将丢失。然后点击库面板上面的刷新按钮。
删除资源 可以直接在包目录里删除素材；然后点击库面板上面的刷新按钮。
替换资源 可以用外部工具打开素材编辑，也可以直接替换文件。这类操作无需刷新，返回到编辑器就可以看到最新修改的结果。

package.xml
每个包里都有一个package.xml文件，这个是包的数据库文件，如果这个文件被破坏，那么包的内容将无法读取。在多人协作的情况下，如果package.xml出现冲突，请谨慎处理。

库面板
进入编辑器后，主界面的左边是库面板。库面板包括资源库和收藏夹两个子面板。

库面板里采用树状结构显示。顶层节点是包，每个包下面可以创建文件夹。可以直接在键盘上按包名第一个字符的拼音的首字母，直接定位包。
可以直接将图片、声音、动画、文字等素材从文件管理器（或Finder）中拖动到资源库中。素材在同一个包中可以在各个文件夹中移动，也可以使用复制和粘贴功能。如果要更新素材，可以点击资源，在右键菜单中选择“更新资源”，也可以在文件管理器（或Finder）中直接替换文件，后者适合批量操作。
资源URL地址
在FairyGUI中，每一个资源都有一个URL地址。选中一个资源，右键菜单，选择“复制URL”，就可以得到资源的URL地址。无论在编辑器中还是在代码里，都可以通过这个URL引用资源。例如设置一个按钮的图标，你可以直接从库中拖入，也可以手工粘贴这个URL地址。这个URL是一串编码，并不可读，在开发中使用会造成阅读困难，所以我们通常使用另外一种格式：ui://包名/资源名。两种URL格式是通用的，一种不可读，但不受包或资源重命名的影响；另一种则可读性较高。
资源导出
包内的每个资源都有一个是否导出的属性，已导出的资源的图标右下角有一个小红点。使用右键菜单提供的功能可以方便的切换一个或多个资源的导出属性。
收藏夹
收藏夹提供了一个快速访问常用组件的功能。可以将一些常用的组件或素材放置在收藏夹里，便于快速访问。也可以实现一个类似控件面板的功能。在资源库里右键单击一个或多个资源，然后在右键菜单中选择“加入收藏夹”，就可以将资源加入收藏夹。

过滤显示包
当库面板里的包比较多时，查找东西比较麻烦。可以把一些不常用的包隐藏起来。点击库面板上的

与编辑器链接
激活这个功能后，当活动文档发生切换时，会同时在资源库中选中活动文档对应的组件。
快速定位
按资源名称拼音或者英文的第一个字母，可以在当前选中项的同一层次快速定位到该资源。
复制、粘贴和粘贴全部
库里面的资源可以复制粘贴。使用右键菜单中的“复制” “粘贴” “粘贴全部”或者“Ctrl+C” “Ctrl+V”都可以完成。
“粘贴”和“粘贴全部”在跨包复制时体现区别。
粘贴全部 把选定的资源以及它（们）所有引用到的资源一并粘贴过来。
粘贴 只会粘贴选定的资源以及它（们）引用到但没有设置为导出的资源。快捷键为Ctrl+V。
提示：复制、粘贴功能支持跨项目，同时打开两个项目后，就可以互相复制粘贴。

主工具栏

屏蔽显示控制器 屏蔽后所有被显示控制器隐藏的内容都会显示出来。

屏蔽关联系统 屏蔽后手动修改元件坐标和大小关联系统不会动作。

提醒信息 如果当前文档内有同名对象，会显示黄色叹号。

在库中显示 点击可在库中定位这个组件。


侧工具栏


可以在拖动和选择两种模式间切换。特别的，在选择模式下，按住空格就可以临时切换为拖动模式，释放空格就可以切换为选择模式。


基础控件区域。点击后再在舞台上点击一个位置，则在对应位置生成一个对象。


组合和取消组合。组合的快捷键是Ctrl+G，取消组合的快捷键是Ctrl+Shift+G。


对齐操作。选定多个元件后，再点击这里的按钮，可以执行对应的对齐功能。例如选定两个元件后，点击左右居中，则两个元件将设置为中线对齐。如果只选择了一个元件，则该元件对容器组件执行对应的对齐功能。例如，选定一个元件后，点击左右对齐，则元件将移到容器组件的中间位置。又例如，选定一个元件后，点击相同宽度，则元件的宽度将设置为与容器组件相同。


自定义排列。点击后弹出自定义排列的对话框。


控制器工具栏

点击加号可以增加新的控制器。点击控制器名称可以进入控制器编辑界面。点击控制器的各个页面按钮切换页面。

动效工具栏

点击加号可以增加新的动效。点击动效名称可以进入动效编辑界面。

显示列表

这里显示的当前正在编辑的组件的显示列表。按显示顺序排列，列表中越往下的元件显示在越前面。
显示列表面板的操作有：
点击每行行头“眼睛”对应的位置可以隐藏元件，仅用于辅助编辑，不影响运行时。
点击每行行头“锁”对应的位置可以锁定元件，锁定后元件无法选中，仅用于辅助编辑，不影响运行时。
点击锁图标可以解锁所有元件。
点击眼睛图标可以解除所有元件的隐藏状态。
在显示列表中拖拽可以改变元件在显示列表中的位置。

舞台

舞台是组件的编辑区域。添加内容到舞台的方法有：
侧工具栏上点击基础控件，然后点击舞台。
从资源库或收藏夹中直接拖拽资源到编辑区域。
可直接粘贴剪贴板中的文字或图片。图片会自动导入到资源库，然后再放置到舞台上。
可以从Windows资源管理器或者Finder中直接拖入资源。如果该资源是位于assets目录下的，也就是说已经是包里的资源里，那么对应包里的资源会放置到舞台上，不会发生资源重复导入到资源库的情况。这个设计可以部分解决目前库面板不能显示所有图片缩略图的不便利性，因为在Windows资源管理器或者Finder中你可以方便的查看缩略图，同时，如果你是使用多屏工作，还可以起到类似将库面板放置单独一屏的作用。
中间不同于周边颜色的是组件区域。但你并不需要把所有内容都放置到组件区域内。默认情况下，超出组件区域的内容依然会被显示，但组件的大小仅由组件区域决定。某些特别的功能，例如滤镜，只对组件区域生效，所以建议把内容都放置在组件区域内。

常用的舞台操作有：
选定 点击一个元件单选，按住SHIFT点击多个元件多选。点击空白处取消所有选择。在空白处按下并拖动进行框选。
移动 按住元件拖动，如果拖动时按住SHIFT，则移动限制在垂直方向或者水平方向。使用键盘上、下、左、右箭头键可以移动选定的元件，每按一次移动1像素，如果同时按下SHIFT键，则移动加速，每次移动10像素。
缩放 拖拽选定框边缘的8个调整点，可以改变元件的宽度和高度。
组合 选定多个元件后，按CTRL+G建立一个组合。

【常见问题】

UI包加载失败
如果你使用的FairyGUI编辑器版本小于3.1.5，那么包描述文件的格式为纯文本，当这个文件从GIT上拉下来时，有可能由于GIT的自动转换换行符功能导致文件内容发生变化从而造成FairyGUI识别错误。解决办法是关闭GIT的自动转换换行符功能，然后再重新拉一次下来。
如果你使用的FairyGUI编辑器版本大于等于3.1.5，那么包描述文件的格式已修改为二进制，不再受GIT的影响。仍然出现这个错误的原因是新的格式需要Unity SDK 1.8.3或以上版本支持。旧版本无法识别这个格式，就会报这个错误。解决办法是升级你的Unity SDK，升级你的Unity SDK，升级你的Unity SDK，重要事情说三遍。
如果暂时不想升级，可以修改xxx.fairy（你的项目描述文件），将里面的version="3.1"改成version="3"，这样编辑器就会使用旧的文本格式发布。
除了上面这个错误，如果包仍然不能加载，检查包名和路径是否正确，特别要注意包只能放置在Resources目录或者它的子目录下，否则就只能打AB包。再看看是不是Unity的项目放置在了带中文名称的目录，这都有可能造成载入失败。

显示白屏/提示atlas not found
Unity5.5版本开始，纹理设置新增了TextureShape属性，把他设置为2d就可以了。

运行报错且看不到界面，但编辑模式没问题
这种错误一般是因为使用UIPanel，原因可能有：
1.你的UI包没有正确放置到Resources目录，或者Resources拼错了！太多新手犯这样的错误。
2.如果有跨包引用，需要使用AddPackage手动载入依赖包，并且注意，AddPackage必须在UIPanel创建之前，建议放到Awake。
3.如果包发布后移动过位置，或者修改过名称，重新设置一下UIPanel的包和组件名。

显示不出图片/文字，但没有报错
项目中没有放置FairyGUI的着色器，即插件里Resources/Shaders里的着色器。请重新安装插件。

UI显示有重复，或者UI销毁后依然显示
1.场景里没有放置主相机。
2.主相机的ClearFlags错误设置为了Depth。
3.场景里还有其他相机，且它的Culling Mask设置勾选了UI。

字体渲染效果不对
如果你设置了字体后，觉得字体效果不对，可以用以下的方式排查：
1.如果是只用了字体名称，没有使用ttf字体文件的，那么你需要再次确认你的操作系统（例如Windows）里是否有安装这种字体，字体名称是否正确。对于部分字体，Unity能识别的字体名称不一定是字体的中文名称。查看准确的系统字体名称，你可以将ttf文件拖入到Unity，就可以在Inspector的”Font Names”里看到正确的字体名称。也可以下载FontCreator软件，查看字体的Font Family属性。
2.如果是用了ttf文件的，那么运行时在Project视图，点击ttf文件左边的箭头后，可以看到ttf文件下有Font Texture和Font Material。Font Texture里应该有你游戏中使用到的文字，并能看到渲染效果。如果能看到，说明这个字体在Unity中的渲染效果就是这样。