Uinty3D_UI之技能栏制作

一、基础UI制作

	1、创建Button对象（这里不需要Text组件，将其删掉），为Button_SkillItem
	2、在Button下创建两个Image子对象，分别作为技能可用状态（Image_SkillBg）和
	   技能冷却状态（Image_SkillFilled）,并给他们添加相同的Source Image背景图片
	3、将Image_SkillFilled的color属性设置成灰色，以便体现技能在冷却；
	   再将Image Type属性改为Filled状态，这样设计将会达到技能冷却时由灰色逐渐变为明亮的效果

二、代码控制技能冷却

	详细代码及注解如下：

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class TestSkill : MonoBehaviour {

    private Image imageFilled;//填充背景，及灰色读条    
    private float coldTime = 2.0f;//技能的冷却时间    
    private float timer = 0;//当前冷却时间    
    private bool isCold = false;//是否进入冷却    
    private KeyCode skillKey = KeyCode.Alpha1;//技能键
    
    void Start () {        
    	imageFilled=gameObject.GetComponent<Image>();        
    	imageFilled.fillAmount = 0;    
    }       
         
    void Update () {        
    	isCold=SkillKeyDown();        
    	if(isCold == true)        
    	{            
    		timer += Time.deltaTime;            
    		if(timer > coldTime)            
    		{ 
    			//冷却完毕，回归默认值               
    			isCold = false;                
    			timer = 0;                
    			imageFilled.fillAmount = 0;            
    		}            
    		else            
    		{                
    			imageFilled.fillAmount = (coldTime - timer)/coldTime;   //冷却比例         
    		}        
    	}            
    }
    
    //当鼠标点击时释放技能    
    public void OnClick()    
    {        
    	isCold = true;        
    	FreeSkill();    
    }
    
    //当按到1时释放技能    
    private bool SkillKeyDown()    
    {        
    	imageFilled.fillAmount = 0;        
    	if(Input.GetKey(skillKey))        
    	{            
    		isCold = true;        
    	}        
    	FreeSkill();        
    	return isCold;    
    }   
     
    //技能释放
    private void FreeSkill()    
    {
            //释放技能方法（未实现）    
    }
}

三、代码绑定及相关设置

1、将脚本挂载到Image_SkillFilled上
2、在Button上的On Click(）添加消息响应函数