Unity压缩图片

UI作UI的时候，会考虑到图片的大小问题。 会适当的选择UITexture或者UISprite还实现。

问题来了，也就是说：何时用图集？ 何时用texture？ 如何压缩他们的图片？

下面是4中shader，各位保存一下，放到项目里吧！

1. 正常shader

Shader "Unlit/Transparent UIETC"
{
Properties
{
_MainTex ("Base (RGB)", 2D) = "white" { }
_AlphaTex("AlphaTex",2D) = "white"{}
}
SubShader
{

Tags
{
"Queue" = "Transparent+1"
}
Pass
{
Lighting Off
ZTest Off
ZWrite Off
Fog { Mode Off }
Blend SrcAlpha OneMinusSrcAlpha
Cull Off

CGPROGRAM
#pragma vertex vert
#pragma fragment frag

#include "UnityCG.cginc"

sampler2D _MainTex;
sampler2D _AlphaTex;

float _AlphaFactor;

struct v2f
{
float4  pos : SV_POSITION;
float2  uv : TEXCOORD0;
float4 color :COLOR;
};

half4 _MainTex_ST;
half4 _AlphaTex_ST;

v2f vert (appdata_full v)
{
v2f o;
o.pos = mul (UNITY_MATRIX_MVP, v.vertex);
o.uv =  v.texcoord;
o.color = v.color;

return o;
}

half4 frag (v2f i) : COLOR
{
// mul vertex color
half4 texcol = tex2D (_MainTex, i.uv) * i.color;

// get alpha channal
texcol.a = tex2D(_AlphaTex,i.uv)*i.color.a;

return texcol;
}
ENDCG
}
}
}

2.可以置灰的shader

public static void graySprite(UISprite sp, bool value) // 下面shader这样使用

{

sp.color = value ? Color.white : Color.black;

}

Shader "Unlit/Transparent UIETCGray"
{
Properties
{
_MainTex ("Base (RGB)", 2D) = "white" { }
_AlphaTex("AlphaTex",2D) = "white"{}
}
SubShader
{

Tags
{
"Queue" = "Transparent+1"
}
Pass
{
Lighting Off
ZTest Off
Blend SrcAlpha OneMinusSrcAlpha
Cull Off
CGPROGRAM
#pragma vertex vert
#pragma fragment frag

#include "UnityCG.cginc"

sampler2D _MainTex;
sampler2D _AlphaTex;

float _AlphaFactor;

struct v2f
{
float4  pos : SV_POSITION;
float2  uv : TEXCOORD0;
float4 color :COLOR;
};

half4 _MainTex_ST;
half4 _AlphaTex_ST;

v2f vert (appdata_full v)
{
v2f o;
o.pos = mul (UNITY_MATRIX_MVP, v.vertex);
o.uv =  v.texcoord;
o.color = v.color;
return o;
}

half4 frag (v2f i) : COLOR
{
half4 texcol = tex2D (_MainTex, i.uv);

// Just consider gray
float3 gray = dot(texcol.rgb , float3(0.299, 0.587, 0.114));
texcol.rgb = lerp(texcol.rgb, gray.rgb, (1-i.color.r));

// get alpha
texcol.a = tex2D(_AlphaTex,i.uv)*i.color.a ;

return texcol;
}
ENDCG
}
}
}

3. 我没用到过

Shader "Unlit/Transparent UIETCGray (AlphaClip)"
{
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
AlphaTest Off
Fog { Mode Off }
Offset -1, -1
ColorMask RGB
Blend SrcAlpha OneMinusSrcAlpha

CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"

sampler2D _MainTex;
sampler2D _AlphaTex;

float4 _MainTex_ST;
half4 _AlphaTex_ST;

struct appdata_t
{
float4 vertex : POSITION;
half4 color : COLOR;
float2 texcoord : TEXCOORD0;
};

struct v2f
{
float4 vertex : POSITION;
half4 color : COLOR;
float2 texcoord : TEXCOORD0;
float2 worldPos : TEXCOORD1;
};

v2f vert (appdata_t v)
{
v2f o;
o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
o.color = v.color;
o.texcoord = v.texcoord;
o.worldPos = TRANSFORM_TEX(v.vertex.xy, _MainTex);
return o;
}

half4 frag (v2f IN) : COLOR
{
// Sample the texture
half4 col = tex2D(_MainTex, IN.texcoord);

// get alpha channal
col.a = tex2D(_AlphaTex,IN.texcoord);

float2 factor = abs(IN.worldPos);
float val = 1.0 - max(factor.x, factor.y);

if (val >=0.0)
{
float3 gray = dot(col.rgb , float3(0.299, 0.587, 0.114));
col.rgb = lerp(col.rgb,gray.rgb,(1-IN.color.r));
col = col * IN.color.a;
}
else
{
col = half4(0.0, 0.0, 0.0, 0.0);
}
return col;
}
ENDCG
}
}

SubShader
{
LOD 100

Tags
{
"Queue" = "Transparent"
"IgnoreProjector" = "True"
"RenderType" = "Transparent"
}

Pass
{
Cull Off
Lighting Off
ZWrite Off
AlphaTest Off
Fog { Mode Off }
Offset -1, -1
ColorMask RGB
Blend SrcAlpha OneMinusSrcAlpha
ColorMaterial AmbientAndDiffuse

SetTexture [_MainTex]
{
Combine Texture * Primary
}
}
}
}

4.

Shader "Unlit/Transparent UIETCGray (SoftClip)"
{
Properties
{
_MainTex ("Base (RGB), Alpha (A)", 2D) = "black" {}
_AlphaTex("AlphaTex",2D) = "white"{}
}

SubShader
{
LOD 200

Tags
{
"Queue" = "Transparent"
"IgnoreProjector" = "True"
"RenderType" = "Transparent"
}

Pass
{
Cull Off
Lighting Off
ZWrite Off
AlphaTest Off
Fog { Mode Off }
Offset -1, -1
ColorMask RGB
Blend SrcAlpha OneMinusSrcAlpha

CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "UnityCG.cginc"

sampler2D _MainTex;
sampler2D _AlphaTex;

float4 _MainTex_ST;
half4 _AlphaTex_ST;

float2 _ClipSharpness = float2(20.0, 20.0);

struct appdata_t
{
float4 vertex : POSITION;
half4 color : COLOR;
float2 texcoord : TEXCOORD0;
};

struct v2f
{
float4 vertex : POSITION;
half4 color : COLOR;
float2 texcoord : TEXCOORD0;
float2 worldPos : TEXCOORD1;
};

v2f vert (appdata_t v)
{
v2f o;
o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
o.color = v.color;
o.texcoord = v.texcoord;
o.worldPos = TRANSFORM_TEX(v.vertex.xy, _MainTex);
return o;
}

half4 frag (v2f IN) : COLOR
{
// Softness factor
float2 factor = (float2(1.0, 1.0) - abs(IN.worldPos)) * _ClipSharpness;

// Sample the texture
half4 col = tex2D(_MainTex, IN.texcoord);

// get alpha channal
col.a = tex2D(_AlphaTex,IN.texcoord);

float fade = clamp( min(factor.x, factor.y), 0.0, 1.0);
col.a *= fade;
col.rgb = lerp(half3(0.0, 0.0, 0.0), col.rgb, fade);

// Grayscale the texture
float3 gray = dot(col.rgb , float3(0.299, 0.587, 0.114));
col.rgb = lerp(col.rgb,gray.rgb,(1-IN.color.r));
col = col * IN.color.a;
return col;
}
ENDCG
}
}

SubShader
{
LOD 100

Tags
{
"Queue" = "Transparent"
"IgnoreProjector" = "True"
"RenderType" = "Transparent"
}

Pass
{
Cull Off
Lighting Off
ZWrite Off
AlphaTest Off
Fog { Mode Off }
Offset -1, -1
ColorMask RGB
Blend SrcAlpha OneMinusSrcAlpha
ColorMaterial AmbientAndDiffuse

SetTexture [_MainTex]
{
Combine Texture * Primary
}
}
}
}

下面开始讲解怎么压缩图片了！

Altas为了例子

1. 用PlayMaker打包图片，制作图集， 同时生成 “.ext” 文本 + “.ga”图片。

2. “”.tga“”图片，交给美术，生成俩个图片。 "bag.bmp" 和 “bag_alpha.bmp”

至于专业解释着俩个图片都是什么图片，暂时没研究过，相信专业美术一眼就会明白了！

效果图如下：



3. 如果设置图片类型





4. 新建材质球：



OK ，图集压缩成功了！

至于图片看你需求，如果需要压缩就压缩，

图集也是一样，不需要压缩的就直接都nGUI自己带的shader就好了。

不过用上面的方法压缩图片，我试过了，能j减少80% 。 1个1024*1024的图片，也就500Kb

如果有疑问，欢迎留言探讨