小地圖的制作一種方式是用還有一個攝像機來渲染到一張紋理上。實時顯示到UI界面。
以Unity 5.0 的 UI 系統為例：
在地圖正上方放置一個攝像機，設置其 Culling Mask，比方：Ground（地面）、MinimapSign（玩家怪物標識），創建一張 Render Texture，將
Target Texture 屬性指向這張紋理圖片。例如以下圖所看到的：
創建 UI 面板。由於這里小地圖打算制作成圓形，使用
Mask 組件和一張掩碼圖片能夠達到這個效果。
如上圖的 MapMask 物體加入 RawImage 指向掩碼圖片，加入 Mask 組件。例如以下圖所看到的：
其下的 RawImage 物體即是用來繪制小地圖紋理，將其
Texture 屬性指向小地圖紋理圖片就可以，例如以下圖所看到的：
執行效果例如以下圖所看到的：
但是當場景中使用水效果的話，水沒有繪制到小地圖中，例如以下圖所看到的：
可是攝像機生成的紋理，卻是有繪制的，例如以下圖所看到的：
那么應該是繪制到 UI 上時，出現了錯誤。查看 UI 所使用的默認 Shader ，發現它採用了混合
Blend SrcAlpha OneMinusSrcAlpha，那么可能是由於原圖中的水部分Alpha通道為0，使得 Alpha 混合時產生透明效果。將水材質的
Horizon Color 的
Alpha 值改為 255，例如以下圖所看到的：
最后效果例如以下圖所看到的：
另外，使用
Mask組件 雖比較方便，可是不夠平滑，也能夠寫 Shader 來實現 Mask功能。詳細內容對
UI-Default.shader 進行拷貝稍加改動。命名為
MaskShader.shader，內容例如以下：
Shader Code
|
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
Shader "
UIEx/Default-Mask"
{ Properties { [PerRendererData] _MainTex ("Sprite Texture", 2D) = "white" {} _Mask ("Mask Texture", 2D) = "white" {} _Color ("Tint", Color) = (1,1,1,1) _StencilComp ("Stencil Comparison", Float) = 8 _Stencil ("Stencil ID", Float) = 0 _StencilOp ("Stencil Operation", Float) = 0 _StencilWriteMask ("Stencil Write Mask", Float) = 255 _StencilReadMask ("Stencil Read Mask", Float) = 255 _ColorMask ("Color Mask", Float) = 15 } SubShader { Tags { "Queue"="Transparent" "IgnoreProjector"="True" "RenderType"="Transparent" "PreviewType"="Plane" "CanUseSpriteAtlas"="True" } Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } Cull Off Lighting Off ZWrite Off ZTest [unity_GUIZTestMode] Blend SrcAlpha OneMinusSrcAlpha ColorMask [_ColorMask] Pass { CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; half2 texcoord : TEXCOORD0; }; fixed4 _Color; v2f vert(appdata_t IN) { v2f OUT; OUT.vertex = mul(UNITY_MATRIX_MVP, IN.vertex); OUT.texcoord = IN.texcoord; #ifdef UNITY_HALF_TEXEL_OFFSET OUT.vertex.xy += (_ScreenParams.zw-1.0)*float2(-1,1); #endif OUT.color = IN.color * _Color; return OUT; } sampler2D _MainTex; sampler2D _Mask; fixed4 frag(v2f IN) : SV_Target { half4 color = tex2D(_MainTex, IN.texcoord) * IN.color; // clip (color.a - 0.01); half4 color2 = tex2D(_Mask, IN.texcoord); return fixed4(color.r, color.g, color.b, color2.r); } ENDCG } } } |
創建材質，設置為這個Shader。設置其 Mask圖片，例如以下圖所看到的：
設置小地圖 Raw Image 組件的屬性，其
Material 指向這個材質，例如以下圖所看到的：
終於效果對照方下：
