Unity问答——请教一下NGUI的图片转换问题

     这篇博客源自我在泰课在线的回答。链接：http://www.taikr.com/group/1/thread/92

     问：请教一下NGUI的图片转换问题

　　　　1、NGUI能不能把导入的方形图片转成圆形的（因为技能图标大多方形，手动ps比较慢）。

　　　　2、NGUI假设导入的图片是圆形，那么用Box Collider却是方形碰撞，用圆形碰撞感觉检测不出，是怎么回事..

     答：   

　　问题一：NGUI能不能把导入的方形图片转成圆形的（因为技能图标大多方形，手动ps比较慢）。　　　　

　　下面是我改写的NGUI自带的名为nlit/Transparent Colored的shader，经测试完美运行。

　　Shader "Unlit/Transparent Colored"
　　{
　　　　Properties
　　　　{
　　　　　　_MainTex ("Base (RGB), Alpha (A)", 2D) = "black" {}
　　　　}
　　　　SubShader
　　　　{
　　　　　　LOD 200
　　　　　　Tags
　　　　　　{"Queue" = "Transparent"　　"IgnoreProjector" = "True"　"RenderType" = "Transparent"}
　　　　　　Pass
　　　　　　{
　　　　　　Cull Off
　　　　　　Lighting Off
　　　　　　ZWrite Off
　　　　　　Fog { Mode Off }
　　　　　　Offset -1, -1
　　　　　　Blend SrcAlpha OneMinusSrcAlpha
　　　　　　CGPROGRAM
　　　　　　#pragma vertex vert
　　　　　　#pragma fragment frag 
　　　　　　#include "UnityCG.cginc"
　　　　　　sampler2D _MainTex;
　　　　　　float4 _MainTex_ST;
　　　　　　struct appdata_t
　　　　　　{
　　　　　　　　float4 vertex : POSITION;
　　　　　　　　float2 texcoord : TEXCOORD0;
　　　　　　　　fixed4 color : COLOR;
　　　　　　};
　　　　　　struct v2f
　　　　　　{
　　　　　　　　float4 vertex : SV_POSITION;
　　　　　　　　half2 texcoord : TEXCOORD0;
　　　　　　　　fixed4 color : COLOR;
　　　　　　};
　　　　　　v2f o;
　　　　　　v2f vert (appdata_t v)
　　　　　　{
　　　　　　　　o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
　　　　　　　　o.texcoord = v.texcoord;
　　　　　　　　o.color = v.color;
　　　　　　　　return o;
　　　　　　}
　　　　　　fixed4 frag (v2f IN) : COLOR
　　　　　　{
　　　　　　　　float2 center = (0.5f, 0.5f);
　　　　　　　　float dis = distance (IN.texcoord, center);
　　　　　　　　fixed4 col = tex2D(_MainTex, IN.texcoord) * IN.color;
　　　　　　　　if(dis > 0.5f)
　　　　　　　　{
　　　　　　　　　　col.a = 0;// 或者使用discard
　　　　　　　　}
　　　　　　　　return col;
　　　　　　}
　　　　　　ENDCG
　　　　}
　　}
　　SubShader
　　{
　　　　LOD 100
　　　　Tags
　　　　{"Queue" = "Transparent"　　"IgnoreProjector" = "True"　　"RenderType" = "Transparent"}
　　　　Pass
　　　　{
　　　　Cull Off
　　　　Lighting Off
　　　　ZWrite Off
　　　　Fog { Mode Off }
　　　　Offset -1, -1
　　　　ColorMask RGB
　　　　Blend SrcAlpha OneMinusSrcAlpha
　　　　ColorMaterial AmbientAndDiffuse
　　　　SetTexture [_MainTex]
　　　　{
　　　　　　Combine Texture * Primary
　　　　}
　　}
}
}

     上面红色部分为改动过的地方。这个shader的使用只能用于NGUI所建的Texture上，不能用于Sprite上。原因是Sprite使用的Shader是Atlas材质使用的Shader。

      问题二：NGUI假设导入的图片是圆形，那么用Box Collider却是方形碰撞，用圆形碰撞感觉检测不出，是怎么回事..

 　  1. NGUI的碰撞检测可以使用多种类型的碰撞器，包括2D碰撞器和3D碰撞器。

      2. 你在问题中提到使用圆形碰撞器无法检测，不知你说的是Sphere Collider还是Circle Collider 2D, Sphere Collider其实是球形碰撞器，用于3D，而Circle Collider 2D才是圆形碰撞器，用于2D。

      3. 如果使用Sphere Collider，那么你需要将UI Root 下的Camera的UICamera 组件的Event Type属性设置为3D World或3D UI。另外，你需要调节Sphere Collider组件的Radius(半径)属性的大小，以适应图片的大小。

      4. 同样，如果使用Circle Collider 2D，那么你需要将UI Root 下的Camera的UICamera 组件的Event Type属性设置为2D World或2D UI。另外，你同样需要调节Circle Collider 2D组件的Radius(半径)属性的大小，以适应图片的大小。

     5. 根据以上分析，你的问题就应该在于没有正确设置Event Type或是Radius属性。

     6. 个人认为，矩形图片适合使用Box Collider或Box Collider 2D；

                       圆形图片适合使用Sphere Collider或者Circle Collider 2D；

                       不规则图片适合使用Polygon Collider 2D。