NGUI

  • NGUI 简介
  1. NGUI包含:Selection、Create、Attach、Tween、Open、Options、Extras、Normalize Depth Hierarchy、Help
  • NGUI 创建控件
  1. 创建UI(以2DUI为例)

    在NGUI->Create->2DUI,创建UI默认名称UI Root,其包含组件transform和rigidbody,脚本UI Root和UI Panel,另外有一个子物体Camera。

    UI Root脚本中scalingStyle:(设置UI Root的缩放比例大小):Flexible,Constrained,ConstrainedOnMobiles。Constrained和ConstrainedOnMobiles中content width/height  fit是否勾选,作用为是否根据宽/高改变UI Root缩放比例。

    UI Panel 脚本中注意Depth是设置当前面板的层级深度(值越大,在camera中越先被绘制显示)。

  2. UI SpriteNGUI -> 创建Sprite,需要一个atlas(图集)中选择某张贴图。UI Sprite中type:Simple、Sliced、Tiled、Filled、Advanced可实现多种图片效果。Snap:(图片自适应大小,若图片的大小为2的幂次方,则snap后的像素与图片原大小一样,反之,snap后像素为最接近原图片大小的2的幂次方,代码:GetComponent<UISprite>().MakePixelPerfect())。
  3. UI LabelNGUI -> 创建Label, Font中选择需要的字体,将Gradient中Top设置为勾选状态,注意当UI上出现字体模糊的情况,将Keep crisp类型改为Never。
  4. UI TextureNGUI -> 创建Texture,需要选择某张贴图。UI Texture中type用法类似。Snap(自适应原图片像素大小,与2幂次无关)。
  5. UIWidget                                                                                                                                                                                        UIWidget 是不可见的矩形,他不画图,但是他可以接收事件。可以用于包含其他控件。他包含 Anchor、 Sprite、Label 都是从 Widget 继承的
  6. Anchor                                                                                                                                                                                            None:           Unified: 可以指定另外一个对象,以这个对象来对准我。分为 left, right, top, bottom。        Advanced: 可以分别为 left, right, top, bottom 指定一个对象来对齐,也就是可以指定4个
  7. Scroll view

    Scroll view创建后自带UI Plane和UI Scroll View两个脚本,UI Panel的clipping 选择Soft Clip;offset表示偏移量;center表示距中心的偏移量;size表示Panel的大小;softness边框的大小。

    UI Scroll view: Content Origin:滚动视图的滚动方向;Movement:控制Scroll View滑动的方向,是水平还是垂直,或是随意滑动(Unrestricted ),或是自定义延X,Y滑动(Custom )Drag Effect:拖动的效果,MomentumAndSpring这个效果就是IOS会弹的效果;Scroll Wheel Factor:鼠标滑轮滚动速度;Momentum Amount:滑动后,自动滑行的距离; Restrict Within Panel:如果选择了,则panel不会滑出 。    Scroll View:Scroll Bars:添加滑动条控件。

     

  8. Grid (水平或垂直排列组件 )

    Arrangement:排列的方向;Sorting:排列的顺序(None:没有顺序;Alphabetic:按字母的顺序; Horizontal:水平放置的顺序; Vertical:垂直放置的顺序; Custom:自定义的方式。比如将Sprite的名字命名方式如下:001,002,003); Pivot:抛点的位置;Max Per Line:最大行或是列的数量;Cell Width:单元之间的宽度;Cell Height:单元之间的高度; Animate Smoothly:平滑动画;Hide Inactive:隐藏不活动的组件; Keep Within Panel:保持在Panel中。
    右上角的小齿轮点击开,里面的Execute,点击即可在编辑的状态下排列这些Item

  9. Table(对子项进行可换行的排序)

    Columns:列数,超过该数目会添加一行。Direction:行添加方向,Down向下添加、Up向上添加。Sorting:排序方式:None按照Index排序、Alphabetic按照名字进行排序、Horizontal和Vertical按照localPosition进行的排序、Custom自己实现的排序方式。Pivot:网格起始点锚点。Cell Alignment:格子对齐点。 Padding:间隔。
  • Attach 为某物体添加脚本(此脚本为NGUI自带)。

     

  • Tween

Tween Alpha:表示物体的透明度从某一个值到另一个值,From表示开始的值,To表示之后的值

Tween Color:表示物体的颜色从某一个值到另一个值,From表示开始的颜色,To表示之后的颜色

Tween Width:表示物体的宽度从某一个值到另一个值,From表示开始的宽度,To表示之后的宽度

Tween Height:表示物体的高度从某一个值到另一个值,From表示开始的高度,To表示之后的高度  

Tween Position:表示物体的坐标从一个位置到另一个位置,From表示开始的位置,To表示之后的位置  

Tween Rotation:表示物体从一个角度到另一个角度的变换,From表示开始的角度,To表示之后的角度   

Tween  Scale:表示物体的大小从某一个值到另一个值的变换,From表示开始的大小,To表示之后的大小  

Tween Transform:表示物体的Transform变换,From表示开始的物体位置,To表示之后的物体位置

(Tween动画在完成后可加回调,SetOnFinished(CallBackMethod))

  • OpenAtlas Maker:图集 。Font Maker:字体集。Prefab Toolbar:nguI自带prefab(如:button  sprite  Slider等等 ) 。Panel Tool:显示场景中存在UI Panel。 DP(Depth Pass)表示该panel深度;Layer表示所在层级;wg(Widgets)表示该Panel渲染了多少个控件; DP(Draw Calls) Panel会消耗多少个Draw Call。这个数值越低,效率越高; clip表示是否需要裁切功能。默认情况下不会有裁切;Draw Call Tool:每个被渲染物体DrawCall的数量; Camera Tool:场景中所有的camera,(Layer,EV-UICamera,mask);
  1. Widget Wizard(Legacy):

      Template:创建所需的prefab,Add To指定Prefab的父物体,在Template、  Add To之间的属性根据实际需求选择。 

  • NGUI  UIEvents

public delegate void VoidDelegate (GameObject go); 

public delegate void BoolDelegate (GameObject go, bool state);

public delegate void FloatDelegate (GameObject go, float delta);

public delegate void VectorDelegate (GameObject go, Vector2 delta); 

public delegate void ObjectDelegate (GameObject go, GameObject obj); 

public delegate void KeyCodeDelegate (GameObject go, KeyCode key);

public VoidDelegate onSubmit;

public VoidDelegate onClick;

public VoidDelegate onDoubleClick;

public BoolDelegate onHover;

public BoolDelegate onPress;

public BoolDelegate onSelect;

public FloatDelegate onScroll;

public VoidDelegate onDragStart;

public VectorDelegate onDrag;

public VoidDelegate onDragOver;

public VoidDelegate onDragOut;

public VoidDelegate onDragEnd;

public ObjectDelegate onDrop;

public KeyCodeDelegate onKey;

public BoolDelegate onTooltip;

 

 

 

 

Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐