使用片段着色器和 GL_LINE_STRIP 在 OpenGL GLES20 android 中绘制简单的虚线或虚线

2022-01-09 00:00:00 opengl-es android java glsl fragment-shader

我查看了不同的来源,发现我们可以使用片段着色器绘制虚线.因为我是 OpenGL 新手,所以我无法理解.

谁能分享一些在Android中使用片段着色器和GL_LINE_STRIP绘制虚线或虚线的代码示例.

参考资料:

  • <小时>

    <子>除了使用纹理,您还可以在片段着色器中生成点画.查看桌面 OpenGL cor 配置文件的解决方案:
    glLineStipple 在 OpenGL 3.1 中已弃用
    OpenGL3 中的虚线?

    I went through different sources and seen that we could draw a dotted line using a fragment shader. Because I am new to OpenGL I couldn't able to understand.

    Can anyone share some code sample that plot dotted or dashed line using fragment shader and GL_LINE_STRIP in Android.

    References:

    • Dashed line in OpenGL3?
    • Dotted back edges of object

    解决方案

    Line stipple is not supported in OpenGL ES.

    If you use OpenGL ES 1.00, then you can use the approach which is presented in the answers to OpenGL ES - Dashed Lines.
    You have to create a 1 dimensional texture (2 dimensional Nx1 texture), and wrap the texture on the lines. The texture has a stipple pattern encoded in its alpha channel. The space between the dashes is discarded by the Alpha test.

    If you use OpenGL ES 2.00 or higher (OpenGL ES 3.x), then you can't use the alpha test, because it is deprecated. You have to use a fragment shader and to skip fragments by the discard keyword.

    Create a texture with a red color channel only. The stipple pattern is encoded in the red color channel, but the code is very similar to that one from OpenGL ES - Dashed Lines, beside the fact that you have to use GL10.GL_RED for the internal texture format (instead of GL10.GL_ALPHA):

    byte arr[] = new byte[] { 255, 0, 0, 255 };
    ByteBuffer textureBuffer = ByteBuffer.wrap(arr);
    
    gl.glGenTextures(1, texture_id_, stippleTexObj);
    gl.glBindTexture(GLES20.GL_TEXTURE_2D, stippleTexObj);
    gl.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MIN_FILTER, GLES20.GL_NEAREST);
    gl.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_MAG_FILTER, GLES20.GL_NEAREST);
    gl.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_S, GLES20.GL_REPEAT);
    gl.glTexParameteri(GLES20.GL_TEXTURE_2D, GLES20.GL_TEXTURE_WRAP_T, GLES20.GL_REPEAT);
    gl.glTexImage2D(GLES20.GL_TEXTURE_2D, 0, GLES20.GL_RED, 4, 1, 0,
                    GLES20.GL_RED, GLES20.GL_UNSIGNED_BYTE, textureBuffer);
    

    When you draw the lines, the you have to use a shader program, that discard the fragments dependent on the red color channel of the texture. A very simple GLSL ES 1.00 shader (for OpenGL ES 3.00) may look as follows:

    Vertex shader:

    attribute vec2  inPos;
    attribute float inU;
    varying   float vU;
    
    void main()
    {
        outU        = inU;
        gl_Position = vec4( inPos.xy, 0.0, 1.0 );
    }
    

    Fragment shader:

    precision mediump float;
    
    varying float     vU;
    uniform sampler2D u_stippleTexture;
    
    void main()
    {
        float stipple = texture2D(u_stippleTexture, vec2(vU, 0.0)).r;
        if (stipple < 0.5)
            discard;
        gl_FragColor = vec4(1.0);
    }
    

    Ensure that the texture coordinates which are associated to the vertices are aligned to integral values when you draw the line, that causes the the lines start and end with a dash:

    e.g. a quad with bottom left of (-0.5 -0.5) and to right of (0.5, 0.5) and the texture coordinates in range [0, 5]:

     x     y       u   
    -0.5f -0.5f    0.0f
     0.5f -0.5f    5.0f
     0.5f  0.5f    0.0f
    -0.5f  0.5f    5.0f
    

    Since the wrap function is GL_REPEAT and the texture coordinates are in range [0, 5], 5 repetitions of the stipple pattern are wrapped to each edge of the quad.


    Instead of using a texture, you can also generate the stippling in the fragment shader. See the solutions for desktop OpenGL cor profile:
    glLineStipple deprecated in OpenGL 3.1
    Dashed line in OpenGL3?

相关文章