1.插件导入
先创建一个3d的项目,然后导入插件:
右键 import package - custom package - 选择XXX.unitypackage
2.创建UIRoot
菜单NGUI - options - reset prefab toolbar,会显示NGUI的一些控件,将一个控件拖动到场景里,会自动创建UIRoot,把该控件删除,然后在UIRoot下创建ui
3.Label
选中UIRoot,右键create Label。
font选择NGUI FONT,点font选择font。
选择unity的font的话,可以选择系统字体(ttf字体)。可以添加ttf文件到项目,然后就可以选Unity font、选该字体。
text设置文本
overflow设置大小适应:
shrink content是适应大小
clampcontent裁剪内容
resizefreely不能改变大小
resizeheight不能改变高度
alignment对齐:
automatic
left
center
right
justified对中文不起作用
gradient设置颜色渐变
effect可以设置shader阴影,outline轮廓
color tint设置字体颜色
4.Sprite
右键create Sprite。
atlas选择图集(图片的集合)。。
sprite选择图片
type图片类型:
simple常用
flip翻转
color tint颜色
5.Panel
右键create Panel。
可在Panel下创建子控件,如Label、Sprite等。panel的作用就是对这些子控件进行结构化分类。
属性:
alpha控制子控件的透明度
clipping裁剪:
soft clip裁剪,可设置裁剪范围
constrain but not clip:可设置大小,不裁剪
6.Button
添加一个Label,给他右键attach一个BoxCollider(大小跟文字一样),然后再attach一个Button Script。
同理可以添加Sprite,然后Attach这些。
在MainCamera上添加一个脚本(创建cs然后拖到MainCamera的inspector去)NGUIButtonClick.cs:
public class NGUIButtonClick : MonoBehaviour {
public void OnLabelButtonClick() {
print("OnLabelButtonClick");
}
public void OnSpriteButtonClick() {
print("OnSpriteButtonClick");
}
}
然后把MainCamera拖到两个button的ButtonScript里的OnClick Notify去。然后选择Method对应脚本里的方法。
同理可以创建Sprite Attach BoxCollider和ButtonScript,然后在Sprite上create child Label显示文字。
但这时点击的时候只是Sprite状态在改变,Label没有随着改变。可以在Sprite上再添加一Button Script,然后把Tween Target补间目标改为Label即可。
7.创建图集Atlas
打开atlas maker: ngui - open - a。。m
创建一个Atlas目录来存放图集。然后new atlas。再在工程视图里选择要全选要打进图集的图片,然后点create 保存即可。
然后创建Sprite,就可选择刚才保存的Atlas,然后在其中选择sprite,添加box coll,button script,可在button script里的Sprites里设置normal、pressed等状态对应的sprite,把colors都改成白色。
禁用按钮:
public UIButton btn;
8.SlicedSprite九宫切图
Sprite的Type里有个Sliced,可用来切图,边角就不会被拉伸了。
点击Sprite后面的Edit编辑,设置border(上下左右都为1),则四周不会被拉伸了。
9.dynamic font动态字体
添加一个
FZSTK.TTF
到Fonts目录。
然后NGUI open - font maker。
字体制作类型type选择dynamic动态字体。
字体源source选择刚才添加的.TTF文件。
还可以设置字体大小和加粗斜体等效果。
然后create the font,生成prefab文件。
创建一个Label,选择刚才生成的字体文件。
10.widget属性
pivot可设置水平方向的左中右、竖直方向的上中下(表示transform位置代表的点)。
depth表示深度信息,越大越在前面
size表示大小,可以snap嗅探图片本来的大小。
aspect是宽高比,basedOnWidth或basedOnHeight是基于宽或高,即调节宽或高来调节大小。
11.anchor锚点
添加一个sprite表示背景。
anchors下面有个type:
unified
execute设置执行时间(OnEnable,OnUpdate,OnStart)
target是参考目标,比如UIRoot(transform)
然后可设置left、right、bottom、top相对于target的左中右 或 上中下的偏移。
所以锚点的作用是相对于target进行位置适配(偏移),相当于挂到target某一个方向了。
所以将left设为tar's left + 0,right right + 0,bottom bottom+0, top top +0,则该sprite能作为背景,自适应屏幕大小了。
同理再添加一个sprite,表示右上角的小地图,则锚点设置left right-xxx, right right-xxx,bottom top-xxx, top top-xxx
advanced,可以为left、right、top、bottom分别设置target来偏移。
12.tween补间动画
先添加一个Label,然后右键tween - alpha,设置from=0,to=1
可以设置播放样式:once,loop,ping pong来回
可设置动画曲线animation curve,右键添加key来调整
duration持续时间,start delay开始延迟
tween group 设置动画组
ignore timescale默认选中(游戏中可能用timescale来暂停或控制游戏速度)
如果不想tween被用到,可将tween script前面的勾选去掉。
同理可以tween:color,width,height,position,rotation
13.slider滑动器
添加一个sprite,然后attach box collider(用于用户交互),再添加slider script。
appearance表现
foreground前景(在sprite下添加一个sprite作为前景)
background背景
thumb拇指显示
这时运行拖动就可以看到前景会随着拖动的比例进行大小改变。可以设置前景sprite的anchor为背景sprite。
可以将前景sprite设置为slice九宫格。
当值改变的时候会有OnValueChange事件,所以可以notify选择一个label,method选择UILabel/SetCurrentPercent
direction可以设置左右 上下方向