公司有個需求，做表情包功能，設計師會給我一套gif（包括做好的gif圖和這個gif的每一張圖片），結合視頻錄制功能，做成最長錄制3秒的表情包，這個表情包的效果上有一些動態掛件，就像下圖這種（圖1）：
不賣關子，我直接說我的邏輯：首先錄制視頻，錄制完成后，根據錄制時間，按每秒10張圖片的規則來按幀取圖片，將取出來的圖片逐一和動態掛件的gif圖的每張圖片合成，最后用合成好的圖片生成一張gif圖。PS:這里我說一下，設計做的動態模板gif，每張圖片的時間間隔是0.1S，這樣做出來的效果比較好。并且合成gif前的每張圖片的大小大概是35K左右，這里需要一些方法，我直接貼到下面，大家自行取用。
//圖片合成 image1是背景圖片 image2是gif圖片
- (UIImage *)addImage:(UIImage *)image1 withImage:(UIImage *)image2 {
? ? UIGraphicsBeginImageContext(image1.size);
? ? CGFloat image2Width =image2.size.width;
? ? CGFloat image1Width =image1.size.width;
? ? CGFloat image1Height = image1.size.height;
? ? CGFloat image2Height = image2.size.height;
? ? CGFloat resultImageHeight = 520;//我們拍的視頻是520pt*520pt的（2倍圖）
? ? [image1 drawInRect:CGRectMake(0, 0, image1Width, image1Height) blendMode:kCGBlendModeNormal alpha:1];
? ? [image2 drawInRect:CGRectMake(0,resultImageHeight-image2Height, image2Width*image1Width/resultImageHeight*1.0, image2Height*image1Width/resultImageHeight*1.0)];//因為軟件生成的gif圖片不是520*520的，所以保證合成的時候底邊是對齊的
? ? UIImage *resultingImage = UIGraphicsGetImageFromCurrentImageContext();
? ? NSData *tData = UIImageJPEGRepresentation(resultingImage, 0.0);
? ? UIImage *tImage = [UIImage imageWithData:tData];
? ? UIImage *lastImage = [self imageWithImage:tImage scaledToSize:CGSizeMake(260, 260)];
? ? UIGraphicsEndImageContext();
? ? return lastImage;
}
1.圖片合成的方法
//圖片合成 image1是背景圖片 image2是gif圖片
- (UIImage *)addImage:(UIImage *)image1 withImage:(UIImage *)image2 {
? ? UIGraphicsBeginImageContext(image1.size);
? ? CGFloat image2Width =image2.size.width;
? ? CGFloat image1Width =image1.size.width;
? ? CGFloat image1Height = image1.size.height;
? ? CGFloat image2Height = image2.size.height;
? ? CGFloat resultImageHeight = 520;//我們拍的視頻是520pt*520pt的（2倍圖）
? ? [image1 drawInRect:CGRectMake(0, 0, image1Width, image1Height) blendMode:kCGBlendModeNormal alpha:1];
? ? [image2 drawInRect:CGRectMake(0,resultImageHeight-image2Height, image2Width*image1Width/resultImageHeight*1.0, image2Height*image1Width/resultImageHeight*1.0)];//因為軟件生成的gif圖片不是520*520的，所以保證合成的時候底邊是對齊的
? ? UIImage *resultingImage = UIGraphicsGetImageFromCurrentImageContext();
? ? NSData *tData = UIImageJPEGRepresentation(resultingImage, 0.0);
? ? UIImage *tImage = [UIImage imageWithData:tData];
? ? UIImage *lastImage = [self imageWithImage:tImage scaledToSize:CGSizeMake(260, 260)];
? ? UIGraphicsEndImageContext();
?? ?return lastImage;
}
2./**
*根據給定的size的寬高比自動縮放原圖片、自動判斷截取位置,進行圖片截取
* UIImage image 原始的圖片
* CGSize size 截取圖片的size
*/
-(UIImage *)clipImage:(UIImage *)image toRect:(CGSize)size{
? ? //被切圖片寬比例比高比例小 或者相等，以圖片寬進行放大
? ? if (image.size.width*size.height <= image.size.height*size.width) {
? ? ? ? //以被剪裁圖片的寬度為基準，得到剪切范圍的大小
? ? ? ? CGFloat width? = image.size.width;
? ? ? ? CGFloat height = image.size.width * size.height / size.width;
? ? ? ? // 調用剪切方法
? ? ? ? // 這里是以中心位置剪切，也可以通過改變rect的x、y值調整剪切位置
? ? ? ? return [self imageFromImage:image inRect:CGRectMake(0, (image.size.height -height)/2, width, height)];
? ? }else{ //被切圖片寬比例比高比例大，以圖片高進行剪裁
? ? ? ? // 以被剪切圖片的高度為基準，得到剪切范圍的大小
? ? ? ? CGFloat width? = image.size.height * size.width / size.height;
? ? ? ? CGFloat height = image.size.height;
? ? ? ? // 調用剪切方法
? ? ? ? // 這里是以中心位置剪切，也可以通過改變rect的x、y值調整剪切位置
? ? ? ? return [self imageFromImage:image inRect:CGRectMake((image.size.width -width)/2, 0, width, height)];
? ? }
? ? return nil;
}
3.//獲取某個幀的圖片
- (UIImage *)frameImageFromVideoURL:(NSURL *)videoURL withPoint:(CMTime)point{
? ? // result
? ? UIImage *image = nil;
? ? // AVAssetImageGenerator
? ? AVAsset *asset = [AVAsset assetWithURL:videoURL];
? ? AVAssetImageGenerator *imageGenerator = [[AVAssetImageGenerator alloc] initWithAsset:asset];
? ? imageGenerator.appliesPreferredTrackTransform = YES;
? ? imageGenerator.requestedTimeToleranceAfter = kCMTimeZero;//必須設置，否則時間對應不上
? ? imageGenerator.requestedTimeToleranceBefore = kCMTimeZero;//必須設置，否則時間對應不上
? ? // get the image from
? ? NSError *error = nil;
? ? CMTime actualTime;
? ? // Returns a CFRetained CGImageRef for an asset at or near the specified time.
? ? // So we should mannully release it
? ? CGImageRef centerFrameImage = [imageGenerator copyCGImageAtTime:point
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? actualTime:&actualTime
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? error:&error];
? ?if (centerFrameImage != NULL) {
? ? ? ? image = [[UIImage alloc] initWithCGImage:centerFrameImage];
? ? ? ? // Release the CFRetained image
? ? ? ? CGImageRelease(centerFrameImage);
? ? }
? ? return image;
}
4.圖片合成gif親測可用，我測試的是真機版本的
