学习目标：

平时在游戏中血条蓝条的数值非常常见，今天来制作一个简单的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();
? ? }
}