公司有個需求,做表情包功能腺劣,設計師會給我一套gif(包括做好的gif圖和這個gif的每一張圖片)绿贞,結合視頻錄制功能,做成最長錄制3秒的表情包橘原,這個表情包的效果上有一些動態(tài)掛件籍铁,就像下圖這種(圖1):
不賣關子,我直接說我的邏輯:首先錄制視頻趾断,錄制完成后拒名,根據錄制時間,按每秒10張圖片的規(guī)則來按幀取圖片歼冰,將取出來的圖片逐一和動態(tài)掛件的gif圖的每張圖片合成靡狞,最后用合成好的圖片生成一張gif圖。PS:這里我說一下隔嫡,設計做的動態(tài)模板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親測可用箫老,我測試的是真機版本的