用GPUImage做自己的滤镜
2016-03-03 15:52
399 查看
这篇博客主要说一下怎么用GPUImage这个库来撸一个自制滤镜。
GPUImage中滤镜主要使用OpenGL ES来对图片和视频进行渲染,当然,要自制一个滤镜并不需要你对OpenGL ES有很深入的了解,但最好还是简单了解一下。这里给出一个参考资料;
手撸一个滤镜需要算法(像:Overlay(B,A) (A < 128) ? (2 * A * B / 255) : (255 - 2 * (255 - A) * (255 - B) / 255) [强光混合算法])。
GPUImage里面手撸滤镜通过使用vec4来表示一个像素点的颜色,即rgb和a(RGB色通道和透明度);
先写一个超级简单的例子,写一个把亮度改成0.5的滤镜
来手撸一个滤镜
也可以通过文件来手撸
![](http://img.blog.csdn.net/20160303155002509)
这个是对比组
添加好target,看效果吧
![](http://img.blog.csdn.net/20160303154720209)
好了,下次有空的时候会写一篇关于怎么用GPUImage手撸2个输入和3输入的滤镜。。。。。。一个不小心又给自己挖了个坑。。。希望这次有时间填上。。。
GPUImage中滤镜主要使用OpenGL ES来对图片和视频进行渲染,当然,要自制一个滤镜并不需要你对OpenGL ES有很深入的了解,但最好还是简单了解一下。这里给出一个参考资料;
手撸一个滤镜需要算法(像:Overlay(B,A) (A < 128) ? (2 * A * B / 255) : (255 - 2 * (255 - A) * (255 - B) / 255) [强光混合算法])。
GPUImage里面手撸滤镜通过使用vec4来表示一个像素点的颜色,即rgb和a(RGB色通道和透明度);
先写一个超级简单的例子,写一个把亮度改成0.5的滤镜
//这里写2个,一个用手撸的滤镜,一个用GPUImage的,来验证效果 _upGPUImageView = [[GPUImageView alloc] initWithFrame:_imgViewUp.frame]; _downGPUImageView = [[GPUImageView alloc] initWithFrame:_imgViewDown.frame]; [self.view addSubview:_upGPUImageView]; [self.view addSubview:_downGPUImageView]; UIImage *demoImg = [UIImage imageNamed:@"demo.jpg"]; _upGPUImagePicture = [[GPUImagePicture alloc] initWithImage:demoImg]; _downGPUImagePicture = [[GPUImagePicture alloc] initWithImage:demoImg];
来手撸一个滤镜
//一定要是const的,不是常量可是会报错的 NSString *const kGPUImageHalfBrightnessShaderString = SHADER_STRING ( //这两个是输入,表示输入图片的像素 varying highp vec2 textureCoordinate; uniform sampler2D inputImageTexture; //main函数里面对像素进行处理 void main() { //这个textureColor就是结合了输入之后,表示图片像素的vec4 lowp vec4 textureColor = texture2D(inputImageTexture, textureCoordinate); //w即透明度(我也不知道为什么不用a) //这样就能让rgb的输入变成+0.5,也就是让亮度+0.5 gl_FragColor = vec4((textureColor.rgb + vec3(0.5)), textureColor.w); } ); //使用上面的函数来构建滤镜,之后就可以当GPUImageFilter直接用了 _upBrightnessFilter = [[GPUImageFilter alloc] initWithFragmentShaderFromString:kGPUImageHalfBrightnessShaderString];
也可以通过文件来手撸
_upBrightnessFilter = [[GPUImageFilter alloc] initWithFragmentShaderFromFile:@"custonShader"];
这个是对比组
_downBrightnessFilter = [[GPUImageBrightnessFilter alloc] init]; _downBrightnessFilter.brightness = 0.5;
添加好target,看效果吧
[_upGPUImagePicture addTarget:_upBrightnessFilter]; [_upBrightnessFilter addTarget:_upGPUImageView]; [_downGPUImagePicture addTarget:_downBrightnessFilter]; [_downBrightnessFilter addTarget:_downGPUImageView]; [_downGPUImagePicture processImage]; [_upGPUImagePicture processImage];
好了,下次有空的时候会写一篇关于怎么用GPUImage手撸2个输入和3输入的滤镜。。。。。。一个不小心又给自己挖了个坑。。。希望这次有时间填上。。。
相关文章推荐
- UIScrollView(loading...)
- Animation动画详解(八)——PropertyValuesHolder与Keyframe
- 【UI】【View】自定义布局方法与注意事项(一)
- SLF4J versions 1.4.0 and later requires log4j 1.2.12 or later
- 整理一下NGUI 的一些功能实现的代码
- get/close not same thread Druid 连接池一个设置
- phoenix使用vue
- UILocalNotification的使用
- question_014-JAVA之Map
- Android开发-UI控件:选项卡切换时改变布局中内容的方法
- Bitbucket 让 pull request变得更强大,可即刻提升团队代码质量
- 阻塞队列BlockingQueue
- Gradle中的buildScript代码块
- UI学习总结--几个比较重要的知识点
- 将且仅将UILabel上的所有数字变色指定的字体颜色
- iOS开发-UI控件:让UITableView自动滑动(定位)到某一行cell
- GUI.BeginScrollView
- hue笔记
- @PathVariable和@RequestParam的区别,@SessionAttributes
- 用GPUImage来给视频加入水印