1. Use UGUI para criar uma barra de saúde
Eu costumo usar imagem para fazer a barra de saúde. Claro, você também pode usar o componente deslizante Slider. As etapas de operação específicas da imagem são as seguintes:
Barra de saúde comum
1. No painel Hierarquia, crie dois componentes de imagem e defina um como nó filho do outro.
2. No painel Inspetor, adicione o sprite de imagem e defina o Tipo de imagem como Preenchido.
Após selecionar este tipo, selecione Horizontal no tipo Método de Preenchimento.
Isso completa a operação no editor
3. O seguinte precisa ser controlado no código. . Obtenha o componente de imagem e controle seu campo fillAmount
barra de saúde redonda
Use a UI para rolagem circular da barra de saúde. Repita as operações 1, 2 e 3 acima.
Nota: Na etapa 2, você precisa selecionar Radial 360 no tipo Fill Method.
Fill Origin pode controlar a posição inicial da barra de saúde. Basta alterá-lo de acordo com suas necessidades.
2. Use malha para fazer barras de saúde
Usar a malha para criar uma barra de saúde requer o uso do Shader para controlar a malha. O shader completo da barra de saúde circular é o seguinte:
Barra de saúde do anel
·
Shader "CustomBoold/CircleShader" {
Properties {
_MainTex ("Base (RGB)", 2D) = "white" {
}
_Angle("fill", range(0, 360.0)) = 0
_Color ("Tint", Color) = (1.0, 0.6, 0.6, 1.0)
}
SubShader {
Tags{
"Queue" = "Transparent" }
Pass {
Blend SrcAlpha OneMinusSrcAlpha
CGPROGRAM
#pragma vertex vert_img
#pragma fragment frag
#include "UnityCG.cginc"
uniform sampler2D _MainTex;
uniform float _Angle;
uniform fixed4 _Color;
float4 frag(v2f_img i) : COLOR
{
float4 result = tex2D(_MainTex, i.uv);
float angle = degrees(atan2(i.uv.x-0.5 , i.uv.y-0.5));
if(angle > _Angle-180)
{
result.a = 0;
}
return result*_Color;
}
ENDCG
}
}
}
1. Crie o código de shader acima no projeto e crie a bola de material correspondente. Arraste o arquivo de shader recém-criado para o shader
. 2. Adicione o shader à barra de saúde do pré-fabricado. Depois de expandir o shader, você poderá observar um controle deslizante arrastável.
3. Obtenha o material deste objeto no código.
game.GetComponentInChildren<SpriteRenderer>().material
mat.SetFloat("_Angle", 血量比值);
Barra de saúde comum
Barra de saúde retangular usando malha. O shader específico só precisa modificar um código. Basta modificar a função frag no código do shader circular acima para o seguinte.
float4 frag(v2f_img i) : COLOR
{
float4 result = tex2D(_MainTex, i.uv);
if(i.uv.x > _Angle)
{
result.a = 0;
}
return result*_Color;
}
1. Crie o código de shader acima no projeto e crie a bola de material correspondente. Arraste o arquivo shader que você acabou de criar para a bola shader
2. Obtenha o material deste objeto no código.
game.GetComponentInChildren<SpriteRenderer>().material
mat.SetFloat("_Angle", 血量比值);