美圖秀秀濾鏡之亮度調整

　　圖像的亮度, 指的是圖像像素的強度, 黑色為最暗, 白色為最亮, 在ios中黑色用0來表示, 白色用1來表示.一個像素, 基本上是用RGB三個顏色分量來表示的. R(0-1), G(0-1),B(0-1).

　　亮度調整有多種計算方法,效果並不完全相同，在顏色的表示方法中， HSL(L)表示法就是：色相(hue)、飽和度(saturation)、亮度(lightness)，改變其中的L值就可以調整圖象的亮度，但效果顯得比較生硬。

PhotoShop和GPUImage中采用的就是另外一種方法就是把圖象每個點顏色的RGB分量分別加上亮度調整值，這種效果相對比較柔和。下面是頂點着色器和片段着色器代碼（這些代碼運行於GPU中）。

　　頂點着色

 attribute vec4 position; //輸入頂點位置屬性
 attribute vec4 inputTextureCoordinate;//輸入紋理位置屬性
 
 varying vec2 textureCoordinate;//輸出給片段着色器的紋理位置
 
 void main()
 {
     gl_Position = position;//輸出給片段着色器的頂點位置
     textureCoordinate = inputTextureCoordinate.xy;//告訴片段着色器，頂點着色器正在處理的像素點。
 }

　　

　　片段着色

 varying highp vec2 textureCoordinate;
 
 uniform sampler2D inputImageTexture;//輸入的紋理圖片。也就是我們要處理的圖片
 uniform lowp float brightness;//亮度值，我們在程序中可以調整的。
 
 void main()
 {
     lowp vec4 textureColor = texture2D(inputImageTexture, textureCoordinate);//輸入圖片的紋理顏色
     
     gl_FragColor = vec4((textureColor.rgb + vec3(brightness)), textureColor.w);//像素着色顏色。將每個像素的RGB分量與亮度值相加，得到心的像素顏色。即算法實現
 }

 

在我的美圖秀秀中，使用的是上述算法，而官方版不是

使用GPUImage的GPUImageBrightnessFilter來實現圖像的亮度調整。

 

　　具體應用

1.在GPUImageBrightnessFilter中首先初始化該濾鏡

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

 

 

2.設置亮度值。該亮度值通過滑動UISlider來改變

filter.brightness = value;

 

 

3.設置亮度調整范圍為整張圖像

[filter forceProcessingAtSize:image.size];

 

 

4.設置輸入圖像紋理

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

 

 

5.處理圖像

[pic processImage];
    [filter useNextFrameForImageCapture];

 

 

6.獲取處理后的圖像

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];
}

 

 

附錄

在GPUImageBrightnessFilter的init方法中，設置了默認的亮度為0

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

 

setBrightness方法調整圖像的亮度值，_brightness為輸入的亮度值，在頂點着色器中uniform float brightness與brightnessUniform = [filterProgram uniformIndex:@"brightness"]對應，必須名字相同

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

 

下面我們預覽一下效果