Unity3d NGUI的使用(五)(UISprite&UISlider制作彩色血条)

18 篇文章 0 订阅

使用NGUI可以制做出彩色角色血条,加载进度条

制作血条时,可以根据血的多少显示不同的颜色,可以对UISider与UILabel进行简单的封装



UISprite:NGUI精灵图片组件


Atlas:图片集

Sprite:选择的图片集中的图片

Sprite Type:Simple(对图片不进行处理,进行缩放到用户指定大小),Sliced(切成小片的图片来适应大小)

Tiled(以砖块的形式填充区域,进图片不进行缩放),Filled(填充区域),Advacced(高级的,可自定义边缘的像素)

如果是小块的图片,需要进精灵的类型进行修改,这样才能达到效果


制作彩色滑动条:

a.在Widget Tool里添加一个Progress Bar,默认的为我们添加了一个UISider(NGUI compent)


Value:百分比

Alpha:透明度

Steps:步阀阈值

Appearance:特性

a.Foreground(前景图片)

b.Background(背景图片)

c.Thumb(移动指标)

d.Direction(滑动方向)

On Value Change:当滑动时,进行事件分发

b.在Progress Bar上添加一个Script,用来改变进度不同的颜色

[csharp]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:14px;">public class UISliderColors : MonoBehaviour  
  2. {  
  3.     public UISprite sprite;  
  4.   
  5.     public Color[] colors = new Color[] { Color.red, Color.yellow, Color.green };  
  6.   
  7.     UIProgressBar mBar;  
  8.   
  9.     void Start () { mBar = GetComponent<UIProgressBar>(); Update(); }  
  10.   
  11.     void Update ()  
  12.     {  
  13.         if (sprite == null || colors.Length == 0) return;  
  14.   
  15.         float val = mBar.value;  
  16.         val *= (colors.Length - 1);  
  17.         int startIndex = Mathf.FloorToInt(val);  
  18.   
  19.         Color c = colors[0];  
  20.   
  21.         if (startIndex >= 0)  
  22.         {  
  23.             if (startIndex + 1 < colors.Length)  
  24.             {  
  25.                 float factor = (val - startIndex);  
  26.                 c = Color.Lerp(colors[startIndex], colors[startIndex + 1], factor);  
  27.             }  
  28.             else if (startIndex < colors.Length)  
  29.             {  
  30.                 c = colors[startIndex];  
  31.             }  
  32.             else c = colors[colors.Length - 1];  
  33.         }  
  34.   
  35.         c.a = sprite.color.a;  
  36.         sprite.color = c;  
  37.     }  
  38. }</span>  
当Sprite指定为当前Progress Bar的前景图片

e.在当前的Prgoress Bar在创建一个UILabel,将事件分发指定到UILabel

测试代码:

[csharp]  view plain copy 在CODE上查看代码片 派生到我的代码片
  1. <span style="font-size:14px;">public class Tt : MonoBehaviour {  
  2.   
  3.     private UISlider slider;  
  4.     // Use this for initialization  
  5.     void Start () {  
  6.         slider = GetComponent<UISlider>();  
  7.         slider.value = 0;  
  8.     }  
  9.       
  10.     // Update is called once per frame  
  11.     void Update () {  
  12.         if(slider!=null) {  
  13.             Debug.Log(slider.value);  
  14.             slider.value += 0.0005f;  
  15.         }  
  16.     }  
  17. }</span>  



Unity3d NGUI的使用(五)(UISprite&UISinder制作彩色血条)

  • 0
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值