Brightness adjustment of the meitu xiuxiu filter and brightness adjustment of the xiuxiu Filter

Brightness adjustment of the meitu xiuxiu filter and brightness adjustment of the xiuxiu Filter

The brightness of the image refers to the pixel intensity of the image. The black color is the darker, the white color is the brightest, and the black color is represented by 0 in ios, and the white color is represented by 1. A pixel is represented by three RGB color components. R (0-1), G (0-1), B (0-1 ).

Brightness adjustment involves multiple calculation methods with different effects. In color representation, HSL (L) notation is: hue and saturation), brightness (lightness), change the L value to adjust the brightness of the image, but the effect is relatively stiff.

In PhotoShop and GPUImage, another method is to add the brightness adjustment value to the RGB component of each image point color, which is relatively soft. Below are the vertex and fragment shader Code (which runs on the GPU ).

Vertex coloring

Attribute vec4 position; // input vertex position attribute vec4 inputTextureCoordinate; // input texture position attribute varying vec2 textureCoordinate; // output the texture position void main () {gl_Position = position; // The vertex position that is output to the fragment shader. textureCoordinate = inputTextureCoordinate. xy; // indicates the pixel being processed by the vertex coloring tool. }

　　

Segment coloring

Varying highp vec2 textureCoordinate; uniform sampler2D inputImageTexture; // input texture image. That is, the uniform lowp float brightness of the image to be processed; // The brightness value can be adjusted in the program. Void main () {lowp vec4 textureColor = texture2D (inputImageTexture, textureCoordinate); // enter the image texture color gl_FragColor =Vec4 (textureColor. rgb +Vec3 (brightness), textureColor. w); // Pixel color. Add the RGB component of each pixel to the brightness value to obtain the pixel color of the center. That is, Algorithm Implementation}

 

In my meitu xiuxiu, I used the above algorithm, but the official version is not

Use the GPUImageBrightnessFilter of GPUImage to adjust the brightness of the image.

 

Specific Application

1. initialize the filter in GPUImageBrightnessFilter.

GPUImageBrightnessFilter *filter = [[GPUImageBrightnessFilter alloc] init];

 

 

2. Set the brightness value. The brightness value is changed by sliding UISlider.

filter.brightness = value;

 

 

3. Set the brightness adjustment range to the entire image.

[filter forceProcessingAtSize:image.size];

 

 

4. Set Input Image Texture

GPUImagePicture *pic = [[GPUImagePicture alloc] initWithImage:image];[pic addTarget:filter];

 

 

5. process images

[pic processImage];    [filter useNextFrameForImageCapture];

 

 

6. Obtain the processed image

return [filter imageFromCurrentFramebuffer];

 

+ (UIImage *)changeValueForBrightnessFilter:(float)value image:(UIImage *)image;{    GPUImageBrightnessFilter *filter = [[GPUImageBrightnessFilter alloc] init];    filter.brightness = value;    [filter forceProcessingAtSize:image.size];    GPUImagePicture *pic = [[GPUImagePicture alloc] initWithImage:image];    [pic addTarget:filter];    [pic processImage];    [filter useNextFrameForImageCapture];    return [filter imageFromCurrentFramebuffer];}

 

 

Appendix

In the init method of GPUImageBrightnessFilter, the default brightness is set to 0.

- (id)init;{    if (!(self = [super initWithFragmentShaderFromString:kGPUImageBrightnessFragmentShaderString]))    {        return nil;    }        brightnessUniform = [filterProgram uniformIndex:@"brightness"];    self.brightness = 0.0;        return self;}

 

The setBrightness method is used to adjust the brightness of an image. _ brightness is the input brightness value. In the vertex shader, the uniform float brightness corresponds to the brightnessUniform = [filterProgram uniformIndex: @ "brightness, must have the same name

- (void)setBrightness:(CGFloat)newValue;{    _brightness = newValue;        [self setFloat:_brightness forUniform:brightnessUniform program:filterProgram];}

 

Let's preview the effect.