Unity Shader 入門 之三 讀取2D紋理貼圖

本篇在之前的基礎上創建一個可以添加紋理圖片的着色器

爲了便於閱讀,刪掉了前篇提到過的內容的註釋。沒有看過前篇的建議閱讀下

Shader "ShaderTutorial/BaseTexture" // 名稱改爲BaseTexture
{

	Properties
	{

		_BaseColor("BaseColor",Color) = (1,1,1,1)
		
		/*
		    定義一個2D紋理屬性,缺省狀態是一個白色的紋理
		*/
		_BaseMap("BaseMap",2D) = "White"{}

	}


	SubShader
	{
		Tags { "RenderType" = "Opaque" }
		LOD 100 

		Pass
		{

			CGPROGRAM 
			#pragma vertex vert 
			#pragma fragment frag 

			#include "UnityCG.cginc" 



			half4 _BaseColor;
			sampler2D _BaseMap; // 聲明2D紋理採樣器
			float4 _BaseMap_ST; // 紋理對應的縮放和偏移參數,xy爲縮放,zw爲偏移  格式:紋理名_ST; 


        	struct appdata
        	{
        		float4 positionOS : POSITION;
        
        		/*
        		語義TEXCOORD0,告訴GPU把頂點的第一套UV座標填入texcoord變量中,
        		*/
        		float2 texcoord:TEXCOORD0;
        	};
        
        
        	struct v2f
        	{
        		float4 positionCS : SV_POSITION;  
        
        		/*
        		這裏的語義TEXCOORD0,TEXCOORD1,TEXCOORD2等,
        		雖然和appdata中的名稱一樣,但是意義不同,
        		這裏是用來標記一個通用功能的向量,以便在光柵化中進行插值,
        		只是這裏剛好用來保存第一套頂點UV座標
        		*/
        		float2 texcoord:TEXCOORD0;
        	};
        
        
        	v2f vert(appdata v)
        	{
        		v2f o;
        
        
        		o.positionCS = UnityObjectToClipPos(v.positionOS);
        		
        		o.texcoord = TRANSFORM_TEX(v.texcoord, _BaseMap);
        		/*
        		上述函數TRANSFORM_TEX定義如下:
        		
        		// Transforms 2D UV by scale/bias property
        		#define TRANSFORM_TEX(tex,name) (tex.xy * name##_ST.xy + name##_ST.zw)
        
        		用來把頂點uv座標進行偏移縮放操作,等價於:
        		o.texcoord = v.texcoord.xy*_BaseMap_ST.xy+_BaseMap_ST.zw;
        		*/
        
        		return o;
        	}
        
        	half4 frag(v2f i) : SV_Target
        	{
        		/*
        			tex2D是紋理採樣函數,這裏是使用座標 i.texcoord 採樣紋理_BaseMap,
        			獲得texcoord處的顏色值
        		*/		
        		half4 baseColor = tex2D(_BaseMap, i.texcoord);
        
        		half4 col = half4 (_BaseColor.rgb*baseColor.rgb,1.0);
        		/*
        		把我們定義的變量類型_BaseColor.rgb乘以紋理採樣結果賦值給col,並返回。
        		*/
        		return col;
        	}
	        ENDCG 
        }
	}
}

上述着色器在Unity內部預覽如下:

在這裏插入圖片描述

這裏需要說明的是,我們使用的是一張帶有透明通道的圖片,但是我們的着色器是非透明着色器,因此紋理的預覽和材質球的預覽會不一致。紋理的邊緣會看到透明的效果,但材質不會。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章