Sepia、RGB、GrayScale效应在UIImage中的应用

Question

我想把过滤效果应用到我的应用程序中的图像。我是新的开放GL &想应用雪碧，RGB，GrayScale效果到图像在我的应用程序。我已经实现了亮度，对比度，饱和效应的，但没有找到任何解决方案的灰度，RGB和紫色效应。

提前谢谢。

Answer 1

您没有指定在OpenGL es1.1或2.0中是要这样做，所以我假设您所指的是较新的2.0。如果1.1确实是你的目标，你需要像苹果在他们的GLImageProcessing实例中所做的那样，使用混合模式。

对于OpenGL ES 2.0，您可以使用片段着色器实现这些效果中的每一个。对于图像的灰度版本，只需使用以下片段着色器提取亮度：

 precision highp float;

 varying vec2 textureCoordinate;

 uniform sampler2D inputImageTexture;

 const highp vec3 W = vec3(0.2125, 0.7154, 0.0721);

 void main()
 {
     float luminance = dot(texture2D(inputImageTexture, textureCoordinate).rgb, W);

     gl_FragColor = vec4(vec3(luminance), 1.0);
 }

对于紫色色调，您可以使用我在这个答案中演示的颜色矩阵操作着色器。

 varying highp vec2 textureCoordinate;

 uniform sampler2D inputImageTexture;

 uniform lowp mat4 colorMatrix;
 uniform lowp float intensity;

 void main()
 {
     lowp vec4 textureColor = texture2D(inputImageTexture, textureCoordinate);
     lowp vec4 outputColor = textureColor * colorMatrix;

     gl_FragColor = (intensity * outputColor) + ((1.0 - intensity) * textureColor);
 }

有一个矩阵

self.colorMatrix = (GPUMatrix4x4){
        {0.3588, 0.7044, 0.1368, 0},
        {0.2990, 0.5870, 0.1140, 0},
        {0.2392, 0.4696, 0.0912 ,0},
        {0,0,0,0},
    };

我不知道你所说的"RGB效应“是什么意思。也许您指的是颜色矩阵操作，在这种情况下，上面的操作也适用于您。

所有这些都是在我的开源GPUImage框架中内置的过滤器(参见GPUImageBrightnessFilter、GPUImageContrastFilter、GPUImageSaturationFilter、GPUImageSepiaFilter和GPUImageColorMatrixFilter)。如果您是OpenGL ES的新手，那么设置场景、将UIImage作为纹理、对其运行顶点和片段着色器、检索图像并将其保存回UIImage需要相当多的代码。GPUImage将通过几行Objective代码为您完成所有这些工作。