一、组件与元件

       组件概念与Unity3d的组件不同,FairyGUI的组件Component可理解是容器Panel,新建组件方式:选中资源库的包,右击新建组件。

    元件是组件中装的各类资源,分别有文本、富文本、图形等。

二、图形、图片与动画

    图形可设置形状、外边框线条大小、线条颜色、填充颜色、圆角。

    图片可直接拖拽放入FairyGUI的资源库中,属性有:颜色(一般不设置)、亮度、翻转、填充颜色。

    动画:方式一:菜单栏的资源-新建动画...-弹出动画编辑窗口-点击导入图片序列,选中你要生成动画的序列帧动画素材-保存-生成动画于资源库中。

    方式二:直接拖拽.gif格式文件入资源库,自动生成相应动画。

三、文本与富文本

    文本只支持文本的设置,而富文本还支持图文混合、超链接、按钮等设置。

    属性:输入勾选上,意味着可在测试模式下(F5),对该文本进行编辑,文本设置成输入模式后,点击右边的小齿轮还可以进行对该文本长度的限制,格式的限制,基于unity3d使用是要用正则表达式来对文本格式进行限制的。

    UBB属性被勾选上后,可在文本内输入UBB语法来对某一段文本文字进行单独设置,例如:[color=#FF0000]你好![/color]就是对这一段“你好”进行了颜色设置。

    单行属性被勾选上后,文本框就不允许换行了,即使使用代码去换行也不允许。

    其余属性略过。

四、普通组与高级组

    不同的元件设置成同一个组合后,在显示列表会对那些设置成同一组的元件放入一个物体下。在选中该组合后,对组合框的大小进行编辑会同步影响组合内的所有元件的大小,若要单独编辑,则双击元件即可。

    在组合属性中,勾选上普通组就是普通组合,勾选上高级组就是高级组合。

    在高级组的属性中,有不可见属性,当勾选上行后组合中的所有元件在测试模式下为不可见状态。

    布局:水平布局与垂直布局都是按照组合中的元件大小进行排序。

五、关联系统
    关联:2个元件之间存在的一种联系,来进行约束双方的。

    每一个元件都可设置与另外一个物体进行关联,其中关联有一个关系:主动方与被动方。

    我们都是在被动方元件进行设置关联属性,点击后默认是容器组件为关联对象,可直接选择另外一个元件来作为关联对象。

    设置为关联对象的元件就是主动方,关联设置成:左->左模式,即2个元件的左边框会保持绝对距离,其中有一个比较特殊:左右居中(上下居中),是以2个元件的中间竖直线(上下居中的话就是中间水平线)为基准,保持绝对距离。

    主动方(被设置成关联对象的一方)的移动会影响被动方(设置了关联属性的一方)。

    什么物体会被设置成被动方?答案:多数为静态物体,静态即大小和位置都不怎么变化的物体。

    什么物体会被设置成主动方?答案:多数为动态物体,动态即大小和位置经常发生变化的物体。

    为什么要弄这个关联?答案:提高界面美观。

    实例可参考:点击打开链接

    其中实例二:绿色按钮那方为静态,文本框为动态,则按钮设置关联,关联文本框,关联模式:顶->底。

    这样,按钮的最上方就会与文本框的低端保持绝对距离,让任务栏更加美观,而不会出现留太多空白地方的效果。

Logo

权威|前沿|技术|干货|国内首个API全生命周期开发者社区

更多推荐