探索OpenGL ES中的灰度和马赛克滤镜：让像素绽放多彩

2023-10-06 10:32:50

在 OpenGL ES 中探索滤镜：灰度和马赛克

想象一下一个迷人的世界，在那里像素可以被操纵，图像可以变成迷人的艺术品。在 OpenGL ES 中，滤镜扮演着这一迷人变身的关键角色。在这个世界里，灰度和马赛克滤镜尤为引人注目，它们可以让你的像素焕发生机，释放无限的创造力。

踏入灰度世界的迷雾

灰度滤镜就像一个魔术师，它能将色彩缤纷的世界化为黑白怀旧风。它通过巧妙地平衡 RGB 值，或仅仅保留亮度值，让每个像素呈现出统一的色调，让你深入探索光影的细微差别。

代码示例：灰度滤镜片元着色器

void main()
{
    // 获取像素的 RGB 值
    vec3 color = texture2D(texture, gl_TexCoord[0]).rgb;

    // 计算平均亮度值
    float average = (color.r + color.g + color.b) / 3.0;

    // 将 RGB 值设为平均亮度值
    gl_FragColor = vec4(average, average, average, 1.0);
}

在这个片元着色器中，我们获取像素的 RGB 值，计算它们的平均值，并最终将 RGB 值都设为这个平均值，赋予每个像素相同的灰度。

马赛克：像素化世界的艺术

马赛克滤镜则截然不同。它将图像分解成独立的像素块，就像马赛克艺术中那些引人注目的方块。通过调整像素块的大小和间隔，我们可以控制马赛克化的程度，创造出一种抽象、复古的美感。

代码示例：马赛克滤镜片元着色器

void main()
{
    // 获取像素的坐标
    vec2 texCoord = gl_TexCoord[0];

    // 计算像素块的尺寸
    float blockSize = 0.1; // 调整此值以控制马赛克化程度

    // 计算像素块的中心坐标
    vec2 blockCenter = vec2(
        floor(texCoord.x / blockSize) * blockSize + blockSize / 2.0,
        floor(texCoord.y / blockSize) * blockSize + blockSize / 2.0
    );

    // 获取像素块中心的颜色
    vec3 color = texture2D(texture, blockCenter).rgb;

    // 将当前像素的颜色设为像素块中心的颜色
    gl_FragColor = vec4(color, 1.0);
}