【Unity的UI小功能】实现血条蓝条的手动加减
学习目标：
平时在游戏中血条蓝条的数值非常常见，今天来制作一个简单的UI框架。今天要实现通过搭建UI以及编写代码通过手动的WASD实现蓝条血条的加减。
学习内容：
查询方法必须网站：file:///F:/Unity%202021.1.18f1c1/2017.4.40c1/Editor/Data/Documentation/en/ScriptReference/index.html 不会的方法查就完事了
首先先按照平时在游戏中看到的建立父子级别关系
注意HIerarchy面板中的父子关系，（小技巧：想要建立圆形图像就像这个雪人，先创建一个Image取个名叫Mask，然后从资源库选择一个圆形图像，再添加组件名字就叫Mask，然后创建Mask的子对象图片，将图片和Mask的大小重合即可）
然后将空对象Playermsg下面的子对象的锚点和中心点全部调到左边
再往Playermsg上创建一个脚本，通过代码即可实现该功能
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class HealthAndMagic : MonoBehaviour {
private RectTransform healthRT;
private RectTransform magicRT;
private Text healthText;
private Text magicText;
public float speed = 10f;
private float hor,ver;
private void Awake()
{
healthRT = transform.GetChild(0).GetChild(0).GetComponent<RectTransform>();
magicRT = transform.GetChild(1).GetChild(0).GetComponent<RectTransform>();
healthText = transform.GetChild(0).GetChild(1).GetComponent<Text>();
magicText = transform.GetChild(1).GetChild(1).GetComponent<Text>();
}
private void Update()
{
hor = Input.GetAxis("Horizontal");
ver = Input.GetAxis("Vertical");
healthRT.sizeDelta = new Vector2(healthRT.sizeDelta.x
+ hor * Time.deltaTime * speed, healthRT.sizeDelta.y);
magicRT.sizeDelta = new Vector2(magicRT.sizeDelta.x
+ ver * Time.deltaTime * speed, magicRT.sizeDelta.y);
}
}
通过简单的设置速度，WS控制蓝条左右移动，AD控制血条的左右移动，即可手动实现该功能
然而，以上代码无法控制血条和蓝条的上限，会出现超值现状。
同样，我们也仍然没实现血蓝条文本的变动，一直保持在1000；
这个时候就要用Mathf.Clamp()函数
本次用到的重载为Mathf.Clamp(float,min,max);
先创立一个currentHealth和currentMagic来记录当前血蓝条
当前的值就是healthRT.sizeDelta.x+ hor * Time.deltaTime * speed;
和magicRT.sizeDelta.x + ver * Time.deltaTime * speed;
最小值自然是0，最大值就是血蓝条的原始宽度（你原始是不是满血满蓝嘛）
maxHealth = healthRT.sizeDelta.x;
maxMagic = magicRT.sizeDelta.x;
在每帧执行的Update()函数，当前血条的变动就用这个函数来限制范围，如果超出最大最小值就让currentHealth和currentMagic等于最大最小值
currentHealth = Mathf.Clamp(currentHealth, 0, maxHealth);
currentMagic = Mathf.Clamp(currentMagic, 0, maxMagic);
对于文本的变动，我们要用到最大宽度和当前宽度，以及最初的hp和magic
private float MaxHealthTextWidth = 1000;
private float MaxMagicTextWidth = 1000;
之后运用最大的值/最大文本 = 当前的值/当前文本
得 healthText.text = (currentHealth / maxHealth * MaxHealthTextWidth).ToString();
magicText.text = (currentMagic / maxMagic * MaxMagicTextWidth).ToString();
（因为healthText.text 是string类型，要用ToString()将float转化为string类型）
以下是完整版的代码
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class HealthAndMagic : MonoBehaviour {
private RectTransform healthRT;
private RectTransform magicRT;
private Text healthText;
private Text magicText;
public float speed = 10f;
private float hor,ver;
private float maxHealth = 0;
private float maxMagic = 0;
private float MaxHealthTextWidth = 1000;
private float MaxMagicTextWidth = 1000;
private void Awake()
{
healthRT = transform.GetChild(0).GetChild(0).GetComponent<RectTransform>();
magicRT = transform.GetChild(1).GetChild(0).GetComponent<RectTransform>();
healthText = transform.GetChild(0).GetChild(1).GetComponent<Text>();
magicText = transform.GetChild(1).GetChild(1).GetComponent<Text>();
//获得初始状态下最大长度
maxHealth = healthRT.sizeDelta.x;
maxMagic = magicRT.sizeDelta.x;
}
private void Update()
{
hor = Input.GetAxis("Horizontal");
ver = Input.GetAxis("Vertical");
//计算当前血条
float currentHealth = healthRT.sizeDelta.x
+ hor * Time.deltaTime * speed;
float currentMagic = magicRT.sizeDelta.x
+ ver * Time.deltaTime * speed;
//限制血蓝条的范围
currentHealth = Mathf.Clamp(currentHealth, 0, maxHealth);
currentMagic = Mathf.Clamp(currentMagic, 0, maxMagic);
//WASD增减血蓝条
healthRT.sizeDelta = new Vector2(currentHealth,healthRT.sizeDelta.y);
magicRT.sizeDelta = new Vector2(currentMagic,magicRT.sizeDelta.y);
//显示血蓝文本
healthText.text = (currentHealth / maxHealth * MaxHealthTextWidth).ToString();
magicText.text = (currentMagic / maxMagic * MaxMagicTextWidth).ToString();
}
}
实际展示：
学习产出：
函数Mathf.Clamp()限制值的变化
获取子对象的组件transform.GetChild(0).GetComponent<组件名>();
RectTransform类的sizeDelta属性来控制UI的x和y坐标（即长度和宽度）
Vector2是个结构体，使用时用new Vector2(x,y);