0

我是在 GLSL 中为 OpenGL ES2.0 编写片段着色器的新手，我正在尝试创建一个片段着色器，为给定的图形创建斜角效果。到目前为止，这是我能够做到的（忽略下壁和其他纹理，只看应用斜面效果的顶部）：

电流输出

以下是期望的结果：

期望的输出

注意对角线的阴影差异，它们比水平边缘的阴影更浅。注意从对角边缘到水平或垂直的过渡。还要注意斜面的厚度。我想尽可能接近这个期望的结果。

现在我使用的片段着色器相当简单，代码如下：

#ifdef GL_ES
precision mediump float;
#endif

varying vec2 v_texCoord;
uniform sampler2D s_texture;
uniform float u_time;

void main()
{
    vec2 onePixel = vec2(0, 1.0 / 640.0);

    vec2 texCoord = v_texCoord;

    vec4 color;
    color.rgb = vec3(0.5);
    color += texture2D(s_texture, texCoord - onePixel) * 5.0;
    color -= texture2D(s_texture, texCoord + onePixel) * 5.0;

    color.rgb = vec3((color.r + color.g + color.b) / 3.0);
    gl_FragColor = vec4(color.rgb, 1);
}

我需要在着色器中添加什么来创建所需的效果？

4

2 回答 2

0

我认为您展示的示例并非完全使用片段着色器代码完成。它可能是通过对几何体进行斜切来完成的，这可以通过几何着色器来完成，除了 ES 中不存在，所以我要么使用 Blender 之类的创作工具对你的模型进行斜切，要么使用纹理来做凹凸贴图技术。

于 2013-06-23T00:55:03.977 回答
0

获得斜面效果的最佳方法是使用 Blender 或其他编辑器修改网格。

如果您确实想使用 Shader 实现此目的，则可以使用专门为隐藏边缘而准备的凹凸贴图。

可能有一些多通道和渲染缓冲解决方案，但对这些不太了解。您可以从深度缓冲区中找到边缘。但就性能而言，这并不是最好的方式。

我最近找到了一种无需特殊纹理和更改几何形状即可获得斜面效果的方法（这就是我回答这个问题的原因：）。但它确实需要对顶点数据进行修改：您实际上需要为每个顶点添加其他法线向量。因此，您必须转换网格以专门使用该着色器。文章

于 2018-02-20T16:52:11.920 回答