Shader实例(二)色彩融合之地球仪

发表于2018-04-14
评论0 944浏览
上篇文章给大家介绍了UV动画,结合UV动画下面我们来实现控制白云的颜色并与地球的材质融合,形成一个带有白云的地球仪效果,实现原理包含在了代码当中。

Shader "Custom/my1" {
 Properties {
  _MainTex ("Base (RGB)", 2D) = "white" {}
  _Cloud("_Cloud", 2D) = "white" {}
 }
 SubShader {
  Tags{"Queue" = "Transparent" "RenderType"="Transparent"}
  AlphaTest Greater 0.1
  Pass{
   // 使用Vertex and Fragment Shader可编程渲染管线
   CGPROGRAM
   #pragma vertex vert
   #pragma fragment frag
   // 为了引入系统自带的结构体appdata_base
   #include "UnityCG.cginc"
   // 声明参数
   float4 _Color;
   sampler2D _MainTex;
   sampler2D _Cloud;
   // 获取地球材质的纹理坐标
   float4 _MainTex_ST;
   // 定义输出结构体
   struct v2f{
    float4 pos : SV_POSITION; // 视口位置
    float2 uv : TEXCOORD0;  // 贴图纹理坐标
   };
   // 操作顶点  
   v2f vert(appdata_base v)
   {
    v2f o;
    // UNITY_MATRIX_MVP
    // model    从本地坐标 到 世界坐标
    // view     从世界坐标到相机坐标
    // projection 从相机坐标到屏幕空间
    // 使用mul转化为投影坐标pos
    o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
    // 用于带材质的写法,获取纹理坐标
    o.uv = TRANSFORM_TEX(v.texcoord, _MainTex);
    return o;
   }
   half4 frag(v2f i) : COLOR
   {
    // 移动地球材质的x
    float u_x = i.uv.x + -2 * _Time;
    float2 uv_earth = float2(u_x, i.uv.y);
    half4 texcolor_earth  = tex2D(_MainTex,uv_earth);
    // 移动白云材质的x
    u_x = i.uv.x + -4 *_Time;
    float2 uv_cloud = float2(u_x, i.uv.y);
    half4 tex_cloudDepth = tex2D(_Cloud, uv_cloud);
    // 白色透明的点 * 包含cloud纹理的R通道的色值 = 带纹理的黑白点(RGB值一样,且值为x)
    // 因为A是0,所以其实这里白云是不可见的
    // 写法等同于float4(tex_cloudDepth.x,tex_cloudDepth.x,tex_cloudDepth.x, 0 * tex_cloudDepth.x);
    half4 texcolor_cloud = float4(1,1,1,0) * (tex_cloudDepth.x);
    // 地球与白云的纹理混合,很显然包括A通道,所以才能看到白云。
    return lerp(texcolor_earth,texcolor_cloud,0.5f);
   }
   ENDCG
  }
 }
}
效果图:

如社区发表内容存在侵权行为,您可以点击这里查看侵权投诉指引