Vertex Shader几何变换---波

最新推荐文章于 2025-02-18 03:09:50 发布
转载 最新推荐文章于 2025-02-18 03:09:50 发布 · 402 阅读 · 2

本文介绍如何使用Unity Shader实现不同类型的波浪效果，包括基本的上下波动、振幅变化、颜色灰度值、Z方向波形、快速移动波、圆形波及水波等，并逐步演示如何调整参数以获得所需效果。

1、上下波动，但是是所有的点都跟着一起波动

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};

		v2f vert(appdata_base v) {
			v.vertex.y += sin(_Time.y+_Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(0, 1, 1, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}








2、修改时间因子，引起振幅的变化


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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		a
		v2f vert(appdata_base v) {
			v.vertex.y += 0.3*sin(v.vertex.x+_Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(0, 1, 1, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}



3、颜色产生灰度值


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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
			v2f vert(appdata_base v) {
			v.vertex.y += 0.3*sin(v.vertex.x + _Time.y);
a
			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}



4、改为在z方向上的波形

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			v.vertex.y += 0.2*sin(v.vertex.z*2 + _Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}




5、修改Time的z值，让波移动地更快一点


6、圆形波

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			v.vertex.y += 0.2*sin(length(v.vertex.xz)*2 + _Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}




但是刚才的波是从外向内的，要形成从内向外的波，需要对length取反


取消相乘，波会从圆心开始扩散

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			v.vertex.y += 0.2*sin(-length(v.vertex.xz) + _Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}




7、水波

①横向波

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			//v.vertex.y += 0.2*sin(-length(v.vertex.xz) + _Time.y);
			v.vertex.y += 0.2*sin(v.vertex.x*2 + _Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}


②将x和z方向的和作为角速率，得到斜方向上同频率的波

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			//v.vertex.y += 0.2*sin(-length(v.vertex.xz) + _Time.y);
			v.vertex.y += 0.2*sin((v.vertex.x+v.vertex.z)*2 + _Time.y);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}




③取消乘2，波与波之间的棱角变得平滑


④多个正弦实现此起彼伏的波形效果

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

Shader "Custom/wave" {


	SubShader{
		pass {
		CGPROGRAM
#pragma vertex vert
#pragma fragment frag
#include "unitycg.cginc"

			struct v2f {
			float4 pos:POSITION;
			fixed4 color : COLOR;
		};
		
		v2f vert(appdata_base v) {
			//v.vertex.y += 0.2*sin(-length(v.vertex.xz) + _Time.y);
			v.vertex.y += 0.2*sin((v.vertex.x+v.vertex.z) + _Time.y);
			v.vertex.y += 0.3*sin((v.vertex.x + v.vertex.z) + _Time.w);

			v2f o;
			o.pos = mul(UNITY_MATRIX_MVP,v.vertex);
			o.color = fixed4(v.vertex.y, v.vertex.y, v.vertex.y, 1);
			return o;
		}


		fixed4 frag(v2f IN) :COLOR{
			return IN.color;
		}
			ENDCG
	}
	}

}






着色器（Vertex Shader）基础
千里小马哥的博客
09-22 688
顶点着色器处理顶点并告知它们在“剪辑空间”中的坐标，该空间使计算机可以轻松了解哪些顶点对摄像机可见，哪些顶点不可见，必须剪切或“剪切”掉。这使得 GPU 在后期阶段的速度更快，因为它们需要处理的数据较少。它们通过接收来自顶点列表中的单个顶点作为输入来执行此过程，并返回一个结果，该结果确定顶点在裁剪空间中应存在的位置。由于此着色器在传递给 GPU 管道的所有顶点上按顶点执行，因此可以在此着色器中执行任何需要修改顶点的操作，只要最终输出是顶点在剪辑空间中的位置。
Cg入门11：Vertex Shader - 几何变换 —MVP矩阵变换（旋转、缩放）
weixin_34391854的博客
08-17 177
旋转、缩放demoC# Code：Shader Code:
Vertex Shader
热门推荐
MyArrow的专栏
07-25 1万+
一、Vertex Shader简介        前面一直有出现Vertex Shader，但Vertex Shader一直犹抱琵琶半遮面的感觉，本文将彻底揭开其面纱，看个清清楚楚、明明白折，以满足自己的好奇心。Vertex Shader在OpenGL ES 2.0的管道中的位置如下图所示：        本节将描述以下内容：        1）Vertex Shader的输入和输出
ffmpeg入门小结（三）—— 傅里叶变换之美
ShaderJoy 的兴趣技术杂货铺
09-28 2956
ffmpeg入门（三）—— 傅里叶变换之美
VertexShader入门
weixin_34335458的博客
08-13 525
Shader与固定管线 顶点着色（Vertex Shader）是一段执行在GPU上的程序（一般用HLSL来编写），用来取代fixed pipeline中的transformation和lighting，Vertex Shader主要操作顶点。 有图则一目了然。 Vertex Shader做了什么工作 由上图知，Vertex Shader对输入顶点完成了从local space到h...
Vertex Shader中的几何变换
Kiboo的博客
12-27 1176
本文给大家介绍几个Vertex Shader中常用的几何变换如果是刚开始接触几何变换内容学起来是比较吃力的！这种思维需要不断的磨合、锻炼对于Shader几何变换我总结成了4个字：并行、时差并行：渲染管线是一系列并行的渲然流水线。通俗来说，每个顶点的计算是同时的。时差：每个顶点会不断的计算（包括颜色、位置等等）。总而言之：并行是指全部顶点同时计算，时差是指每个顶点不断的计算。接下来介绍下几个常用的几
vertex-shader-program-matlab.rar_SHADER_matlab vertex_color
09-24
在图形渲染领域，Shader是一种非常重要的技术，它用于控制计算机屏幕上像素或顶点的外观。...通过学习和分析这个程序，用户可以深入理解图形学的基本原理，并掌握如何在MATLAB中实现复杂的几何变换和色彩效果。
VertexShader深入探讨
02-22
在“08_VertexShader深入”这个文件中，可能包含了具体的代码示例和步骤，详细解释了如何使用HLSL编写顶点着色器，涵盖上述各种功能。通过学习这些实例，开发者可以掌握如何在实际项目中应用顶点着色器，创造出更...
shadertoy-magic-cube:里面有Minecraft场景的魔方。 GLSL
04-11
这个平台上包含了各种各样的视觉实验，从基础的几何变换到高级的物理模拟和算法艺术。 **“shadertoy-magic-cube”**项目是Shadertoy上的一个作品，它呈现了一个Minecraft风格的魔方场景。在该项目中，魔方的每个面...
HelloOpenGL编译 Vertex shader 和 Fragment shader
04-13
本教程将详细讲解如何在OpenGL中编译和使用Vertex Shader（顶点着色器）与Fragment Shader（片段着色器）。这两个着色器是现代图形编程的核心组件，它们允许程序员在GPU（图形处理单元）上直接处理渲染过程，从而...
Android显示系统（04）- OpenGL ES - Shader绘制三角形
Ziwubiancheng的博客
12-04 1752
在现代的图形渲染中，通常会使用两种主要类型的着色器：顶点着色器（Vertex Shader）和片元着色器（Fragment Shader）。这两种着色器分别负责处理图形的顶点数据和片元（像素）数据，通过编写这些着色器程序，开发人员可以实现各种复杂的图形效果和渲染技术。顶点着色器顶点着色器用于处理图形的顶点数据，如位置、颜色、法线等。主要作用包括对顶点位置的变换（如模型变换、视图变换、投影变换）、法线变换、顶点着色等。顶点着色器的输出通常是裁剪空间坐标或者屏幕空间坐标。片元着色器。
Vertex Shader 结构
Nicholas黎的专栏
11-13 2782
     
Vertex Shader & Pixel Shader 介绍
lion1978的专栏
01-16 5434
 Vertex Shader & Pixel Shader  介绍 1.         固定功能的图形处理流水线（fixed function graphics pipeline）能够实现Vertex Shader和Pixel Shader的显卡的图形处理流水线被称作为是可编程的，相对而言，在此之前的图形处理流水线被称作为是固定功能（fixed function）,下面是Open
顶点着色器 Vertext Shader
最新发布
欢迎来到《技术探索》，这是一个专注于游戏开发技术的博客。在这里，我们将深入探讨游戏引擎、图形渲染、人工智能、物理模拟等领域的最新技术和最佳实践。无论您是初学者还是经验丰富的开发者，我们都希望为您提供有价值的见解和实用的技巧。
02-18 1119
顶点着色器是图形渲染管线中的关键组件，负责处理和变换顶点数据。它的可编程性使得开发者能够灵活地控制渲染过程，优化性能和视觉效果。理解顶点着色器的工作原理和功能对于图形编程和游戏开发至关重要。接下来，我们将深入探讨顶点着色器的更多细节，包括其编程模型、常见的应用场景、性能优化技巧以及与其他着色器的关系。顶点着色器是图形渲染管线中的关键组件，负责处理和变换顶点数据。通过理解顶点着色器的工作原理、应用场景和优化技巧，开发者可以更有效地利用GPU的并行计算能力，提升图形应用的性能和视觉效果。
unityshader自己学习笔记--vertex shader--1.顶点数据的输入输出
m0_69722751的博客
04-18 375
而且，从顶点到线段的过程中，所需要的数据是无法确定的，所以没有v2f的模板，但是模型到顶点的模板是有的。而且下面即使没有导入该结构体，只要有相关语义，就可以。可以将objPos的语义改成任何没有重复的语义比如。但是这样写不是很优雅，此时，我们就可以用到结构体。要注意的是，如果选择return，那么必须带。如果想返回多个数据，比如我想将模型坐标输出。没有使用和初始化的参数，它自己会有默认值。此时不能简单的写成下面的样子。因为使用了相同的语义。，所以无法正常使用了。而且可以给结构体别名。
课时27 Vertex Shader - 顶点数据的输入与输出 1
a592733740的博客
09-23 769
课时27 Vertex Shader - 顶点数据的输入与输出 1 1.一个函数有多个重复语义输出会报错，如果需要多输出的话，除了POSITION和COLOR，float2格式的TEXCOORD系列也可以。 2.POSITION语义的向量，第四个分量不能为0。 3.语义是为了方便函数间传递信息，函数内部可以对不同语义但相同类型的变量进行操作。 课时28 Vertex Shader...
修改时间（年月日时分）
今天明天的博客
05-15 513
public static void main(String[] args) throws ParseException { SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); Calendar nowTime = Calendar.getInstance(); nowTime.add(Cal...
WordPress加时间因子方法，WordPress加时间因子源码
woaisjm的专栏
06-16 535
本次分享的代码只会在文章和页面中添加时间因子，如果有其他需要，可以在此基础上进行修改。1、方法一编辑主题的header.php文件，在标签前面添加以下代码：
光波导的概念及平面介质光波导中光的传播
weixin_43991537的博客
01-14 3851
提示：本文章为慕课学习笔记，仅供个人学习使用，转载请申明出处 文章目录光波导的概念重点学习主要概念平面介质光波导中光的传播推导合成波结论 光波导的概念 重点学习 平面光波导 光纤 主要概念 光源–接收器之间的桥梁，约束并导引广播在其内部或其表面附近沿轴向传输。 要求：衰减尽可能小，尽可能不失真 项目 Value 实用性 传统光学传输介质 空气，透镜棱镜，光栅等光路，但长距离时散射、反射大 无利用价值 气体透镜 圆管内充入空气，温度梯度构成气体透镜（温度高密度小折射率小，在管子外
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值