Unity实现各种样式的血条

我将讲述三种不同类型血条UI的实现

第一种是常见的进度条样式的血条实现：

进度条式的血条样式如图示

要实现进度条式的血条，我们需要使用到unity的UI中的滑动条，它分为Slider滑动条，Background滑动条的背景，Fill Area填充条，这个组件就类似于进度条不过带了一个可以按住滑动的滚钮（Handle Slide Area），这里所用的血条UI去除了这个组件，可以根据你的实际使用需求选择性删除它。

在Slider对象上，你可看到Slider栏最底下有个value选项，改变它的数值，你就能看到进填充条的变化，Slider的子组件Fill Area/Fill上有Rect TransForm如果你没有将左右设置为0，那么它不会将整个背景栏全部遮完，简单理解就是这里的左右相当于修改了图像变换的起始位置。（如果你难以理解，建议应该学习一定的unity的UI知识后再来）

根据value会变换情况得知，我们只需要写一个脚本，将最大值设置为对象的最大生命值，最小值默认为0，使得value的值和对象的血量保持一致即可实现血条变换效果。

//这部分是敌人对象上部分的代码
    [Range(0, 1000)]
    public int max_blood;//最大血量

    private int current_blood;//当前血量

    //该脚本挂载在AI敌人对象上，代码仅供参考
    private Blood blood;//控制敌人对象血条的对象，Blood是另一个脚本，unity中没有这个类

    void Strat()
    {
    blood = GetComponentInChildren<Blood>();//获取敌人对象的血条组件
    //Blood脚本是挂载在敌人子对象的slider上的，实际情况根据你自己的设置位置选择获取方式
    
    //这样可以匹配不同的敌人的血量来显示
    blood.Set_MaxHP(max_blood);//设置滑动条的最大值最小值等（一般不用改最小值）
    }

    //控制AI血条值改变的方法，该方法在任何子弹碰撞到该物体时的OnCollisionStay2D下调用
    public void Change_HP(int change)//change是要修改的血量，正负皆可
    {
        //返回修改后的血量，将值控制在0到max_blood之间
        current_blood = Mathf.Clamp(current_blood + change, 0, max_blood);

        //在blood对象中控制修改数值
        blood.Set_CurentHP(current_blood);

        //如果血量小于0就销毁对象(正常情况应该是先播放死亡动画，关闭碰撞，再销毁)
        if (current_blood <= 0)
        {
            Destroy(gameObject);
        }
    }

//挂载在Slider上的脚本
public class Blood : MonoBehaviour
{
    //slider对象
    private Slider slider;
    
    //由于敌人对象初始化时执行Set_MaxHP,如果不放在Awake就会导致slider还为null报错
    //这里不懂，可以参考以前的文章
    void Awake()
    {
        slider = GetComponent<Slider>();
    }
    
    //设置最大值得范围，并将当前值也设为最大值(默认敌人生成时是满血)
    public void Set_MaxHP(int max_vlaues)
    {
        slider.maxValue = max_vlaues;
        slider.value = max_vlaues;
    }
    
    //修改数值，使value保持和当前生命值一致
    public void Set_CurentHP(int current_vlaues)
    {
        slider.value = current_vlaues;
    }
}

第二种是多个图片式的血条实现：

图片血条就是玩家每受到一次伤害就减少一颗心这样的效果，用的是UI中的图像选项，效果如图：

那么问题是如何做到，如果是直接将心的图片删除，那么会回血上的不便。我们在使用unity时，可能经常用到设置图像可视性，当我们减血，只要把最高位上的心设置为不可见，这样当我们想要回复时，只需要再设置回可见，就能达到效果。

//玩家部分脚本
    private Blood_image blood_Line;//控制图形血量，初始化由你自己方式和放置的位置来写，我不再给出
    
    private int Max_blood;//最大血量大小

    private int Current_blood;//具体的血量大小
    
    //控制图形血量变化，如果传入的set是true说明是加血，否则是减血
    //提醒一下这种方式仅针对为每一次伤害或者回血为1的情况，如果大于1则不能使用此方法
    public void ChangeHP(bool set)
    {
        //修改图片的可视性，这个位置的索引正好就是blood
        if(set){
            //限制当前血量在范围内
            Mathf.Clamp(Current_blood + 1, 0, Max_blood);
            //blood不能直接传，因为加血是它指位置的是始终不是当前需要修改的位置
            //这一步即使blood已经是最大血量是由于是重复设为true所以也不会有问题
            blood_image.Active(Current_blood - 1, set);  
        }
        else{
            Current_blood -= 1;//减则是另外一回事，因为这里每次改的是1，和最后的判断死亡
            //故不需要使用Mathf.Clamp()
            blood_image.Active(Current_blood, set);
        }
        if(blood == 0){
            //无关部分，省略
        }
    }

//blood上的脚本
public class Blood_image : MonoBehaviour
{
    public GameObject[] Blood;//控制血图片对象组

    void Start()
    {
        //由于我是在编辑器界面直接给Blood添加每个图片的对象的，所有没有初始化的代码
        //根据你的实际情况可以选择为添加制的
    }
    
    //设置图片可视性
    public void Active(int index, bool set)
    {
        //根据传入对应的位置来修改图片的可视性
        Blood[index].SetActive(set);
    }
}

这种血条的问题在于如果对象属于拥有高生命值时，我们不可能绘制一堆心心在界面上，一种解决这种问题的方法是设置图片的透明度或者大小，当这个图片的透明度为0或者大小为0时对下一张图片继续同样操作即可。

第三种是畸形血条样式的实现：

一种常见的畸形血条就是环形血条，这个更多是作为技能冷却条而不是血条，我这里就是技能条的类型，但是可以做成血条，基本的思路是一样的，如图左上角。

设置环形血条也用的是UI中的图像选项，只不过将其的遮罩方式改为了填充方式（根据你的需求可以设置不同的方式，比如这里的环形遮罩方式是Radial360）当你修改了填充度时，图像就会根据填充度环形的填充，1时整个图像全部显示，0.5只显示上半部分（这个受你设置的起始点影响），类推一下，你就会发现这个实现原理其实和进度条几乎一样，所以我就不废话了，放码！

//具体原理基本和slider一样便不再重复
public class Blood_Circle : MonoBehaviour
{
    private Image image;
    
    //由于fillAmount的范围只能设为0~1,因此可以使用Current_blood/Max_blood来计算
    public void SetValue(float value)
    {
        image.fillAmount = value;
    }
}