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

编程入门 行业动态 更新时间:2024-10-17 20:23:11

shader实例(二)色彩融合之<a href=https://www.elefans.com/category/jswz/34/508740.html style=地球仪"/>

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

结合前面的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
  }
 }
}

更多推荐

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

本文发布于:2024-02-26 21:46:19,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1704047.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:地球仪   实例   色彩   shader

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!