unity3D游戏开发之NGUI 圆形血条、进度条制作实现详解.doc

通常，为了美化界面布局，进度条或者角色血条、经验条并不是长方形的，可能会是个圆形，看了下别人的制作过程都稍显复杂，为此整理了一份步骤非常简单的制作圆形进度条或者圆形血条、经验条的方法。 这儿我们使用了一个遮罩 Shader。 先来看看最终效果图： 需要的美术素材如图所示： 导入 NGUI 以及布局经验条的步骤省略，最终的经验条树形结构如图： 这儿需要特别注意的是，附加到圆形经验条的 NGUI 组件类一定要是 UITexture，因为 UITexture 有 Material 选项，这样才可以使用我们的遮罩材质。 下面是遮罩 Shader 的代码：12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667Shader Custom/CircleAlphaMask Properties _Color (Main Color, Color) = (1,1,1,1) _MainTex (Base (RGB) Trans (A), 2D) = white _MaskTex (Mask (A), 2D) = white _Progress (Progress, Range(0,1) = 0.5 Category Lighting Off ZWrite Off Cull back Fog Mode Off Tags Queue=Transparent IgnoreProjector=True Blend SrcAlpha OneMinusSrcAlpha SubShader Pass CGPROGRAM #pragma vertex vert #pragma fragment frag sampler2D _MainTex; sampler2D _MaskTex; fixed4 _Color; float _Progress; struct appdata float4 vertex : POSITION; float4 texcoord : TEXCOORD0; ; struct v2f float4 pos : SV_POSITION; float2 uv : TEXCOORD0; ; v2f vert (appdata v) v2f o; o.pos = mul(UNITY_MATRIX_MVP, v.vertex); o.uv = v.texcoord.xy; return o; half4 frag(v2f i) : COLOR fixed4 c = _Color * tex2D(_MainTex, i.uv); fixed ca = tex2D(_MaskTex, i.uv).a; c.a *= ca = _Progress ? 0 : 1; return c; ENDCG SubShader AlphaTest LEqual _Progress Pass SetTexture _MaskTex combine texture SetTexture _MainTex combine texture, previous Fallback Transparent/VertexLit 新建一个材质，把 Shader 赋予这个新建立的材质，然后设置如下属性，如图所示： 最后通过代码来控制进度的显示：123456789101112using UnityEngine;using System.Collections;public class ExpBar : MonoBehaviour public UITexture uiTexture; void Awake() this.uiTexture.material.S