Unity3dがUGUI.TextのUVフロー効果を実装する方法

1.シンプルなテキスト+テクスチャ効果を実現します

最初の効果は次のとおりです。
ここに画像の説明を挿入

原理:

UGUIのテキストと画像自体がマテリアルをサポートし、PositionAsUVコンポーネントを追加し、テキストにUVの変化を認識させてから、マテリアルにマップを追加するだけです。

  • 1.テキストテキストボックスを作成し、適切なサイズを調整して、テストテキストを入力します
    ここに画像の説明を挿入

  • 2.Position As UV1コンポーネントを追加し、コンポーネントを追加するよりもテキストに資料を追加します
    ここに画像の説明を挿入

  • 3.マテリアルマテリアルを作成し、シェーダーをアタッチします。UI/Unlit/Text Detail
    ここに画像の説明を挿入

  • 4.テキストのMaterialプロパティにマテリアルを割り当てます。

  • 5.詳細(RGB)マップをマテリアルに追加し、カスタマイズします

  • 6. Canvasの追加のシェーダーチャネルを設定し、TexCoord1を選択します
    ここに画像の説明を挿入

テキストのサイズを変更すると、テクスチャのUVが変化することがわかります。これらは、テキスト内のフォントの位置に応じてUV座標を変更するPositionAsUV1コンポーネントの機能です。
ここに画像の説明を挿入

2.Text+テクスチャグレアの流れを実現します

原理

原則は上記と同じですが、システムのTextDetail.shader
関数をわずかに変更して以下を追加します。

  • 1.NoiseTexノイズ摂動グラフを追加します。
  • 2. Timeを使用して、NoiseTexのUVを変更し、それをDetialTexに渡して、画像のUVをフローさせます。
    効果は次のとおりです。
    ここに画像の説明を挿入

シェーダーコードは次のとおりです。

// Upgrade NOTE: replaced 'mul(UNITY_MATRIX_MVP,*)' with 'UnityObjectToClipPos(*)'

Shader "UI/Unlit/Custom Text Detail"
{
    
    
	Properties
	{
    
    
	    [PerRendererData]
		_MainTex ("Alpha (A)", 2D) = "white" {
    
    }
		[PerRendererData]
		_Color ("Main Color", Color) = (1,1,1,1)
		
		
		_DetailTex ("Detail (RGB)", 2D) = "white" {
    
    }
		_detail_panner_u ("tex01_panner_u", Float ) = 0
        _detail_panner_v ("tex01_panner_v", Float ) = 0
		_detail_strong ("tex01_strong", Range(0.0, 1.0)) = 1
		
		_NoiseTex ("Noise (R)", 2D) = "white" {
    
    }
        _noise_strong ("tex02_strong", Float ) = 1
        _noise_panner_u ("tex02_panner_u", Float ) = 0
        _noise_panner_v ("tex02_panner_v", Float ) = 0
        
        _flow_color("flow_color", Color) = (1,1,1,1)
        _flow_strong("flow_strong", Float) = 1
        
		[hideinInspector]
		_StencilComp ("Stencil Comparison", Float) = 8
		[hideinInspector]
		_Stencil ("Stencil ID", Float) = 0
		[hideinInspector]
		_StencilOp ("Stencil Operation", Float) = 0
		[hideinInspector]
		_StencilWriteMask ("Stencil Write Mask", Float) = 255
		[hideinInspector]
		_StencilReadMask ("Stencil Read Mask", Float) = 255
        [hideinInspector]
		_ColorMask ("Color Mask", Float) = 15
	}

	SubShader
	{
    
    
		LOD 200

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

		Stencil
		{
    
    
			Ref [_Stencil]
			Comp [_StencilComp]
			Pass [_StencilOp] 
			ReadMask [_StencilReadMask]
			WriteMask [_StencilWriteMask]
		}

		Cull Off
		Lighting Off
		ZWrite Off
		ZTest [unity_GUIZTestMode]
		Offset -1, -1
		Blend one OneMinusSrcAlpha
		ColorMask [_ColorMask]

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

				struct appdata_t
				{
    
    
					float4 vertex : POSITION;
					float2 texcoord : TEXCOORD0;
					float2 texcoord2 : TEXCOORD1;
					fixed4 color : COLOR;
				};

				struct v2f
				{
    
    
					float4 vertex : POSITION;
					float2 texcoord : TEXCOORD0;
					float2 texcoord2 : TEXCOORD1;
					fixed4 color : COLOR;
				};

				sampler2D _MainTex;
				sampler2D _DetailTex;
				sampler2D _NoiseTex; 
				
				float4 _MainTex_ST;
				float4 _DetailTex_ST;
				float4 _NoiseTex_ST;

				float4 _DetailTex_TexelSize;
				fixed4 _Color;
				fixed _detail_strong;
                fixed _noise_strong;
                fixed _detail_panner_u;
                fixed _detail_panner_v;
                fixed _noise_panner_u;
                fixed _noise_panner_v;
                fixed4 _flow_color;
                fixed _flow_strong;
                        
				v2f vert (appdata_t v)
				{
    
    
					v2f o;
					o.vertex = UnityObjectToClipPos(v.vertex);
					o.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);
					o.texcoord2 = TRANSFORM_TEX(v.texcoord2 * _DetailTex_TexelSize.xy, _DetailTex);
					o.color = v.color;
					return o;
				}

				half4 frag (v2f i) : COLOR
				{
    
    
					half4 col = i.color*_Color;
					
                    float2 dist_uv = i.texcoord2+(_Time.g*float2(_noise_panner_u,_noise_panner_u));
                    float4 noise = tex2D(_NoiseTex,TRANSFORM_TEX(dist_uv, _NoiseTex));
                
                    float2 detail_uv = i.texcoord2+_Time.g*float2(_detail_panner_u,_detail_panner_v)+noise.r*_noise_strong;
					fixed4 detail = tex2D(_DetailTex, detail_uv) + noise.r*_flow_color*_flow_strong;
                    					
					col.rgb = lerp(col.rgb, col.rgb * detail.rgb, detail.a * _detail_strong);
					col.a *= tex2D(_MainTex, i.texcoord).a;

					clip (col.a - 0.01);
					return col;
				}
			ENDCG
		}
	}
}

さて、この記事はここにあります、私はそれがあなたに役立つことを願っています

おすすめ

転載: blog.csdn.net/qq563129582/article/details/122262414