-
C#教程之Unity shader实现百叶窗特效
本站最新发布 C#从入门到精通
试听地址 https://www.xin3721.com/eschool/CSharpxin3721/
试听地址 https://www.xin3721.com/eschool/CSharpxin3721/
本文实例为大家分享了Unity shader百叶窗展示的具体代码,供大家参考,具体内容如下
1.将图片划分为水平N栏,代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
|
Shader "Unlit/BYCShader" { Properties { [PerRendererData] _MainTex ( "Sprite Texture" , 2D) = "white" {} _Color ( "Tint" , Color) = (1,1,1,1) _StencilComp ( "Stencil Comparison" , Float) = 8 _Stencil ( "Stencil ID" , Float) = 0 _StencilOp ( "Stencil Operation" , Float) = 0 _StencilWriteMask ( "Stencil Write Mask" , Float) = 255 _StencilReadMask ( "Stencil Read Mask" , Float) = 255 _ColorMask ( "Color Mask" , Float) = 15 _Lan( "Lan" ,Float) = 10 [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ( "Use Alpha Clip" , Float) = 0 } SubShader { Tags { "Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent" "PreviewType" = "Plane" "CanUseSpriteAtlas" = "True" } Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } Cull Off Lighting Off ZWrite Off ZTest [unity_GUIZTestMode] Blend SrcAlpha OneMinusSrcAlpha ColorMask [_ColorMask] Pass { Name "Default" CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma target 2.0 #include "UnityCG.cginc" #include "UnityUI.cginc" #pragma multi_compile __ UNITY_UI_CLIP_RECT #pragma multi_compile __ UNITY_UI_ALPHACLIP struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; UNITY_VERTEX_INPUT_INSTANCE_ID }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; float2 texcoord : TEXCOORD0; float4 worldPosition : TEXCOORD1; UNITY_VERTEX_OUTPUT_STEREO }; v2f vert(appdata_t v) { v2f OUT; UNITY_SETUP_INSTANCE_ID(v); UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT); OUT.worldPosition = v.vertex; OUT.vertex = UnityObjectToClipPos(OUT.worldPosition); OUT.texcoord = v.texcoord; OUT.color = v.color; return OUT; } sampler2D _MainTex; float _Lan; float4 frag(v2f IN) : SV_Target { //從這裡開始 float2 uv = IN.texcoord; uv.x*= _Lan; uv.x = frac(uv.x); return float4(uv.xy,1.0,1.0); } ENDCG } } } |
如上图,划分为N栏后,对每一栏进行单独处理,即可做到每一栏都同时进行颜色消减。
2.对每一栏同时进行颜色消减(控制阈值可以通过c#代码实现)
代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
Shader "Unlit/BYCShader" { Properties { [PerRendererData] _MainTex ( "Sprite Texture" , 2D) = "white" {} _Color ( "Tint" , Color) = (1,1,1,1) _StencilComp ( "Stencil Comparison" , Float) = 8 _Stencil ( "Stencil ID" , Float) = 0 _StencilOp ( "Stencil Operation" , Float) = 0 _StencilWriteMask ( "Stencil Write Mask" , Float) = 255 _StencilReadMask ( "Stencil Read Mask" , Float) = 255 _ColorMask ( "Color Mask" , Float) = 15 _Lan( "Lan" ,Float) = 10 _StepX( "StepX" ,Range(0.0,1.0))=1.0 [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ( "Use Alpha Clip" , Float) = 0 } SubShader { Tags { "Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent" "PreviewType" = "Plane" "CanUseSpriteAtlas" = "True" } Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } Cull Off Lighting Off ZWrite Off ZTest [unity_GUIZTestMode] Blend SrcAlpha OneMinusSrcAlpha ColorMask [_ColorMask] Pass { Name "Default" CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma target 2.0 #include "UnityCG.cginc" #include "UnityUI.cginc" #pragma multi_compile __ UNITY_UI_CLIP_RECT #pragma multi_compile __ UNITY_UI_ALPHACLIP struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; UNITY_VERTEX_INPUT_INSTANCE_ID }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; float2 texcoord : TEXCOORD0; float4 worldPosition : TEXCOORD1; UNITY_VERTEX_OUTPUT_STEREO }; v2f vert(appdata_t v) { v2f OUT; UNITY_SETUP_INSTANCE_ID(v); UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT); OUT.worldPosition = v.vertex; OUT.vertex = UnityObjectToClipPos(OUT.worldPosition); OUT.texcoord = v.texcoord; OUT.color = v.color; return OUT; } sampler2D _MainTex; float _Lan; float _StepX; float4 frag(v2f IN) : SV_Target { float2 uv = IN.texcoord; uv.x*= _Lan; uv.x = frac(uv.x); //從這裡開始,顏色值大於指定值stepx的進行消減 int needDiscard = step(_StepX,uv.x); if (needDiscard == 1){ discard; } return float4(uv.xy,1.0,1.0); } ENDCG } } } |
效果如下:
3.加上切变,百叶窗在关闭打开时,是有透视变化的。用切变可以近似模拟透视,因为透视的实现代价很大,所以用切变。
添加一张图片,并进行切变
代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
|
Shader "Unlit/BYCShader" { Properties { [PerRendererData] _MainTex ( "Sprite Texture" , 2D) = "white" {} _Color ( "Tint" , Color) = (1,1,1,1) _StencilComp ( "Stencil Comparison" , Float) = 8 _Stencil ( "Stencil ID" , Float) = 0 _StencilOp ( "Stencil Operation" , Float) = 0 _StencilWriteMask ( "Stencil Write Mask" , Float) = 255 _StencilReadMask ( "Stencil Read Mask" , Float) = 255 _ColorMask ( "Color Mask" , Float) = 15 _Lan( "Lan" ,Float) = 10 _StepX( "StepX" ,Range(0.0,1.0))=1.0 [Toggle(UNITY_UI_ALPHACLIP)] _UseUIAlphaClip ( "Use Alpha Clip" , Float) = 0 } SubShader { Tags { "Queue" = "Transparent" "IgnoreProjector" = "True" "RenderType" = "Transparent" "PreviewType" = "Plane" "CanUseSpriteAtlas" = "True" } Stencil { Ref [_Stencil] Comp [_StencilComp] Pass [_StencilOp] ReadMask [_StencilReadMask] WriteMask [_StencilWriteMask] } Cull Off Lighting Off ZWrite Off ZTest [unity_GUIZTestMode] Blend SrcAlpha OneMinusSrcAlpha ColorMask [_ColorMask] Pass { Name "Default" CGPROGRAM #pragma vertex vert #pragma fragment frag #pragma target 2.0 #include "UnityCG.cginc" #include "UnityUI.cginc" #pragma multi_compile __ UNITY_UI_CLIP_RECT #pragma multi_compile __ UNITY_UI_ALPHACLIP struct appdata_t { float4 vertex : POSITION; float4 color : COLOR; float2 texcoord : TEXCOORD0; UNITY_VERTEX_INPUT_INSTANCE_ID }; struct v2f { float4 vertex : SV_POSITION; fixed4 color : COLOR; float2 texcoord : TEXCOORD0; float4 worldPosition : TEXCOORD1; UNITY_VERTEX_OUTPUT_STEREO }; v2f vert(appdata_t v) { v2f OUT; UNITY_SETUP_INSTANCE_ID(v); UNITY_INITIALIZE_VERTEX_OUTPUT_STEREO(OUT); OUT.worldPosition = v.vertex; OUT.vertex = UnityObjectToClipPos(OUT.worldPosition); OUT.texcoord = v.texcoord; OUT.color = v.color; return OUT; } sampler2D _MainTex; float _Lan; float _StepX; float4 frag(v2f IN) : SV_Target { //這裡進行裁剪 float2 uv = IN.texcoord; uv.x*= _Lan; uv.x = frac(uv.x); int needDiscard = step(_StepX,uv.x); if (needDiscard == 1){ discard; } //这里进行切变 float x1 = uv.x; uv = IN.texcoord; uv+=float2(-0.5,-0.5); uv.x-=x1; //切變時,先將重心調整到中心,然后绕每一栏的起点进行切变(这里类似于绕某一点旋转,所以后面要进行反向操作,加了就减,减了就加) float2x2 qiebian = float2x2(1,0,(1.0-_StepX),1); uv = mul(qiebian,uv); uv-=float2(-0.5,-0.5); uv.x+=x1; float4 color= tex2D(_MainTex, uv); return color; } ENDCG } } } |
效果如下:
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
栏目列表
最新更新
C# 面向对象
假设客车的座位数是9行4列,使用二维数
C#基于接口设计三层架构Unity篇
C#线程 入门
C#读取静态类常量属性和值
C# 插件式编程
C# 委托与事件有啥区别?
C#队列学习笔记:队列(Queue)和堆栈(Stack
linq 多表分组左连接查询查询统计
C#队列学习笔记:MSMQ入门一
C# 在Word中添加Latex 数学公式和符号
inncheck命令 – 检查语法
基于UDP的服务器端和客户端
再谈UDP和TCP
在socket编程中使用域名
网络数据传输时的大小端问题
socket编程实现文件传输功能
如何优雅地断开TCP连接?
图解TCP四次握手断开连接
详细分析TCP数据的传输过程
SqlServer 利用游标批量更新数据
BOS只读状态修改
SQL Server等待事件—PAGEIOLATCH_EX
数据库多行转换为单一列
获取数据表最后最后访问,修改,更新,
计算经历的时间
SQL查询结果自定义排序
修改数据库默认位置
日期简单加或减
从日期获取年,月或日