开发一款直播app710官方网站,美颜只是分化滤镜组合起来的听从

至于滤镜代码和促成思路可以到BeautifyFace
Github
和作者琨君简书中查看。

一、 准备纹理(将要接纳的类)

[GPUImageVideoCamera] –
[GPUImageBeautifyFilter] –
[GPUImageBilateralFliter] –
[GPUImageCombinationFilter] –
[GPUImageCannyEdgeDetectionFilter] –

预备进程分三步:
首先个纹理:
1、GPUImageVideoCamera捕获摄像头图像
调用newFrameReadyAtTime: atIndex:通知GPUImageBeautifyFilter;
2、GPUImageBeautifyFilter调用newFrameReadyAtTime: atIndex:
文告GPUImageBilateralFliter输入纹理已经准备好;

其次个纹理:
3、GPUImageBilateralFliter 绘制图像后,
informTargetsAboutNewFrameAtTime(),
调用setInputFramebufferForTarget: atIndex:
把绘制的图像设置为GPUImageCombinationFilter输入纹理,
并通报GPUImageCombinationFilter纹理已经绘制完结;
4、GPUImageBeautifyFilter调用newFrameReadyAtTime: atIndex:
照会 GPUImageCannyEdgeDetectionFilter输入纹理已经准备好;

其多个纹理:
5、GPUImageCannyEdgeDetectionFilter 绘制图像后,
把图像设置为GPUImageCombinationFilter输入纹理;
6、GPUImageBeautifyFilter调用newFrameReadyAtTime: atIndex:
照会 GPUImageCombinationFilter输入纹理已经准备好;

纹理准备.png

美颜功效

集成GPUImageBeautifyFilter和GPUImage Framework

率先必要集成好GPUImage,通过观望近日iOS平台,90%以上美颜方案都是按照那个框架来做的。
原先项目中的AVCaptureDevice要求替换成GPUImageVideoCamera,删除诸如AVCaptureSession/AVCaptureDeviceInput/AVCaptureVideoDataOutput那种GPUImage完成了的有些。修改部分生命周期,视频头切换,横竖屏旋转等连锁逻辑,保障前后行为统一。

宣称要求的习性

 @property (nonatomic, strong) GPUImageVideoCamera *videoCamera;  
 //屏幕上显示的View
 @property (nonatomic, strong) GPUImageView *filterView;
 //BeautifyFace美颜滤镜
 @property (nonatomic, strong) GPUImageBeautifyFilter *beautifyFilter;

然后开端化

  self.sessionPreset = AVCaptureSessionPreset1280x720;
  self.videoCamera = [[GPUImageVideoCamera alloc] initWithSessionPreset:self.sessionPreset cameraPosition:AVCaptureDevicePositionBack];

  self.filterView = [[GPUImageView alloc] init];
  [self.view insertSubview:self.filterView atIndex:1]; //省略frame的相关设置

  //这里我在GPUImageBeautifyFilter中增加个了初始化方法用来设置美颜程度intensity
  self.beautifyFilter = [[GPUImageBeautifyFilter alloc] initWithIntensity:0.6];

为filterView扩充美颜滤镜

[self.videoCamera addTarget:self.beautifyFilter];
[self.beautifyFilter addTarget:self.filterView];

接下来调用startCameraCapture方法就可以见到效果了

[self.videoCamera startCameraCapture];

到这边,仅仅是显示屏突显的始末包涵滤镜效果,而作为直播应用,还索要输出带有美颜功能的视频流

三、展现纹理

9、GPUImageView把输入纹理绘制到祥和的帧缓存,然后通过
[self.context presentRenderbuffer:GL_RENDERBUFFER];显示到UIView上。

GPUImageBeautifyFilter.m文件

@interface GPUImageCombinationFilter : GPUImageThreeInputFilter
{
GLint smoothDegreeUniform;
}

@property (nonatomic, assign) CGFloat intensity;

@end

NSString *const kGPUImageBeautifyFragmentShaderString = SHADER_STRING
(
varying highp vec2 textureCoordinate;
varying highp vec2 textureCoordinate2;
varying highp vec2 textureCoordinate3;

uniform sampler2D inputImageTexture;
uniform sampler2D inputImageTexture2;
uniform sampler2D inputImageTexture3;
uniform mediump float smoothDegree;

void main()
{
 highp vec4 bilateral = texture2D(inputImageTexture, textureCoordinate);
 highp vec4 canny = texture2D(inputImageTexture2, textureCoordinate2);
 highp vec4 origin = texture2D(inputImageTexture3,textureCoordinate3);
 highp vec4 smooth;
 lowp float r = origin.r;
 lowp float g = origin.g;
 lowp float b = origin.b;
 if (canny.r < 0.2 && r > 0.3725 && g > 0.1568 && b > 0.0784 && r > b && (max(max(r, g), b) - min(min(r, g), b)) > 0.0588 && abs(r-g) > 0.0588) {
     smooth = (1.0 - smoothDegree) * (origin - bilateral) + bilateral;
 }
 else {
     smooth = origin;
 }
 smooth.r = log(1.0 + 0.2 * smooth.r)/log(1.2);
 smooth.g = log(1.0 + 0.2 * smooth.g)/log(1.2);
 smooth.b = log(1.0 + 0.2 * smooth.b)/log(1.2);
 gl_FragColor = smooth;
}
);

@implementation GPUImageCombinationFilter

-(id)init {
if (self = [super initWithFragmentShaderFromString:kGPUImageBeautifyFragmentShaderString]) {
    smoothDegreeUniform = [filterProgram uniformIndex:@"smoothDegree"];
}
self.intensity = 0.5;
return self;
}

-(void)setIntensity:(CGFloat)intensity {
_intensity = intensity;
[self setFloat:intensity forUniform:smoothDegreeUniform program:filterProgram];
}

@end

@implementation GPUImageBeautifyFilter

-(id)init;
{
if (!(self = [super init]))
{
    return nil;
}

// First pass: face smoothing filter
bilateralFilter = [[GPUImageBilateralFilter alloc] init];
bilateralFilter.distanceNormalizationFactor = 4.0;
[self addFilter:bilateralFilter];

// Second pass: edge detection
cannyEdgeFilter = [[GPUImageCannyEdgeDetectionFilter alloc] init];
[self addFilter:cannyEdgeFilter];

// Third pass: combination bilateral, edge detection and origin
combinationFilter = [[GPUImageCombinationFilter alloc] init];
[self addFilter:combinationFilter];

// Adjust HSB
hsbFilter = [[GPUImageHSBFilter alloc] init];
[hsbFilter adjustBrightness:1.1];
[hsbFilter adjustSaturation:1.1];

[bilateralFilter addTarget:combinationFilter];
[cannyEdgeFilter addTarget:combinationFilter];

[combinationFilter addTarget:hsbFilter];

self.initialFilters = [NSArray arrayWithObjects:bilateralFilter,cannyEdgeFilter,combinationFilter,nil];
self.terminalFilter = hsbFilter;

return self;
}

#pragma mark - GPUImageInput protocol

绘图纹理

-(void)newFrameReadyAtTime:(CMTime)frameTime atIndex:(NSInteger)textureIndex;
{
for (GPUImageOutput<GPUImageInput> *currentFilter in self.initialFilters)
{
    if (currentFilter != self.inputFilterToIgnoreForUpdates)
    {
        if (currentFilter == combinationFilter) {
            textureIndex = 2;
        }
        [currentFilter newFrameReadyAtTime:frameTime atIndex:textureIndex];
    }
}
}

设置绘制图像的输入纹理

-(void)setInputFramebuffer:(GPUImageFramebuffer *)newInputFramebuffer atIndex:(NSInteger)textureIndex;
{
for (GPUImageOutput<GPUImageInput> *currentFilter in self.initialFilters)
{
    if (currentFilter == combinationFilter) {
        textureIndex = 2;
    }
    [currentFilter setInputFramebuffer:newInputFramebuffer atIndex:textureIndex];
}
}

GPUImage集成步骤:
自定义组合滤镜美颜

  1. 使用Cocoapods导入GPUImage;
  2. 成立摄像源GPUImageVideoCamera;
  3. 始建最后目的源:GPUImageView;
  4. 创设GPUImageFilterGroup滤镜组合,要求结合亮度(GPUImageBrightnessFilter)和双边滤波(GPUImageBilateralFilter)那七个滤镜达到美颜成效;
  5. 安装滤镜组链;
  6. 安装GPUImage处理链,从数量源 -> 滤镜 -> 最终界面效果;
  7. 开班收集视频。

-(void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
self.view.backgroundColor = [UIColor whiteColor];
self.title = @"GPUImage美颜";

[self initBottomView];

//  1. 创建视频摄像头
// SessionPreset:屏幕分辨率,AVCaptureSessionPresetHigh会自适应高分辨率
// cameraPosition:摄像头方向
// 最好使用AVCaptureSessionPresetHigh,会自动识别,如果用太高分辨率,当前设备不支持会直接报错
GPUImageVideoCamera *videoCamera = [[GPUImageVideoCamera alloc] initWithSessionPreset:AVCaptureSessionPresetHigh cameraPosition:AVCaptureDevicePositionFront];

//  2. 设置摄像头输出视频的方向
videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;
_videoCamera = videoCamera;

//  3. 创建用于展示视频的GPUImageView
GPUImageView *captureVideoPreview = [[GPUImageView alloc] initWithFrame:self.view.bounds];
[self.view insertSubview:captureVideoPreview atIndex:0];

//  4.创建磨皮、美白组合滤镜
GPUImageFilterGroup *groupFliter = [[GPUImageFilterGroup alloc] init];

//  5.磨皮滤镜
GPUImageBilateralFilter *bilateralFilter = [[GPUImageBilateralFilter alloc] init];
[groupFliter addFilter:bilateralFilter];
_bilateralFilter = bilateralFilter;

//  6.美白滤镜
GPUImageBrightnessFilter *brightnessFilter = [[GPUImageBrightnessFilter alloc] init];
[groupFliter addFilter:brightnessFilter];
_brightnessFilter = brightnessFilter;


//  7.设置滤镜组链
[bilateralFilter addTarget:brightnessFilter];
[groupFliter setInitialFilters:@[bilateralFilter]];
groupFliter.terminalFilter = brightnessFilter;

//  8.设置GPUImage处理链 从数据源->滤镜->界面展示
[videoCamera addTarget:groupFliter];
[groupFliter addTarget:captureVideoPreview];

//  9.调用startCameraCapture采集视频,底层会把采集到的视频源,渲染到GPUImageView上,接着界面显示
[videoCamera startCameraCapture];
}

ps:

  1. GPUImageVideoCamera必须求强引用,否则在采访视频进度中会被灭绝;
  2. 非得调用startCameraCapture,底层才会把采访到的视频源,渲染到GPUImageView中才能突显;
  3. GPUImageBilateralFilter的distance诺玛lizationFactor值越小,磨皮效果越好,distance诺玛lizationFactor取值范围:
    大于1。

行使美颜滤镜GPUImageBeautifyFilter完成
1、使用Cocoapods导入GPUImage;
2、导入GPUImageBeautifyFilter文件夹;
3、创造摄像源GPUImageVideoCamera;
4、创制最终指标源:GPUImageView;
5、创设最终美颜滤镜:GPUImageBeautifyFilter;
6、设置GPUImage处理链,从数量源 -> 滤镜 -> 最后界面显得。

-(void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
self.view.backgroundColor = [UIColor whiteColor];
self.title = @"Beautify美颜";

UISwitch *switcher = [[UISwitch alloc] initWithFrame:CGRectMake(140, 80, 70, 30)];
[switcher addTarget:self action:@selector(changeBeautyFilter:) forControlEvents:UIControlEventValueChanged];

[self.view addSubview:switcher];

//  1. 创建视频摄像头
// SessionPreset:屏幕分辨率,AVCaptureSessionPresetHigh会自适应高分辨率
// cameraPosition:摄像头方向
// 最好使用AVCaptureSessionPresetHigh,会自动识别,如果用太高分辨率,当前设备不支持会直接报错
GPUImageVideoCamera *videoCamera = [[GPUImageVideoCamera alloc] initWithSessionPreset:AVCaptureSessionPresetHigh cameraPosition:AVCaptureDevicePositionFront];

//  2. 设置摄像头输出视频的方向
videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;
_videoCamera = videoCamera;


//  3. 创建用于展示视频的GPUImageView
GPUImageView *captureVideoPreview = [[GPUImageView alloc] initWithFrame:self.view.bounds];
[self.view insertSubview:captureVideoPreview atIndex:0];
_captureVideoPreview = captureVideoPreview;

//  4.设置处理链
[_videoCamera addTarget:_captureVideoPreview];

//  5.调用startCameraCapture采集视频,底层会把采集到的视频源,渲染到GPUImageView上,接着界面显示
[videoCamera startCameraCapture];
}

切换美颜的时候要活动处理链

// 移除之前所有处理链
[_videoCamera removeAllTargets];

// 创建美颜滤镜
GPUImageBeautifyFilter *beautifyFilter = [[GPUImageBeautifyFilter alloc] init];

// 设置GPUImage处理链,从数据源 => 滤镜 => 最终界面效果
[_videoCamera addTarget:beautifyFilter];
[beautifyFilter addTarget:_captureVideoPreview];

demo下载

_brightnessFilter = brightnessFilter;

出口带有美颜功用的摄像流

刚初步集成的时候境遇一个坑,原本的逻辑是兑现AVCaptureVideoDataOutput萨姆pleBufferDelegate方法来收获原始帧

- (void) captureOutput:(AVCaptureOutput *)captureOutput didOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer fromConnection:(AVCaptureConnection *)connection;

而GPUImageVideoCamera也兑现了一个近乎的代办:

@protocol GPUImageVideoCameraDelegate <NSObject>
@optional
- (void)willOutputSampleBuffer:(CMSampleBufferRef)sampleBuffer;
@end

而替换之后发现输出的流依旧是未经美颜的图像,看了贯彻后发现果然,GPUImageVideoCameraDelegate仍然经过AVCaptureVideoDataOutput萨姆pleBufferDelegate直接回到的数目,所以想出口带有滤镜的流那里就得仰仗GPUImageRawDataOutput了

CGSize outputSize = {720, 1280};
GPUImageRawDataOutput *rawDataOutput = [[GPUImageRawDataOutput alloc] initWithImageSize:CGSizeMake(outputSize.width, outputSize.height) resultsInBGRAFormat:YES];
[self.beautifyFilter addTarget:rawDataOutput];

那一个GPUImageRawDataOutput其实就是beautifyFilter的出口工具,可在setNewFrameAvailableBlock方法的block中取得带有滤镜效果的数量

__weak GPUImageRawDataOutput *weakOutput = rawDataOutput;
__weak typeof(self) weakSelf = self;

[rawDataOutput setNewFrameAvailableBlock:^{
    __strong GPUImageRawDataOutput *strongOutput = weakOutput;
    [strongOutput lockFramebufferForReading];

    // 这里就可以获取到添加滤镜的数据了
    GLubyte *outputBytes = [strongOutput rawBytesForImage];
    NSInteger bytesPerRow = [strongOutput bytesPerRowInOutput];
    CVPixelBufferRef pixelBuffer = NULL;
    CVPixelBufferCreateWithBytes(kCFAllocatorDefault, outputSize.width, outputSize.height, kCVPixelFormatType_32BGRA, outputBytes, bytesPerRow, nil, nil, nil, &pixelBuffer);

    // 之后可以利用VideoToolBox进行硬编码再结合rtmp协议传输视频流了
    [weakSelf encodeWithCVPixelBufferRef:pixelBuffer];

    [strongOutput unlockFramebufferAfterReading];
    CFRelease(pixelBuffer);

}];
图像处理

落影lying-in的GPUImage详细解析对GPUImage已毕美颜滤镜的规律和思路做了详细介绍,很多有关图像处理的学问写的很详细,很受用。

参考文献
http://www.jianshu.com/p/2ce9b63ecfef
http://www.jianshu.com/p/4646894245ba

GPUImageBilateralFilter的distance诺玛lizationFactor值越小,磨皮效果越好,distance诺玛lizationFactor取值范围:大于1。

多年来亟待给直播项目中添加美颜的功力,调研了很多SDK和开源代码(视决,涂图,七牛,金山云,videoCore等),综合财力/效果/对项目侵入性,最终决定运用一款基于GPUImage实现的
BeautifyFaceDemo美颜滤镜。

乘势各个各个的直播app的爆火,实时美颜滤镜的须求也更加多。上面将紧要介绍达成美颜滤镜的原理和笔触,原理可以活动看下GPUImage原理,本文紧借使GPUImageBeautifyFilter美颜滤镜的完毕。美颜只是分化滤镜组合起来的效果,实际上美颜也是一种滤镜,只可是它结合了各样须求的滤镜,例如磨皮、美白、进步饱和度、提亮之类的。

// 美白滤镜

Update(8-13)

  1. 至于品质难点,近期把品种中合拢的美颜滤镜(BeautifyFace)里用到的
    GPUImageCannyEdgeDetectionFilter 替换为
    GPUImageSobelEdgeDetectionFilter
    会有很大改进,而且意义大致同一,6s经过长日子测试没有再现高温警告了。(替换也不行简约,直接改俩处类名/变量名就足以了)

  2. 享受一个BUG,目前发觉当打开美颜的时候,关闭直播内存照旧没有自由。分析得出GPUImageRawDataOutput的setNewFrameAvailableBlock方法的block参数仍然维持着self,解决思路就是将GPUImageRawDataOutput移除。

先附上以前的连带release代码:

    [self.videoCamera stopCameraCapture];
    [self.videoCamera removeInputsAndOutputs];
    [self.videoCamera removeAllTargets];

开端以为camera调用removeAllTargets会把camera上边的filter,以及filter的output一同释放,但事实上camera并不会’辅助’移除filter的target,所以须要加上:

    [self.beautifyFilter removeAllTargets]; //修复开启美颜内存无法释放的问题

关门美颜output是直接加在camera上,camera直接removeAllTargets就足以;
打开美颜output加在filter上,camera和filter都须求removeAllTargets。

GPUImageBeautifyFilter

GPUImageBeautifyFilter是基于GPUImage的实时美颜滤镜,包括
GPUImageBilateralFilterGPUImageCombinationFilterGPUImageHSBFilter

GPUImageBeautifyFilter.h创制下面的目标

@interface GPUImageBeautifyFilter : GPUImageFilterGroup {
GPUImageBilateralFilter *bilateralFilter;
GPUImageCannyEdgeDetectionFilter *cannyEdgeFilter;
GPUImageCombinationFilter *combinationFilter;
GPUImageHSBFilter *hsbFilter;
}

制图步骤如下:
预备纹理
制图纹理
来得处理后的纹理

美白(GPUImage布赖特nessFilter):本质就是增高亮度。

现阶段照例存在的题材

透过和其他产品相比较,GPUImageBeautifyFilter磨皮效果和花椒最为接近。这里运用双边滤波,
花椒应该用了高斯模糊完毕。同印客相比较,美白成效一般。

二、绘制纹理:

7、判断纹理数量
GPUImageCombinationFilter判断是不是有多少个纹理,四个纹理都早已准备好后
调用GPUImageThreeInputFilter的绘图函数renderToTextureWithVertices:
textureCoordinates:,
图像绘制完后,把图像设置为GPUImageHSBFilter的输入纹理,
照会GPUImageHSBFilter纹理已经绘制已毕;

8、绘制纹理
GPUImageHSBFilter调用renderToTextureWithVertices:
textureCoordinates:绘制图像,
做到后把图像设置为GPUImageView的输入纹理,并公告GPUImageView输入纹理已经绘制完毕;

[_videoCamera addTarget:_captureVideoPreview];

还留存些关于质量的标题:

1 调用setNewFrameAvailableBlock后很多机型只可以跑到不多不少15fps
2 在6s那代机型上温度很高,帧率可到30fps但不平静

步骤三:成立最后目标源:GPUImageView

比如:墨镜原理,从外边流传光线,会通过墨镜过滤,在传给大家的肉眼,就能感受到大白天也是乌黑一片,哈哈。

手续四:创制滤镜组(GPUImageFilterGroup),要求整合亮度(GPUImage布赖特nessFilter)和双面滤波(GPUImageBilateralFilter)这多少个滤镜达到美颜效果.

美颜滤镜

// 设置GPUImage处理链,从数据源 => 滤镜 => 最后界面效果

[groupFilter addTarget:bilateralFilter];

// cameraPosition:视频头方向

步骤七:开首采集视频

GPUImageView *captureVideoPreview = [[GPUImageView alloc]
initWithFrame:self.view.bounds];

– (void)viewDidLoad {

}

动用GPUImage处理直播进度中国和美利坚联邦合众国颜的流程

// 开头收集摄像

[self.view insertSubview:captureVideoPreview atIndex:0];

– (IBAction)bilateralFilter:(UISlider *)sender {

}

不可能不调用startCameraCapture,底层才会把募集到的摄像源,渲染到GPUImageView中,就能显得了。

GPUImageMovie:用于拍卖已经拍摄好的视频,比如mp5文件

GPUImage:是一个依照OpenGL ES
2.0图像和摄像拍卖的开源iOS框架,提供种种各类的图像处理滤镜,并且支持照相机和视频机的实时滤镜,内置120多种滤镜效果,并且可以自定义图像滤镜。

}

// SessionPreset:显示屏分辨率,AVCaptureSessionPresetHigh会自适应高分辨率

手续四:创立最后目标源:GPUImageView

步骤一:使用Cocoapods导入GPUImage

GPUImage所有滤镜介绍

步骤一:使用Cocoapods导入GPUImage

SessionPreset最好使用AVCaptureSessionPresetHigh,会自动识别,即便用太高分辨率,当前设施不协助会一贯报错

手续六:设置GPUImage处理链,从数据源 => 滤镜 => 最后界面效果

步骤五:创制最终美颜滤镜:GPUImageBeautifyFilter

GPUImage处理重大分为3个环节

– (IBAction)openBeautifyFilter:(UISwitch *)sender {

// 磨皮滤镜

– (IBAction)brightnessFilter:(UISlider *)sender {

GPUImage的final
target:GPUImageView,GPUImageMovieWriter就好比大家肉眼,最后输入目的。

_videoCamera = videoCamera;

磨皮(GPUImageBilateralFilter):本质就是让像素点模糊,可以动用高斯模糊,不过也许导致边缘会不明显,用两者滤波(Bilateral
Filter) ,有针对性的歪曲像素点,能担保边缘不被张冠李戴。

[beautifyFilter addTarget:_captureVideoPreview];

_captureVideoPreview = captureVideoPreview;

[groupFilter setInitialFilters:@[bilateralFilter]];

GPUImageBilateralFilter *bilateralFilter = [[GPUImageBilateralFilter
alloc] init];

[super viewDidLoad];

source(摄像、图片源) -> filter(滤镜) -> final target
(处理后摄像、图片)

支出一款直播app,美颜作用是很关键的,若是没有美颜作用,可能分秒钟钟掉粉千万,本篇首要助教直播中国和美利坚合众国颜作用的已毕原理,并且完毕美颜功用。

// SessionPreset:显示屏分辨率,AVCaptureSessionPresetHigh会自适应高分辨率

美颜原理

}

if (sender.on) {

_bilateralFilter = bilateralFilter;

}

GPUImaged的Source:都接二连三GPUImageOutput的子类,作为GPUImage的数据源,就好比外面的强光,作为眼睛的输出源

[self.view insertSubview:captureVideoPreview atIndex:0];

CGFloat maxValue = 10;

GPUImageBeautifyFilter *beautifyFilter = [[GPUImageBeautifyFilter
alloc] init];

// 切换美颜作用原理:移除之前所有处理链,重新安装处理链

GPUImage原生美颜功效

// 移除以前所有处理链

步骤五:设置滤镜组链

利用美颜滤镜完成

// 成立视频源

关怀效果,忽悠我

// 设置GPUImage响应链,从数据源 => 滤镜 => 最后界面效果

videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;

[_videoCamera addTarget:beautifyFilter];

GPUImageVideoCamera必需求强引用,否则会被销毁,无法源源搜集视频.

手续三:创立摄像源GPUImageVideoCamera

//
必须调用startCameraCapture,底层才会把采访到的摄像源,渲染到GPUImageView中,就能显得了。

[_videoCamera removeAllTargets];

GPUImageVideoCamera:用于实时拍摄摄像

GPUImageFilterGroup *groupFilter = [[GPUImageFilterGroup alloc]
init];

若是喜欢我的篇章,可以关心本身乐乎:袁峥Seemygo,也可以来小码哥,领悟下我们的iOS培训科目。后续还会更新更加多内容,有任何难题,欢迎简书留言袁峥Seemygo

GPUImage处理画面原理

GPU:(Graphic Processor
Unit图形处理单元)手机如故电脑用于图像处理和渲染的硬件

[groupFilter addTarget:brightnessFilter];

// 创制视频源

// 创设滤镜:磨皮,美白,组合滤镜

步骤六:设置GPUImage处理链,从数据源 => 滤镜 => 最后界面效果

// Do any additional setup after loading the view.

GPUImageView *captureVideoPreview = [[GPUImageView alloc]
initWithFrame:self.view.bounds];

}

_brightnessFilter.brightness = sender.value;

滤镜处理的规律:就是把静态图片或者视频的每一帧举行图片变换再突显出来。它的敬亭山真面目就是像素点的坐标和颜色变化

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

// 创造美颜滤镜

GPUImage原生美颜

// cameraPosition:视频头方向

_videoCamera = videoCamera;

注意点:

相似的target可分为两类

GPUImagePicture:用于拍卖已经拍照好的图纸,比如png,jpg图片

OpenGL ES:(Open Graphics Library For Embedded(嵌入的)
Systems开源嵌入式系统图形处理框架),一套图形与硬件接口,用于把拍卖好的图样显示到显示器上。

groupFilter.terminalFilter = brightnessFilter;

注意:

[videoCamera addTarget:groupFilter];

GPUImage的filter:GPUimageFilter类或者子类,这些类继承自GPUImageOutput,并且遵循GPUImageInput协议,那样既能流进,又能流出,就好比大家的墨镜,光线通过墨镜的拍卖,最后进入大家肉眼

收集视频 => 获取每一帧图片 => 滤镜处理 => GPUImageView展现

// 创造最后预览View

[super viewDidLoad];

[_videoCamera addTarget:_captureVideoPreview];

GPUImageVideoCamera *videoCamera = [[GPUImageVideoCamera alloc]
initWithSessionPreset:AVCaptureSessionPresetHigh
cameraPosition:AVCaptureDevicePositionFront];

[_videoCamera removeAllTargets];

} else {

切换美颜功效原理:移除之前所有处理链,重新安装处理链

在看这篇此前,假诺您还不了然直播原理,请查看那篇文章怎么样高效的付出一个完完全全的iOS直播app(原理篇)

[bilateralFilter addTarget:brightnessFilter];

[videoCamera startCameraCapture];

// 移除以前所有处理链

美颜基本概念

// 设置滤镜组链

步骤二:导入GPUImageBeautifyFilter文件夹

//
必须调用startCameraCapture,底层才会把募集到的视频源,渲染到GPUImageView中,就能显得了。

// 开始征集摄像

GPUImageVideoCamera *videoCamera = [[GPUImageVideoCamera alloc]
initWithSessionPreset:AVCaptureSessionPresetHigh
cameraPosition:AVCaptureDevicePositionFront];

使用美颜滤镜完结效益

说到底环节的target, GPUImageView:用于展现到显示器上,
或者GPUImageMovieWriter:写成视频文件。

[videoCamera startCameraCapture];

// 创制最终预览View

// 值越小,磨皮效果越好

GPU工作原理:CPU指定突显控制器工作,突显控制器依据CPU的支配到指定的位置去取数据和下令,
近期的多少貌似是从显存里取,若是显存里存不下,则从内存里取,
内存也放不下,则从硬盘里取,当然也不是内存放不下,而是为了节约内存的话,可以置身硬盘里,然后经过指令控制突显控制器去取。

// 设置处理链

GPUImage采取链式格局来拍卖画面,通过addTarget:方法为链条添加每个环节的目的,处理完一个target,就会把上一个环节处理好的图像数据传递下一个target去处理,称为GPUImage处理链。

步骤二:创立视频源GPUImageVideoCamera

GPUImageStillCamera:用于实时拍摄照片

中间环节的target,  一般是各类filter, 是GPUImageFilter或者是子类.

美图秀秀滤镜大集中

GPUImage扩展

– (void)viewDidLoad {

videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;

[groupFilter addTarget:captureVideoPreview];

[_bilateralFilter setDistanceNormalizationFactor:(maxValue –
sender.value)];

GPUImage实战

相关文章