1. 基本使用
- NGUI -> 选项 -> Reset Perfab Toolbar,显示预制体UI组件,可以直接拖拽到场景中。
- 使用NGUI,必须要有一个UIRoot作为父组件
- 在场景中的UIRoot中右键单击,然后点Create来创建组件。
注意:必须将Panel展开,否则无法进行该操作
-
UICamera.isOverUI 当鼠标在NGUI上时,该数值为True,如果取消碰撞器,那么该UI不会被判定。
Another控件
让ui自适应
名称 |
功能 |
type |
是否启用锚点 |
execute |
ui自适应的更新方式 |
target |
依照哪一个物体进行ui自适应 |
这样,控件的宽高和位置就会以个物件的各个中心点位置保持绝对距离,从而实现自适应
名称 |
功能 |
left |
与左边界固定值 |
right |
与右边界固定值 |
center |
与中间固定值(保持大小不变) |
type高级可以依照不同物体进行自适应
// 代码添加监听某个组件值改变
UIXXX.onChange.Add(new EventDelegate(this, "Onchanged")
2. Label组件
文本组件
名称 |
功能 |
overflow |
设置文字超出限制时是隐藏还是自动缩小 |
alignment |
文本排列方式 |
keep crisp |
动态字体锐化 |
gradient |
设置文本过渡 |
effect |
字体效果 |
spaceing |
字体间隔 |
max lines |
多少行来显示字体 |
max lines |
多少行来显示字体 |
获取控件文本:GetComponent<UILabel>().text
[ff]:表示该标签之后的文本亮度
方法 |
描述 |
SetCurrentProgress |
用于slider值改变时,为一个0~1的小数 |
SetCurrentPercent |
用于slider值改变时,为一个百分数 |
SetCurrentSelection |
用于下拉列表值改变时 ,为一个字符串 |
3. Sprite组件
图片组件
NGUI -> Open -> Atlas Maker 打开图形处理器。
New 新建纹理集。点击要添加的图片,即可将图片加入当前纹理集。
点击已经添加的图片即可对其进行编辑。(注意打开右下角的Sprite详情方便观察效果)。
名称 |
功能 |
type |
设置纹理平铺方式。 高级 全设置成已平铺,效果等同于原本的平铺效果。
|
Pivot |
设置中心点 |
Depth |
深度,决定哪一个在上面 |
Aspect |
设置纵横比 |
4. Panel组件
面板
名称 |
功能 |
alpha |
透明度控件 |
clipping |
使用哪一种图层蒙版 |
图层蒙版
名称 |
功能 |
soft Clip |
矩形蒙版 |
texture Mask |
图像蒙版 |
5. Button组件
按钮组件
想要使用button组件,必须先为那个对象添加Box Collider
右键点击想要添加Button的对象,通过Attach -> Box Collider来添加
然后为其添加Button Script,即可实现按钮效果
名称 |
功能 |
Tween Target |
设按钮动画操纵的对象 |
isEnabled |
设按钮是否启用 |
6. Tween组件
右键对象Tween以添加动画组件
名称 |
功能 |
From |
起始数值 |
to |
结束数值 |
play style |
播放方式 |
Animation Curve |
动画曲线 |
Duration |
动画时间 |
start delay |
动画延迟 |
Ignore TimeScale |
忽略时间缩放效果 |
如果禁用该方法,可以取消进入游戏时运行该动画,以便让代码来控制动画
方法 |
描述 |
PlayForward() |
正向播放 |
PlayReverse() |
逆向播放 |
7. Slider组件
滑动条组件
想要使用Slider组件,必须先为那个对象添加Box Collider
名称 |
功能 |
Value |
数值 |
step |
可以滑动出几种数值 |
Foreground |
前景图(滑块) |
Background |
背景图(可以没有) |
Direction |
方向 |
Thumb |
游标按钮 |
OnValueChange:UIProgressBar.current.value
Slider Colors插件
让滑动条根据当前数值占最大数值百分比的大小而改变自身颜色
8. UIWidget组件
NGUI的基础组件。简单来说,就是一个你可以放在屏幕任意位置的矩形框。widget会有一定的面积,但是在运行的时候完全不可见,所以非常适合当做其他组件的容器(让所有的sprite或者label等以它进行各种对齐)。
UIWidget 也被用来当做所有NGUI元素的基类——所有你创建的sprites和labels。UILabel,UISprite,UITexture和UI2DSprite都继承自UIWidget。
增加UIWidget的快捷键是alt+shift+w。
Widgets也有Depth属性,控制他们被点击时的响应顺序。在Scene View中右键widget可以看到depth的排序。右键后会看见一个列表,所有在鼠标位置的widget都会列出来。最上面的就是显示在最前面的,也会最先接收事件。
8. PlaySound组件
用于播放声音
触发器 |
描述 |
鼠标单击 |
鼠标单击 |
On Mouse Over |
鼠标进入 |
On Mouse Out |
鼠标离开 |
On Press |
鼠标按下 |
On Release |
鼠标抬起 |
On Enable |
可用 |
On Disable |
禁用 |
9. Typewriter Effect组件
打字机特效组件
参数 |
描述 |
Chars Per Second |
每秒显示字符数 |
Fade In Time |
淡入时间 |
Delay On New Line |
换行等待时间 |
8. PopupList组件
下拉列表组件
想要使用PopupList组件,必须先为那个对象添加Box Collider
名称 |
功能 |
Options |
选项列表,每一行代表一个可选选项 |
Alignment |
选项列表文本对齐方式 |
Open on |
组件的打开复选框按钮 |
Keep->Initial |
设置初始值 |
Background |
组件的复选框背景图 |
HighIight |
复选框选项获取焦点的图 |
Animated |
复选框选是否使用动画 |
font |
复选框文本所用字体 |
必须要选择一种font,否则复选框不会被打开
OnValueChange:UIPopupList.current.value
9. Toggle组件
复选框组件
想要使用Toggle组件,必须先为那个对象添加Box Collider
组:
Group:开关组的设置。默认为0,表示没有开关组。当有多个Toggle的Group相等且不为0的时候,表示它们在同一个开关组中,同一个开关组中的开关只允许打开一个。
Starting State:初始状态是否被选中。
状态:
transition: 设置状态切换是否是平滑过渡
invertState:设置在未被选中情况下显示
OnValueChange:UIToggle.current.value
10. Input组件
输入框组件
想要使用Input组件,必须先为那个对象添加Box Collider
参数 |
描述 |
starting Value |
默认文本 |
saved As |
内容指定保存的键值 |
active Text Color |
文本框激活的时候显示的颜色 |
inactive Color |
未激活的时候显示的颜色 |
caret Color |
闪硕光标的颜色 |
select Color |
被选择文字的颜色 |
input Type |
输入内容格式化,可以是密码显示*号 |
validation |
输入内容限定 |
on Return Key |
按下回车后的行为 |
character Limit |
输入字符数量限制 |
OnSubmit、OnChange:UIInput.current.value
输入内容限定的类型:
类型 |
描述 |
Integer |
数字 |
username |
字母数字 |
名称 |
字母 |
filename |
任意字符 |
11. UIDrag组件
拖拽组件
想要使用UIDrag组件,必须先为那个对象添加Box Collider
- UIDragObject
用于某个UI对象的拖拽行为
参数 |
描述 |
target |
拖拽的对象,一般是自身 |
movement |
拖拽位移是鼠标位移的几倍 |
scrollWheel |
获取鼠标焦点时,每次滚动滑轮的位移 |
dragEffect |
是否在拖拽结束后保留惯性 |
momentum |
惯性大小 |
- UIDragResize
用于拉伸某个UI对象的大小
参数 |
描述 |
目标 |
拉伸的对象,一般是父对象 |
轴心 |
允许拉伸UI的哪些方向 |
minWidth |
最小宽度 |
minHeight |
最小高度 |
maxWidth |
最大宽度 |
maxHeight |
最大高度 |
12. UIScrollBar组件
滚动条组件
想要使用UIScrollBar组件,必须先为那个对象添加Box Collider
名称 |
功能 |
Value |
数值 |
size |
块大小 |
alpha |
透明度 |
step |
可以滑动出几种数值 |
Foreground |
前景图(滑块) |
Background |
背景图(可以没有) |
Direction |
方向 |
Thumb |
游标按钮 |
OnValueChange:UIScrollBar.current.value
13. UITextList组件
文本列表组件
想要使用UITextList组件,必须先为那个对象添加Box Collider
Box Collider
名称 |
功能 |
textLabel |
文本区域 |
textBar |
滑动条 |
style |
从上新增还是从下新增 |
paragraph History |
历史数量限制 |
滚动视图组件
想要使用UIScrollView组件,必须先为那个对象添加Box Collider
- UIScrollView通常挂载在Panel面板上,为了内容水平自适应,子集还需额外安装一个UIGrid插件对象。
- 为视图中的每一个元素添加UIScrollView组件,设置它的滚动视图组件为这个UIScrollView组件。
如果想实现类似血条不可拖动的条,去掉Box Collider即可
UIScrollView
名称 |
功能 |
Content Origin |
制panel相对Scroll View的位置 |
Movement |
控制Scroll View滑动的方向 |
Drag Effect |
拖动的效果(是否采用惯性) |
Scroll Wheel Factor |
鼠标滑轮滚动速度 |
Momentum Amount |
滑动后,自动滑行的距离 |
Restrict Within Panel |
是否自动在边缘处视口拉回 |
Restrict Within Panel |
是否自动在边缘处视口拉回 |
Scroll Bars |
添加滑动条控件 |
13. UIDragDropItem组件
作为组件继承,检测物件的拖动状态,并使其可以拖动
方法 |
功能 |
参数 |
OnDragDropRelease(GameObject surface) |
鼠标抬起时候触发 |
下方第一个有BoxCoLLider的对象 |
OnDragDropStart() |
开始拖动 |
- |
OnDragDropMove(Vector2 delta) |
拖动中 |
当前鼠标位置和开始拖拽时鼠标位置相对物体的偏移差 |