NGUI笔记
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
NGUI笔记
1-2、先创建UI ROOT
3、-Label 受限于Widget->size的大小
-Font NGUI类型字体选择NUGI里的字体,可以用FontMaker 创建
Unity类型字体(用于选择动态字体)还可以从系统里拷贝一些字体(C:\Windows\Fonts)
-Overflow ShrinkContent标签空间自动适应,压缩字体显示
ClampContent按照字体的大小显示,超出标签框的不显示
ResizeFreely横向使标签空间适应字体空间,此时不能随意控制标签框大小
ResizeHeight纵向使标签适应字体空间,根据字数改变标签框高度,此时只能随意调节标签框长度
-Alignment 对齐方式左、中、右、Justified 注:Justified:自动对英文扩展适应标签框,中文无效
-Gradient 设置字体渐变颜色
-Effect Shadow字体加阴影 OutLine字体加边框凸显
4、-Sprite UISprite
-Type
-Sliced: 九宫切图使被拉伸的图片边角不会模糊
-Tiled: 平铺使精灵里的图案均匀分布,铺满图片,适用于精灵里由各种图案组成
-Flip:按照水平或垂直翻转or both
5、-Panel
-Alpha 控制Panel的透明度 Panel上所有组件都会受影响
-Clipping
-SoftClip控制Panel上内容的显示
6、-Button
-添加碰撞体
-添加脚本UIButton
-Notify 选择一个物体,指定这个物体上所有脚本中的某个方法-标签按钮、图片按钮、图片标签按钮(在图片上加碰撞体、UIButton 若要图片和标签同时相应需再添加一个UIButton/ButtonScale,并将此上的Tween Target改为标签)
7、-图集由于图片单个使用会浪费性能,故将所有图片做为图集
在UI里创建一个Sprite,精灵默认的图集就属于新创建的图集
-UIButton脚本下
-Sprites属性(Hover:鼠标划过的状态图片)这些图片要属于同一个图集
-再次open Atlas给图集添加、更新或删除图片
8、-Sliced 九宫切图UISprite Sliced 使被拉伸的图片边角不会模糊
-Type :Sliced(修改图片的边框) 点击Edit编辑边框修改Border 值,这样仅会拉伸边框范围之内的图片
可以在拉伸按钮时设置Sliced使按钮的四个角不会被拉伸,一般带有边角的图片需要
当图片出现虚边时可以微调Dimensions
9、-NGUI制作字体集
静态字体:所用的汉字已经写在一张图片上,一张图片集合,使用图片去使用所需要的字体
动态字体
Font Maker
-Bitmap静态字体会在某个图集里生成
-Dynamic动态字体在设置过程中可以设置加粗、倾斜动态字体不会在图集里生成,使用动态字体会稍微影响性能
10、-Widget及其常用属性
-Pivot是中心点,做坐标的原点分水平(左中右)和垂直方向(上中下)
-Depth 控制显示的优先级
-Snap 让图片恢复原来的大小
-Aspect 宽度与高度
之比 Based On Width:只能通过宽度修改高度不能修改
11、-Achor(重要) 设置物体的上下边框距离另一个控件的相对位置,使之不变
方便实现控件的自适应可以设置一个锚点目标,之后相对这个锚点可以保持不变
如使背景图片与相机的大小保持一致
Type默认是none 设为Unified 统一的 Advanced当Unified无法满足条件时使用,可以使用4个不同的物体为Achor
-Execute On Enable设置之后就不会变 OnUpdate随更新而变化
-Left Right Bottom Top(物体上下左右边框)
-Target's Center设定的一边是以锚点目标Center为Achor,物体到中心点的距离不变
-Target's Left 物体与锚点目标左边框间距离保持不变,这样一来场景一旦改变其他边会伸缩,图片变形
可控制物体到锚点目标的距离不变
使物体处在与相机的相对位置(如游戏中地图的位置)(物体默认是与坐标原点保持不变的)
-使UI边框的边角为原点来实现自适应
12、Tween 补间动画
-Toween Alpha 透明度的变化
Tweener
-Play Style once,Loop(0->1 0->1),Ping Pong(0->1 1->0 看起来较缓和)
-Animation Curve 变化曲线,可手动改
-Duration 动画时间
-Start Delay 延迟播放
-Ignore TimeScale 默认勾选游戏可通过TimeScale控制游戏暂停或达到游戏满动作的效果。
比如将TimeScale设为0.5(正常为1),动画就会延长2倍,原来1秒的时间作2秒用
取消勾选Tween禁用动画
-Tween Color 颜色渐变动画
-Tween Width 宽度大小渐变动画
-Tween Height 高度渐变动画,如很多闪现渐变的标题
-Tween Position 位置移动动画
-Tween Rotation 旋转动画 x水平 y垂直 z前后
-Tween Scale 大小渐变将物体的大小设为0效果更好
-Tween Transform 从一个位置到另一个位置
13、Slider 滑动条的制作
1、BoxClider ->
2、Slider Script
Slider Script
-Value 图片显示的百分比
-Steps 滑动条按照一定的间距变化
-Apperance
-Foreground 3、使在前的图片可滑动并用Anchors固定 4、改变前后图片的颜色凸显效果
-Background 4、制作背景(或就用原有的图片作背景,就不用再指定)
-Thumb 游标根据滑条滑动
-Direction 滑条滑向
5、显示百分比两种方案
-<1>用脚本监听UISlider值的变化(On Value Change)
-<2>让On Value Change(Method) 通知Label(UILabel/SetCurrentPercent) 无需代码
-还可以使On Value Change通知我们写的脚本,进行一些处理根据Value来控制
14、15、16游戏菜单制作
相关脚本
-UI Play Sound 播放声音
-Pitch 控制声音播放速度
-Invisible Widget 容器Container
- Typewriter Effect 让文字逐个显示
16、分析选项参数,设计选项界面
-创建一个GameSetting脚本
-见代码
-界面参
数:
-音量大小:背景声音大小、NPC说话声音大小、技能声音大小-在指定控件内添加东西,必须在控件的范围之内右键添加
17、下拉列表的制作
添加碰撞体->加脚本Popup List Script->加一个标签显示值->将标签拖到On Value Change上
->选择SetCurrentSelection(保证文本框正常显示)
Popup List Script脚本
-Options 所有可用的选项
-Default 默认选项为
-Position 点击后弹出的框位于哪个位置
-Auto根据屏幕自适应
-On Value Chang 当值改变触发如标签
-SetCurrentSelection(设置当前选择选项)
-Atlas
-Background 弹出框的背景
-Animated 选栏上下滑动时有动画效果
-Font 下拉框内字体
-Padding 选项间距离
注:文本框中的字体由文本框上的标签控制,下拉框中的字体由下拉框上的标签控制
文本框或下拉框不显示的原因可能有:文本框或下拉框上的标签字体不支持该文字
17、单选框的制作
添加碰撞体->加脚本Toggle Script->添加勾精灵->将勾指定给Toggle(Sprite)
Toggle Script脚本
-Sprite 勾精灵 Toggle Script会控制勾的显示和隐藏
-transition 控制勾显现动画
注:Prefab Toolbar内的自创建对象需要先创建预制对象
20、使用脚本监听控件的值修改,取得控件的值(重要)
-步骤:在脚本中提供方法处理当控件值改变时的触发的事件
->OnValueChanged通知响应脚本所在的物体
-notify通知哪个游戏对象若需触发脚本事件则通知脚本所在的控件
->取得UI端的值(如rslider)
-UISlider继承自UIProcessBar,UIProcessBar下的current属性表示正在操作的滑动器。
同样,UIPopupList中也有current属性故利用UI脚本中的current属性获取值
注:注意PopupList取值时要去掉首尾空白字符
21、界面的切换动画
使用TweenPosition
22、CD仅冷却动画
将Sprite的Type调为Filled(进行隐藏)
23、TextField单行文本和多行文本输入框
创建sprite做背景图片->加碰撞体->加Inputfiled->设定显示标签->设置标签的Anchors与Sprite保持一致
注:若是多行文本框调整标签的Widget,时其中心点位于左上角,聊天框也可以将其调为左下角
Script:UIInput 默认支撑多行输入
-Label:显示输入的文字
-OnReturnKey 按下回车键后的动作若是多行文本框则将其改为NewLine
-CharacterLimit 限制输入字符
24、注册界面
-校验
26、给控件添加可拖拽的功能和可调节大小的功能
drawable
-加碰撞体->加dragObject脚本
control
-加碰撞体->加DragResize脚本->使要拖动的物体为目标->以拖动的物体为目标设置Achors
-DragResize
-p
ivot设置以哪里为可调节大小的位置
27、创建ScrollBar滚动条
Sprite做背景->加碰撞体->ScrollBar脚本->将可滑动部分的高度设为与固定部分等高(关键)->设置可滑动部分的Achors
-ScrollBar
-size 滑动部分与固定部分的比,显示可滑动部分的大小当和其他控件结合使用时,size会自适应
-value 表示可滑动部分所处的位置
28、创建T extList文本列表
label->加碰撞体->加TextList脚本->加控制代码
-TextList
-style Chat文本从下往上添加
每次一运行TextList都会对标签内容进行清空,需要使用代码控
制文本的显示
29、30、31、32、聊天系统
33、背包
-为物体加Drag and Drop Item脚本
-Drag and Drop Item使物体具有拖拽和放置效果
->添加脚本继承自Drag and Drop Item(通过复写Drag and Drop Item中OnDragDropRelease函数确定物体放置的位置) -surface表示拖拽后释放到了哪个游戏物体之上(返回的是游戏对象)
-使物体放置后在格子内居中(利用surface)
->给背包容器knapsack_bg加脚本Knapsack
-使之持有一个数组存储所有格子
->判断格子上有没有物体(利用tag 格子有物体是会被物体所覆盖此时标签是所放的物体)
->物品交换位置
36、物品捡起
-根据图集里的名字实力物品
->循环列表在还没有物品的地方放置
->物品已满判断
->物品数量叠加
37、血条的制作
-prograssBar脚本->不加碰撞体(不交互)
->导入NGUI_HUD包
->加UIFollowTarget脚本(血条跟随角色) 使物体跟随添加在要
跟随的物品上如血条、名字
-target 所要跟随的物体如:角色
-GameCamera 添加渲染场景的相机
-Disable if Invisible 当跟随的组件不在场景之内是否把本身子组件隐藏(对性能有益,不见不渲染)
->创建一个空对象放置血条
39、显示伤害和治疗
添加HUDText脚本
-Bitmap Font 静态字体
-TrueTypeFont 动态字体
-Apply Gradient 应用渐变
-Offset Curve 位移曲线
-Alpha Curve 透明度曲线
-Scale Curve 大小曲线
-创建T estHUDT ext(一般放在角色上的控制物体上) 在其中调用HUDText脚本显示的位置为HUDText脚本所在物体的位置
40、伤害和治疗的跟随
使数值跟随物体
在UIROOT内添加物体HUD 在其上加HUDText和FollowTarget 脚本
设置FollowTarget属性。