《Unity着色器圣经》4.1.5. | Step and Smoothstep function.

目录索引

译文

Step和smoothstep是非常相似的函数，事实上，它们都有一个名为“edge”的参数，负责区分两个值之间的返回值。

我们将从step开始学习，然后学习smoothstep，它比前一个更为复杂。

根据NVIDIA的官方文件；

The syntax is as follows:

float step (float x, float edge)
{
    return edge >= x;
}

float2 step (float2 x, float2 edge);
float3 step (float3 x, float3 edge);
float4 step (float4 x, float4 edge);

以前面的语句为例，我们可以在片段着色器阶段执行一个简单的操作，以了解它是如何工作的。

fixed4 frag (v2f i) : SV_Target
{
    // add the color edge
    float edge = 0.5;
    // let’s return to RGB color
    fixed3 sstep = 0;
    sstep = step (i.uv.y, edge);

    // fixed4 col = tex2D (_MainTex, i.uv);

    return fixed4(sstep, 1);
}

在上面的运算中，我们首先声明了一个称为“sstep”的三维向量。你可以在图4.1.5a中看到它的图形表示。作为一个参数，我们使用了UV的V坐标和0.5作为“edge”。最后，我们返回了颜色值,其中RGB来自sstep和alpha为1。

值得记住的是，U和V坐标都从0.0f开始，到1.0f结束；因此，所有小于或等于edge的值都将返回“1”（白色），而在相反的情况下返回“0”（黑色）。如果我们修改这些值之间的参数“eage”，上图黑白界线会移动。smoothstep函数的行为与前一个没有太大区别；其唯一的区别在于在返回值之间生成线性插值。

其语法如下：

float smoothstep (float a, float b, float edge)
{
    float t = saturate((edge - a) / (b - a));
    return t * t * (3.0 - (2.0 * t));
}

float2 smoothstep (float2 a, float2 b, float2 edge)
float3 smoothstep (float3 a, float3 b, float3 edge)
float4 smoothstep (float4 a, float4 b, float4 edge)

回到片段着色器阶段的操作，我们可以添加一个新的变量来确定返回值之间的插值量。

fixed4 frag (v2f i) : SV_Target
{
    // add the edge
    float edge = 0.5;
    // add the amount of interpolation
    float smooth = 0.1;
    // add the return value in RGB
    fixed3 sstep = 0;
    // sstep = step (i.uv.y, edge);
    sstep = smoothstep((i.uv.y - smooth), (i.uv.y + smooth), edge);

    // fixed4 col = tex2D (_MainTex, i.uv);

    return fixed4(sstep, 1);
}

在前面的练习中，我们可以在0.0f和0.5f之间修改“smooth”的值，以获得不同级别的插值。

---

原文对照

Step and smoothstep are quite similar functions, in fact, both have an argument called “edge” in charge of differentiating the return between two values.

We will begin our study in the compression of step to then approach the operation of smoothstep, which has a more elaborate structure than the previous one.

According to the official documentation at NVIDIA;

The syntax is as follows:

float step (float x, float edge)
{
    return edge >= x;
}

float2 step (float2 x, float2 edge);
float3 step (float3 x, float3 edge);
float4 step (float4 x, float4 edge);

Exemplifying the previous statement, we can perform a simple operation on the fragment shader stage to understand how it works.

fixed4 frag (v2f i) : SV_Target
{
    // add the color edge
    float edge = 0.5;
    // let’s return to RGB color
    fixed3 sstep = 0;
    sstep = step (i.uv.y, edge);

    // fixed4 col = tex2D (_MainTex, i.uv);

    return fixed4(sstep, 1);
}

We started by declaring a three-dimensional vector called “sstep” in the above operation. You can see its graphical representation in Figure 4.1.5a. As an argument, we have used the V coordinate of the UV and 0.5 as “edge.” Finally, we have returned sstep in RGB and “one” for the alpha channel.

It is worth remembering that both the U and V coordinates start at 0.0f and end at 1.0f; therefore, all those less than or equal to the edge will return “one” (white color) and “zero” in the opposite case (black color). If we modify the argument “edge” between these values, it could be balanced to one side or the other.

The behavior of the smoothstep function is not very different from the previous one; its only difference lies in the generation of a linear interpolation between the return values.

Its syntax is as follows:

float smoothstep (float a, float b, float edge)
{
    float t = saturate((edge - a) / (b - a));
    return t * t * (3.0 - (2.0 * t));
}

float2 smoothstep (float2 a, float2 b, float2 edge)
float3 smoothstep (float3 a, float3 b, float3 edge)
float4 smoothstep (float4 a, float4 b, float4 edge)

Going back to the operation in the fragment shader stage, we could add a new variable to determine the amount of interpolation between the return values.

fixed4 frag (v2f i) : SV_Target
{
    // add the edge
    float edge = 0.5;
    // add the amount of interpolation
    float smooth = 0.1;
    // add the return value in RGB
    fixed3 sstep = 0;
    // sstep = step (i.uv.y, edge);
    sstep = smoothstep((i.uv.y - smooth), (i.uv.y + smooth), edge);

    // fixed4 col = tex2D (_MainTex, i.uv);

    return fixed4(sstep, 1);
}

In the previous exercise, we could modify the value of “smooth” between 0.0f and 0.5f to obtain different levels of interpolation.