---

  任何一款直播軟件都必需停止美顏，不然哪來的那麼多美女，所以技術改動世界，不只是說說而已。美顏在采集的時分就得就行，讓主播實時看到直播的效果。

1.美顏原理

  其實美顏的實質就是美白和磨皮，辨別經過進步亮度和模糊像素點停止。我們普通用GPUImage這個開源的圖像處置庫來完成。視頻的實質就是一張張延續的圖片，磨皮就是關於圖片上的像素點的取值與周邊的像素點取值相關聯。罕見的有高斯模糊和雙邊濾波(Bilateral Filter)。
  高斯模糊是最罕見的一種模糊方式，像素點取值是由周邊像素點求加權均勻所得，而權重系數則是像素間的間隔的高斯函數，大致關系是間隔越小、權重系數越大。高斯模糊會招致邊緣不明晰。
  雙邊濾波是有針對點的模糊像素點，能保證邊緣不被模糊。

2.GPUImage引見

  GPUImage 是一個開源的基於GPU的圖片或視頻的處置框架，其自身內置了多達120多種罕見的濾鏡效果。有了它，添加實時的濾鏡只需求復雜地添加幾行代碼,十分弱小。想研討源碼的同窗上，可以去GitHub上下載。

3.效果

&esmp;&esmp;請原諒這篇只要UI效果圖。用兩個Slider來控制磨皮和美白的效果，從上到下取值范圍辨別為[-1,1] [0,100];

4.GPUImage運用辦法

1.用CocoaPods集成到項目中。

pod 'GPUImage', '~> 0.1.7'

2.代碼演示

#import "FHUImageFilterViewController.h"
#import <GPUImage/GPUImage.h>

@interface FHUImageFilterViewController ()

// 視頻源
@property (nonatomic, strong)GPUImageVideoCamera *videoCamera;
// 磨皮濾鏡
@property (nonatomic, weak)GPUImageBilateralFilter *bilateralFilter;
// 美白濾鏡
@property (nonatomic, weak)GPUImageBrightnessFilter *brightnessFilter;
@end

@implementation FHUImageFilterViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    // 創立視屏源
      /*
     * sessionPreset : 屏幕分辨率
     * cameraPosition： 攝像頭地位
     **/
    GPUImageVideoCamera *videoCamera = [[GPUImageVideoCamera alloc] initWithSessionPreset:AVCaptureSessionPresetHigh cameraPosition:AVCaptureDevicePositionFront];
    // 設置輸入圖像方向
    videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;
    self.videoCamera = videoCamera;
    
    // 創立最終預覽View
    GPUImageView *captureVideoPreview = [[GPUImageView alloc] initWithFrame:self.view.bounds];
    captureVideoPreview.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    [self.view insertSubview:captureVideoPreview atIndex:0];
    
    // 創立濾鏡：磨皮，美白，組合濾鏡
    GPUImageFilterGroup *groupFilter = [[GPUImageFilterGroup alloc] init];
   
    // 磨皮濾鏡
    GPUImageBilateralFilter *bilateraFilter = [[GPUImageBilateralFilter alloc] init];
    [groupFilter addTarget:bilateraFilter];
    _bilateralFilter = bilateraFilter;
    
    // 美白濾鏡
    GPUImageBrightnessFilter *brightnessFilter = [[GPUImageBrightnessFilter alloc] init];
    [groupFilter addTarget:brightnessFilter];
    _brightnessFilter = brightnessFilter;
    
    // 設置濾鏡組鏈
    [bilateraFilter addTarget:brightnessFilter];
    [groupFilter setInitialFilters:@[bilateraFilter]];
    groupFilter.terminalFilter = brightnessFilter;
    
    // 設置GPUImage的呼應鏈， 從數據源 ==> 濾鏡 ==> 最終界面效果
    [videoCamera addTarget:groupFilter];
    [groupFilter addTarget:captureVideoPreview];
    
    // 必需采用startCameraCapture, 底層才會把采集到的視頻源，渲染到GPUImageView中，就能顯示了。
    [videoCamera startCameraCapture];
}

備注：手機分辨率(sessionPreset)有13個值可選，但最好設置成AVCaptureSessionPresetHigh，手時機自動辨認。假如設置的太高，手機不支持，會直接報錯。

- (IBAction)brightnessFiller:(id)sender {
    UISlider *slider = (UISlider *)sender;
    // 亮度(brightness)
    _brightnessFilter.brightness = slider.value;
}
- (IBAction)bilateralFilter:(id)sender {
    UISlider *slider = (UISlider *)sender;
    CGFloat maxValue = 100;
    //平滑因子(distanceNormalizationFactor)
    _bilateralFilter.distanceNormalizationFactor = maxValue - slider.value;
    NSLog(@"distanceNormalizationFactor=%f",_bilateralFilter.distanceNormalizationFactor);
}

備注：(1)亮度(brightness)取值范圍[-1,1],0為正常形態，默許。
(2)平滑因子(distanceNormalizationFactor)值越小，磨皮效果越好，默許為8。我為了演示效果，把最大值設置成100，這樣簡直就沒有磨皮效果了，平常最好10以內。最好大於0，不然就會變形。

5.自定義濾鏡

  假如你覺得GPUImage自帶的濾鏡不夠用的話，也可以自定義濾鏡，運用方式和下面的差不多。我以一一般人寫的美顏濾鏡為例。
1.demo下載地址。把GPUImageBeautifyFilter文件夾導入你的工程中。
2.代碼演示

#import "FHBeautyViewController.h"
#import "GPUImageBeautifyFilter.h"
#import <GPUImage/GPUImage.h>

@interface FHBeautyViewController ()
//視頻源一定要強援用
@property(nonatomic,strong) GPUImageVideoCamera *videoCamera;

@end

@implementation FHBeautyViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // 創立視頻源
    _videoCamera  = [[GPUImageVideoCamera alloc] initWithSessionPreset:AVCaptureSessionPresetHigh cameraPosition:AVCaptureDevicePositionFront];
    _videoCamera.outputImageOrientation = UIInterfaceOrientationPortrait;
    
    // 創立美顏濾鏡
    GPUImageBeautifyFilter *beautifyFilter = [[GPUImageBeautifyFilter alloc] init];
    
    // 創立最終預覽View
    GPUImageView *captureVideoPreview = [[GPUImageView alloc] initWithFrame:self.view.bounds];
    captureVideoPreview.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;
    [self.view insertSubview:captureVideoPreview atIndex:0];
    
    // 設置GPUImage處置鏈，從數據源 => 濾鏡 => 最終界面效果
    [_videoCamera addTarget:beautifyFilter];
    [beautifyFilter addTarget:captureVideoPreview];

    // 開端采集視屏
    [_videoCamera startCameraCapture];
    
}

6.demo下載

  demo下載地址。下載上去運轉，發現報錯。

  那是由於我沒有在工程裡上傳ijkplayer視屏直播框架，我能上傳上去，但下載太慢了，什麼緣由大家都懂得。我把ijkplayer視屏直播框架放到百度雲上了，沒有密碼，下載上去之後，放到LiveAppDemo-master文件夾裡，重新翻開就可以運轉了。



【iOS從零開端學習直播之3.美顏】的相關資料介紹到這裡，希望對您有所幫助！ 提示：不會對讀者因本文所帶來的任何損失負責。如果您支持就請把本站添加至收藏夾哦！