» cn.Tutorial Effects - Mr. Wiggle
This site relies heavily on Javascript. You should enable it if you want the full experience. Learn more.

cn.Tutorial Effects - Mr. Wiggle

English | Italian | Spanish | Japanese

TOC: Of Effects and Shaders
Back: Vertexshader Preparations
Next: Function Printing


让我们与著名的“抖动先生”的例子开始,通过正弦波扭曲网格:

网格上的每个顶点调用顶点着色器。正如你学过的那样here,顶点着色器的输入是储存在网格中的顶点,这些现在要用于处理:

vs2ps VS(
    float4 PosO  : POSITION,
    float4 TexCd : TEXCOORD0)
{
...
}

这里我们的兴趣点转移到 PosO向量,它是当前顶点的位置。我们要根据它的垂直位置(y坐标)来决定x坐标的偏移:

PosO.x += sin(PosO.y);

为了控制抖动的波浪,我们添加了一些参数:

PosO.x += sin(PosO.y * Frequency + Phase) * Amplitude;

那么顶点着色器和它的输入参数像这样:

float Frequency = 10;
float Phase = 0;
float Amplitude = 0.01;
 
vs2ps VS(
    float4 PosO  : POSITION,
    float4 TexCd : TEXCOORD0)
{
    //declare output struct
    vs2ps Out;
 
    //offset x coordinate
    PosO.x += sin(PosO.y * Frequency + Phase) * Amplitude;
 
    //transform position
    Out.Pos = mul(PosO, tWVP);
 
    //transform texturecoordinates
    Out.TexCd = mul(TexCd, tTex);
 
    return Out;
}

相应的程序片如下:

mr wiggle patch

Next: Function Printing
Back: Vertexshader Preparations
TOC: Of Effects and Shaders

anonymous user login

Shoutbox

~18h ago

joreg: Workshop on 09 05: Deepdive into the Stride 3D Engine. Signup here: https://thenodeinstitute.org/courses/ss24-vvvv-advanced-3d-rendering-in-vvvv-with-stride/

~20h ago

tekcor: Dear vvvv community, I am leaving my personal fundraiser here because I know many of you personally, sending love https://t.ly/iV9l_

~2d ago

joreg: Rewatch the 24th vvvvorldwide meetup here: https://www.youtube.com/live/gNszIiRAjDo?si=0RXF0pW73EUaRqGk

~2d ago

joreg: LINK - the vvvv summer camp 2024 is announced: https://visualprogramming.net/blog/2024/link-the-vvvv-summer-camp-24/

~4d ago

joreg: Tonight, May 3, vvvv meetup in Berlin or via stream: https://visualprogramming.net/blog/2024/24.-vvvv-worldwide-meetup/

~7d ago

joreg: Workshop on 02 05: Intro to the Stride 3D Engine. Signup here: https://thenodeinstitute.org/courses/ss24-vvvv-intro-to-the-stride-3d-engine-in-vvvv/

~8d ago

joreg: The new vvvv Show-Off-Reel is out: https://vimeo.com/930568091

~14d ago

joreg: The summer season of vvvv workshops at The NODE Institute is out: https://thenodeinstitute.org/ss24-vvvv-intermediates/