opengl+egl 裁剪圆角实例

要在 OpenGL 中实现圆角裁剪，可以使用 EglImageSurface 和带有 alpha 通道的纹理。以下是一个简单的实现示例：

1. 创建一个带有 alpha 通道的纹理

GLuint textureID;
glGenTextures(1, &textureID);

glBindTexture(GL_TEXTURE_2D, textureID);

// 设置纹理参数
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP_TO_EDGE);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);

// 创建纹理
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, width, height, 0, GL_RGBA, GL_UNSIGNED_BYTE, nullptr);

// 绑定到帧缓冲区
glBindFramebuffer(GL_FRAMEBUFFER, frameBufferID);
glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, textureID, 0);
glBindFramebuffer(GL_FRAMEBUFFER, 0);

2. 使用 EglImageSurface 将纹理绑定到 EGL 上下文

EGLImageKHR eglImage = eglCreateImageKHR(eglDisplay, EGL_NO_CONTEXT, EGL_NATIVE_PIXMAP_KHR, (EGLClientBuffer)textureID, nullptr);

EglImageSurface eglImageSurface(eglDisplay, eglConfig, eglImage, width, height);
eglImageSurface.makeCurrent();

3. 渲染带有 alpha 通道的纹理

// 绑定纹理
glBindTexture(GL_TEXTURE_2D, textureID);

// 渲染带有 alpha 通道的纹理
glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
glDisable(GL_BLEND);

4. 在着色器中实现圆角裁剪

// 顶点着色器
static const char* vertexShader =
    "attribute vec4 position;\n"
    "attribute vec2 texCoord;\n"
    "varying vec2 v_texCoord;\n"
    "void main()\n"
    "{\n"
    "    gl_Position = position;\n"
    "    v_texCoord = texCoord;\n"
    "}\n";

// 片段着色器
static const char* fragmentShader =
    "precision highp float;\n"
    "uniform sampler2D texture;\n"
    "varying vec2 v_texCoord;\n"
    "uniform float radius;\n"
    "void main()\n"
    "{\n"
    "    vec4 color = texture2D(texture, v_texCoord);\n"
    "    vec2 texSize = vec2(textureSize(texture, 0));\n"
    "    vec2 texCoord = v_texCoord * texSize;\n"
    "    vec2 center = vec2(texSize.x / 2.0, texSize.y / 2.0);\n"
    "    float dist = length(texCoord - center);\n"
    "    if (dist > radius)\n"
    "    {\n"
    "        discard;\n"
    "    }\n"
    "    gl_FragColor = color;\n"
    "}\n";

在片段着色器中，使用圆形裁剪的半径将距离中心点距离大于半径的片段丢弃。这样就可以实现圆角裁剪效果。

5. 最后，渲染圆角纹理

// 设置圆角半径
float radius = 50.0f;
GLint radiusLoc = glGetUniformLocation(program, "radius");
glUniform1f(radiusLoc, radius);

// 渲染圆角纹理
glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);

这样就可以实现 OpenGL 中的圆角裁剪效果了。