制作进度条(UISlider)
怎样判断是否应当使用进度条
用进度条的主要目的是为了用一根管子的充满程度来直观地表示某种数值的百分比,进度条分为可拖动和不可拖动两种。
可拖动进度条和不可拖动进度条的原理几乎是一模一样,唯一的区别是可拖动进度条上多了一个拖动快和BoxCollider来接收事件,而不可拖动的进度条只能显示一个数字的百分比,无法由玩家去操控。
在判断是否应该使用进度条时,有以下的规律可以遵循:
(1)如果某一种值,它有最大值,需要表达它当前的值的占比,这个时候用进度条会非常直观。此时应当用不可拖动的进度条。例如:角色的生命值、法力值、角色升级经验等。
(2)如果某一种值,它有最大最小值,希望玩家去自由拖动设置,如音量调节、亮度调节等,就可以使用可拖动的进度条。
可拖动进度条和不可拖动进度条,它们都有三大核心要素构成:底槽Sprite、进度条Sprite、滑动块。
创建进度条
1.第一种方式:自己拼装出一个进度条
(1)创建一个底槽Sprite。
(2)为底槽Sprite附加一个UISlider组件。附加方法为AddComponent->NGUI->Interaction->NGUI Slider。
(3)在底槽Sprite下创建一个进度条Sprite作为子物体,调整好尺寸用以和底槽相吻合。
(4)在底槽Sprite下创建一个滑动块Sprite作为子物体,然后在底槽Sprite上Attach一个BoxColllider。
(5)将底槽Sprite拖动到自身UISlider组件上的Background选项中,将进度条Sprite拖动到底槽的UISlider组件上的Foreground选项中,将滑动块Sprite拖动到底槽的UISlider组件上的Thumb选项中,这样三大要素就齐备了。
(6)如果希望显示当前进度的百分比数字,则在滑动块下创建一个Label(如果不希望数字的位置跟着滑动块走,也可以在别的地方创建Label),然后将该Label物体拖动到底槽的UISlider组件的OnValue Change模块下的Notify中,然后在出现的Method选项中选择UILable->SetCurrentPercent方法。
2.第二种方式:使用PrefabToolBar直接创建
在新版本的NGUI中,它自身制作了一些常用的UI控件的预设,当需要使用时,直接拖动预设到场景中,就可以直接完成创建。
在Unity顶部菜单中选择NGUI菜单,选择Open->PrefabTooBar,会弹出NGUI已经制作好的一些预设。
拖动其中想要的预设到UI Root下(或者其他的UI节点下),就可以完成创建了。
核心组件UISlider设置
1.Value
进度值,这是为了显示当前数值在"总槽"里的百分比。
2.Alpha
透明度,默认为1。
3.Steps
每次变动的步伐大小。默认为0,0就是无限制,也就是Value值可以是任意一个值,如果设置了,那么Value就会"一段一段的"变化。
它的填值效果为"关键点数量的概念",例如,填入5,则代表完整进度条只有5个点,相当于进度条的值将会只有:0、0.25、0.5、0.75、1共5个值。
4.Appearance模块
Foreground
这是进度条上层表示进度的Sprite,将它拖动到这里就算完成了设置。Foreground的长度会随着Value的裱花而自动变化。
Background
这是进度条的底槽Sprite,将它拖动到这里就算完成了设置。底槽的长度是不会发生变化的。
Thumb
这是拖动块的设置,将任何一个物体拖动到这里来,它就将随着Value的变化而发生位置的变化。
Direction
进度条的正方向,默认为从左至右。里面提供了4中选择:从左至右、从右至左、从上到下、从下到上。
5.On Value Change
这是进度条发生变化时的一个回调函数,当Value值发生变化时,就会执行这里的函数。
值得注意的是,如果希望在值发生变化时,自动改变一个百分比数字(Label)的显示,NGUI提供了一个简单的方法:将要显示该进度条百分比的Label物体拖入到Notify中,然后再Method栏中选择UILabel.SetCurrentPercent方法,这样,当进度条的Value值改变时,它就能自动地改变这个Label文本的显示。
进度条的BoxCollider说明
BoxCollider只有附加到底槽上才有用。
如果没有BoxCollider,进度条无论如何都无法进行拖动设置。
BoxCollider将会接收进度条上任何一个位置的消息来直接设置进度。例如,不去拖滑动块,直接在90%的位置点一下,那么进度会直接变为90%。
BoxCollider和拖动块Thumb没有必然联系,如果没有BoxCollider,那么即使有拖动块,也无法通过拖动和单击等来设置进度。
只要有BoxCollider,即使没有拖动快,也能直接拖动和单击来设置进度位置。
制作进度条(UISlider)的更多相关文章
- Unity3D NGUI制作进度条
利用GUI可以制作进度条,但是NGUI更加方便 我是用的NGUI3.5.3, 先找到NGUI Slider的预制体,利用自带的UISlider来制作. 主要是利用UISlider的Value来控制进 ...
- html5中的progress兼容ie,制作进度条样式
html5新增的progress标签用处很大,它可以制作进度条,不用像以前那样用css来制作进度条! 一.progress使用方法 progress标签很好使用,他有两个属性,value和max,va ...
- 每日CSS_纯CSS制作进度条
每日CSS_纯CSS制作进度条 2020_12_26 源码 1. 代码解析 1.1 html 代码解析 设置整个容器 <div class="container"> . ...
- 纯CSS3制作进度条源代码
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- js - 预加载+监听图片资源加载制作进度条
这两天遇到一个新需求:一个一镜到底的h5动画.因为功能的特殊性,就要求我们提前监听页面的静态图片是否全部加载完毕.即处理预加载. 总结下来,下次这种需求需要提前注意以下几点: 一.图片而不是背景图 本 ...
- easyui制作进度条案例demo
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- NX二次开发-BlockUI对话框嵌套MFC对话框制作进度条
半年前在一些QQ群看到有大神NX二次开发做出了进度条,那个时候我还不会弄,也不知道怎么弄得,后来断断续续得研究了一下,直到今天我把它做出来了.内心还是很喜悦的!回想自己这两年当初从没公司肯给我做NX二 ...
- CSS3制作同心圆进度条
1.css代码 此处在制作进度条时,是旋转进度条的半圆(红色),背景使用灰白(如果使用红色作为背景,旋转灰白遮罩,在浏览器中可能会有渲染bug) .wrapper{ display:block;pos ...
- 使用 new XMLHttpRequest() 制作下载文件进度条
mui 进度控件使用方法: 检查当前容器(container控件)自身是否包含.mui-progressbar类: 当前容器包含.mui-progressbar类,则以当前容器为目标控件,直接显示进度 ...
随机推荐
- ant例子
1.安装ant 下载解压→环境变量配置→cmd输入ant 出现 Buildfile: build.xml does not exist! 代表安装成功 参考文章:http://www.cnblogs. ...
- iOS 手动打造JSON Model转换库
前一段时间学习了Runtime,对类和对象的结构,和一些消息转发有一些自己的理解,现在希望简单的应用下,就决定自己写一个简单的JSON与Model的相互转化,现在总结下. 建议查看 参考资料 :Run ...
- Oracle 通过sql profile为sql语句加hint
sql profile最大的优点是在不修改sql语句和会话执行环境的情况下去优化sql的执行效率,适合无法在应用程序中修改sql时.sql profile最常用方法大概是:--创建产生sql tuni ...
- DEM渲染洼地淹没图(转)
http://blog.csdn.net/kikitamoon/article/details/18700555 首先要准备基础数据,一张DEM栅格图. 然后将掩膜水位以下的数据提取出来以备后用.这里 ...
- iOS安全攻防
iOS安全攻防 http://www.docin.com/p-760264769.html
- Unicode 编码解码
1. Regex.Unescape(str);返回Unicode解码,非Unicode直接返回 /// <summary> /// 2.转为Unicode编码 /// ...
- Scala语言专题
Scala基础01:基础语法 Scala基础02:函数,懒值,异常 Scala基础03:数组 Scala基础04:类与对象 Scala基础05:包与引用 Scala基础06:继承 Scala基础07: ...
- 【暴力模拟】UVA 1594 - Ducci Sequence
想麻烦了.这题真的那么水啊..直接暴力模拟,1000次(看了网上的200次就能A)后判断是否全为0,否则就是LOOP: #include <iostream> #include <s ...
- centos 7访问windows共享文件夹
1. 首先centos要能识别win7的文件系统ntfs,原版的centos是不支持NTFS格式的文件系统,因此需要安装ntfs支持软件包,我使用的是rpmforge软件库,在此处http://pkg ...
- 关于IO的一些数字
http://static.googleusercontent.com/external_content/untrusted_dlcp/research.google.com/en/us/people ...