手把手教你实现微信小视频iOS代码实现

前段时间项目要求需要在聊天模块中加入类似微信的小视频功能，这边博客主要是为了总结遇到的问题和解决方法，希望能够对有同样需求的朋友有所帮助。

效果预览：

这里先罗列遇到的主要问题：　　
 1.视频剪裁  微信的小视频只是取了摄像头获取的一部分画面
 2.滚动预览的卡顿问题  AVPlayer播放视频在滚动中会出现很卡的问题

接下来让我们一步步来实现。
Part 1 实现视频录制
1.录制类WKMovieRecorder实现
创建一个录制类WKMovieRecorder，负责视频录制。 

@interface WKMovieRecorder : NSObject
+ (WKMovieRecorder*) sharedRecorder;
- (instancetype)initWithMaxDuration:(NSTimeInterval)duration;
@end

定义回调block 

/**
* 录制结束
*
* @param info   回调信息
* @param isCancle YES:取消 NO:正常结束
*/
typedef void(^FinishRecordingBlock)(NSDictionary *info, WKRecorderFinishedReason finishReason);
/**
* 焦点改变
*/
typedef void(^FocusAreaDidChanged)();
/**
* 权限验证
*
* @param success 是否成功
*/
typedef void(^AuthorizationResult)(BOOL success);
@interface WKMovieRecorder : NSObject
//回调
@property (nonatomic, copy) FinishRecordingBlock finishBlock;//录制结束回调
@property (nonatomic, copy) FocusAreaDidChanged focusAreaDidChangedBlock;
@property (nonatomic, copy) AuthorizationResult authorizationResultBlock;
@end

定义一个cropSize用于视频裁剪 
@property (nonatomic, assign) CGSize cropSize;

接下来就是capture的实现了，这里代码有点长，懒得看的可以直接看后面的视频剪裁部分

录制配置：

@interface WKMovieRecorder ()
<
AVCaptureVideoDataOutputSampleBufferDelegate,
AVCaptureAudioDataOutputSampleBufferDelegate,
WKMovieWriterDelegate
>
{
AVCaptureSession* _session;
AVCaptureVideoPreviewLayer* _preview;
WKMovieWriter* _writer;
//暂停录制
BOOL _isCapturing;
BOOL _isPaused;
BOOL _discont;
int _currentFile;
CMTime _timeOffset;
CMTime _lastVideo;
CMTime _lastAudio;
NSTimeInterval _maxDuration;
}
// Session management.
@property (nonatomic, strong) dispatch_queue_t sessionQueue;
@property (nonatomic, strong) dispatch_queue_t videoDataOutputQueue;
@property (nonatomic, strong) AVCaptureSession *session;
@property (nonatomic, strong) AVCaptureDevice *captureDevice;
@property (nonatomic, strong) AVCaptureDeviceInput *videoDeviceInput;
@property (nonatomic, strong) AVCaptureStillImageOutput *stillImageOutput;
@property (nonatomic, strong) AVCaptureConnection *videoConnection;
@property (nonatomic, strong) AVCaptureConnection *audioConnection;
@property (nonatomic, strong) NSDictionary *videoCompressionSettings;
@property (nonatomic, strong) NSDictionary *audioCompressionSettings;
@property (nonatomic, strong) AVAssetWriterInputPixelBufferAdaptor *adaptor;
@property (nonatomic, strong) AVCaptureVideoDataOutput *videoDataOutput;
//Utilities
@property (nonatomic, strong) NSMutableArray *frames;//存储录制帧
@property (nonatomic, assign) CaptureAVSetupResult result;
@property (atomic, readwrite) BOOL isCapturing;
@property (atomic, readwrite) BOOL isPaused;
@property (nonatomic, strong) NSTimer *durationTimer;
@property (nonatomic, assign) WKRecorderFinishedReason finishReason;
@end

实例化方法： 

+ (WKMovieRecorder *)sharedRecorder
{
static WKMovieRecorder *recorder;
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
recorder = [[WKMovieRecorder alloc] initWithMaxDuration:CGFLOAT_MAX];
});
return recorder;
}
- (instancetype)initWithMaxDuration:(NSTimeInterval)duration
{
if(self = [self init]){
_maxDuration = duration;
_duration = 0.f;
}
return self;
}
- (instancetype)init
{
self = [super init];
if (self) {
_maxDuration = CGFLOAT_MAX;
_duration = 0.f;
_sessionQueue = dispatch_queue_create("wukong.movieRecorder.queue", DISPATCH_QUEUE_SERIAL );
_videoDataOutputQueue = dispatch_queue_create( "wukong.movieRecorder.video", DISPATCH_QUEUE_SERIAL );
dispatch_set_target_queue( _videoDataOutputQueue, dispatch_get_global_queue( DISPATCH_QUEUE_PRIORITY_HIGH, 0 ) );
}
return self;
}

2.初始化设置
初始化设置分别为session创建、权限检查以及session配置
1）.session创建
self.session = [[AVCaptureSession alloc] init];
self.result = CaptureAVSetupResultSuccess;

2）.权限检查

//权限检查
switch ([AVCaptureDevice authorizationStatusForMediaType:AVMediaTypeVideo]) {
case AVAuthorizationStatusNotDetermined: {
[AVCaptureDevice requestAccessForMediaType:AVMediaTypeVideo completionHandler:^(BOOL granted) {
if (granted) {
self.result = CaptureAVSetupResultSuccess;
}
}];
break;
}
case AVAuthorizationStatusAuthorized: {
break;
}
default:{
self.result = CaptureAVSetupResultCameraNotAuthorized;
}
}
if ( self.result != CaptureAVSetupResultSuccess) {
if (self.authorizationResultBlock) {
self.authorizationResultBlock(NO);
}
return;
}

3）.session配置
session配置是需要注意的是AVCaptureSession的配置不能在主线程, 需要自行创建串行线程。 
3.1.1 获取输入设备与输入流

AVCaptureDevice *captureDevice = [[self class] deviceWithMediaType:AVMediaTypeVideo preferringPosition:AVCaptureDevicePositionBack];
_captureDevice = captureDevice;
NSError *error = nil;
_videoDeviceInput = [[AVCaptureDeviceInput alloc] initWithDevice:captureDevice error:&error];
if (!_videoDeviceInput) {
NSLog(@"未找到设备");
}

3.1.2 录制帧数设置
帧数设置的主要目的是适配iPhone4，毕竟是应该淘汰的机器了

int frameRate;
if ( [NSProcessInfo processInfo].processorCount == 1 )
{
if ([self.session canSetSessionPreset:AVCaptureSessionPresetLow]) {
[self.session setSessionPreset:AVCaptureSessionPresetLow];
}
frameRate = 10;
}else{
if ([self.session canSetSessionPreset:AVCaptureSessionPreset640x480]) {
[self.session setSessionPreset:AVCaptureSessionPreset640x480];
}
frameRate = 30;
}
CMTime frameDuration = CMTimeMake( 1, frameRate );
if ( [_captureDevice lockForConfiguration:&error] ) {
_captureDevice.activeVideoMaxFrameDuration = frameDuration;
_captureDevice.activeVideoMinFrameDuration = frameDuration;
[_captureDevice unlockForConfiguration];
}
else {
NSLog( @"videoDevice lockForConfiguration returned error %@", error );
}

3.1.3 视频输出设置
视频输出设置需要注意的问题是：要设置videoConnection的方向，这样才能保证设备旋转时的显示正常。 

//Video
if ([self.session canAddInput:_videoDeviceInput]) {
[self.session addInput:_videoDeviceInput];
self.videoDeviceInput = _videoDeviceInput;
[self.session removeOutput:_videoDataOutput];
AVCaptureVideoDataOutput *videoOutput = [[AVCaptureVideoDataOutput alloc] init];
_videoDataOutput = videoOutput;
videoOutput.videoSettings = @{ (id)kCVPixelBufferPixelFormatTypeKey : @(kCVPixelFormatType_32BGRA) };
[videoOutput setSampleBufferDelegate:self queue:_videoDataOutputQueue];
videoOutput.alwaysDiscardsLateVideoFrames = NO;
if ( [_session canAddOutput:videoOutput] ) {
[_session addOutput:videoOutput];
[_captureDevice addObserver:self forKeyPath:@"adjustingFocus" options:NSKeyValueObservingOptionNew context:FocusAreaChangedContext];
_videoConnection = [videoOutput connectionWithMediaType:AVMediaTypeVideo];
if(_videoConnection.isVideoStabilizationSupported){
_videoConnection.preferredVideoStabilizationMode = AVCaptureVideoStabilizationModeAuto;
}
UIInterfaceOrientation statusBarOrientation = [UIApplication sharedApplication].statusBarOrientation;
AVCaptureVideoOrientation initialVideoOrientation = AVCaptureVideoOrientationPortrait;
if ( statusBarOrientation != UIInterfaceOrientationUnknown ) {
initialVideoOrientation = (AVCaptureVideoOrientation)statusBarOrientation;
}
_videoConnection.videoOrientation = initialVideoOrientation;
}
}
else{
NSLog(@"无法添加视频输入到会话");
}

3.1.4 音频设置 
需要注意的是为了不丢帧，需要把音频输出的回调队列放在串行队列中 

//audio
AVCaptureDevice *audioDevice = [AVCaptureDevice defaultDeviceWithMediaType:AVMediaTypeAudio];
AVCaptureDeviceInput *audioDeviceInput = [AVCaptureDeviceInput deviceInputWithDevice:audioDevice error:&error];
if ( ! audioDeviceInput ) {
NSLog( @"Could not create audio device input: %@", error );
}
if ( [self.session canAddInput:audioDeviceInput] ) {
[self.session addInput:audioDeviceInput];
}
else {
NSLog( @"Could not add audio device input to the session" );
}
AVCaptureAudioDataOutput *audioOut = [[AVCaptureAudioDataOutput alloc] init];
// Put audio on its own queue to ensure that our video processing doesn't cause us to drop audio
dispatch_queue_t audioCaptureQueue = dispatch_queue_create( "wukong.movieRecorder.audio", DISPATCH_QUEUE_SERIAL );
[audioOut setSampleBufferDelegate:self queue:audioCaptureQueue];
if ( [self.session canAddOutput:audioOut] ) {
[self.session addOutput:audioOut];
}
_audioConnection = [audioOut connectionWithMediaType:AVMediaTypeAudio];

还需要注意一个问题就是对于session的配置代码应该是这样的 
[self.session beginConfiguration];

...配置代码

[self.session commitConfiguration];

由于篇幅问题，后面的录制代码我就挑重点的讲了。
3.2  视频存储
现在我们需要在AVCaptureVideoDataOutputSampleBufferDelegate与AVCaptureAudioDataOutputSampleBufferDelegate的回调中，将音频和视频写入沙盒。在这个过程中需要注意的，在启动session后获取到的第一帧黑色的，需要放弃。
3.2.1 创建WKMovieWriter类来封装视频存储操作
WKMovieWriter的主要作用是利用AVAssetWriter拿到CMSampleBufferRef，剪裁后再写入到沙盒中。
这是剪裁配置的代码，AVAssetWriter会根据cropSize来剪裁视频，这里需要注意的一个问题是cropSize的width必须是320的整数倍，不然的话剪裁出来的视频右侧会出现一条绿色的线

　NSDictionary *videoSettings;
if (_cropSize.height == 0 || _cropSize.width == 0) {
_cropSize = [UIScreen mainScreen].bounds.size;
}
videoSettings = [NSDictionary dictionaryWithObjectsAndKeys:
AVVideoCodecH264, AVVideoCodecKey,
[NSNumber numberWithInt:_cropSize.width], AVVideoWidthKey,
[NSNumber numberWithInt:_cropSize.height], AVVideoHeightKey,
AVVideoScalingModeResizeAspectFill,AVVideoScalingModeKey,
nil];

至此，视频录制就完成了。
接下来需要解决的预览的问题了 

Part 2 卡顿问题解决
1.1 gif图生成 
通过查资料发现了这篇blog 介绍说微信团队解决预览卡顿的问题使用的是播放图片gif，但是博客中的示例代码有问题，通过CoreAnimation来播放图片导致内存暴涨而crash。但是，还是给了我一些灵感，因为之前项目的启动页用到了gif图片的播放，所以我就想能不能把视频转成图片，然后再转成gif图进行播放，这样不就解决了问题了吗。于是我开始google功夫不负有心人找到了，图片数组转gif图片的方法。

gif图转换代码 

static void makeAnimatedGif(NSArray *images, NSURL *gifURL, NSTimeInterval duration) {
NSTimeInterval perSecond = duration /images.count;
NSDictionary *fileProperties = @{
(__bridge id)kCGImagePropertyGIFDictionary: @{
(__bridge id)kCGImagePropertyGIFLoopCount: @0, // 0 means loop forever
}
};
NSDictionary *frameProperties = @{
(__bridge id)kCGImagePropertyGIFDictionary: @{
(__bridge id)kCGImagePropertyGIFDelayTime: @(perSecond), // a float (not double!) in seconds, rounded to centiseconds in the GIF data
}
};
CGImageDestinationRef destination = CGImageDestinationCreateWithURL((__bridge CFURLRef)gifURL, kUTTypeGIF, images.count, NULL);
CGImageDestinationSetProperties(destination, (__bridge CFDictionaryRef)fileProperties);
for (UIImage *image in images) {
@autoreleasepool {
CGImageDestinationAddImage(destination, image.CGImage, (__bridge CFDictionaryRef)frameProperties);
}
}
if (!CGImageDestinationFinalize(destination)) {
NSLog(@"failed to finalize image destination");
}else{
}
CFRelease(destination);
}

转换是转换成功了，但是出现了新的问题，使用ImageIO生成gif图片时会导致内存暴涨，瞬间涨到100M以上，如果多个gif图同时生成的话一样会crash掉，为了解决这个问题需要用一个串行队列来进行gif图的生成　　 

1.2 视频转换为UIImages
主要是通过AVAssetReader、AVAssetTrack、AVAssetReaderTrackOutput 来进行转换 

//转成UIImage
- (void)convertVideoUIImagesWithURL:(NSURL *)url finishBlock:(void (^)(id images, NSTimeInterval duration))finishBlock
{
AVAsset *asset = [AVAsset assetWithURL:url];
NSError *error = nil;
self.reader = [[AVAssetReader alloc] initWithAsset:asset error:&error];
NSTimeInterval duration = CMTimeGetSeconds(asset.duration);
__weak typeof(self)weakSelf = self;
dispatch_queue_t backgroundQueue = dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_HIGH, 0);
dispatch_async(backgroundQueue, ^{
__strong typeof(weakSelf) strongSelf = weakSelf;
NSLog(@"");
if (error) {
NSLog(@"%@", [error localizedDescription]);
}
NSArray *videoTracks = [asset tracksWithMediaType:AVMediaTypeVideo];
AVAssetTrack *videoTrack =[videoTracks firstObject];
if (!videoTrack) {
return ;
}
int m_pixelFormatType;
//   视频播放时，
m_pixelFormatType = kCVPixelFormatType_32BGRA;
// 其他用途，如视频压缩
//  m_pixelFormatType = kCVPixelFormatType_420YpCbCr8BiPlanarVideoRange;
NSMutableDictionary *options = [NSMutableDictionary dictionary];
[options setObject:@(m_pixelFormatType) forKey:(id)kCVPixelBufferPixelFormatTypeKey];
AVAssetReaderTrackOutput *videoReaderOutput = [[AVAssetReaderTrackOutput alloc] initWithTrack:videoTrack outputSettings:options];
if ([strongSelf.reader canAddOutput:videoReaderOutput]) {
[strongSelf.reader addOutput:videoReaderOutput];
}
[strongSelf.reader startReading];
NSMutableArray *images = [NSMutableArray array];
// 要确保nominalFrameRate>0，之前出现过android拍的0帧视频
while ([strongSelf.reader status] == AVAssetReaderStatusReading && videoTrack.nominalFrameRate > 0) {
@autoreleasepool {
// 读取 video sample
CMSampleBufferRef videoBuffer = [videoReaderOutput copyNextSampleBuffer];
if (!videoBuffer) {
break;
}
[images addObject:[WKVideoConverter convertSampleBufferRefToUIImage:videoBuffer]];
CFRelease(videoBuffer);
}
}
if (finishBlock) {
dispatch_async(dispatch_get_main_queue(), ^{
finishBlock(images, duration);
});
}
});
}

在这里有一个值得注意的问题，在视频转image的过程中，由于转换时间很短，在短时间内videoBuffer不能够及时得到释放，在多个视频同时转换时任然会出现内存问题，这个时候就需要用autoreleasepool来实现及时释放 

@autoreleasepool {
// 读取 video sample
CMSampleBufferRef videoBuffer = [videoReaderOutput copyNextSampleBuffer];
　　if (!videoBuffer) {
break;
}
　　[images addObject:[WKVideoConverter convertSampleBufferRefToUIImage:videoBuffer]];
　　 CFRelease(videoBuffer); }

至此，微信小视频的难点(我认为的)就解决了，至于其他的实现代码请看demo就基本实现了，demo可以从这里下载。

视频暂停录制 http://www.gdcl.co.uk/2013/02/20/iPhone-Pause.html
视频crop绿边解决 http://stackoverflow.com/questions/22883525/avassetexportsession-giving-me-a-green-border-on-right-and-bottom-of-output-vide
视频裁剪：http://stackoverflow.com/questions/15737781/video-capture-with-11-aspect-ratio-in-ios/16910263#16910263
CMSampleBufferRef转image https://developer.apple.com/library/ios/qa/qa1702/_index.html
微信小视频分析 http://www.jianshu.com/p/3d5ccbde0de1

感谢以上文章的作者

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

• 浅析iOS中视频播放的几种方案
• iOS开发之获取系统相册中的图片与视频教程(内带url转换)
• IOS实现视频动画效果的启动图
• iOS实现视频和图片的上传思路
• 详解iOS应用中播放本地视频以及选取本地音频的组件用法
• iOS中视频播放器的简单封装详解
• iOS中读取照片库及保存图片或视频到照片库的要点解析
• iOS视频录制（或选择）压缩及上传功能（整理）
• iOS 本地视频和网络视频流播放实例代码
• iOS AVCaptureSession实现视频录制功能