iOS視頻轉GIF教程

公司有個需求,做表情包功能腺劣,設計師會給我一套gif(包括做好的gif圖和這個gif的每一張圖片)绿贞,結合視頻錄制功能,做成最長錄制3秒的表情包橘原,這個表情包的效果上有一些動態(tài)掛件籍铁,就像下圖這種(圖1):

圖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親測可用箫老,我測試的是真機版本的

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末封字,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌周叮,老刑警劉巖辩撑,帶你破解...
    沈念sama閱讀 216,651評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件界斜,死亡現場離奇詭異仿耽,居然都是意外死亡,警方通過查閱死者的電腦和手機各薇,發(fā)現死者居然都...
    沈念sama閱讀 92,468評論 3 392
  • 文/潘曉璐 我一進店門项贺,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人峭判,你說我怎么就攤上這事开缎。” “怎么了林螃?”我有些...
    開封第一講書人閱讀 162,931評論 0 353
  • 文/不壞的土叔 我叫張陵奕删,是天一觀的道長。 經常有香客問我疗认,道長完残,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,218評論 1 292
  • 正文 為了忘掉前任横漏,我火速辦了婚禮谨设,結果婚禮上,老公的妹妹穿的比我還像新娘缎浇。我一直安慰自己扎拣,他們只是感情好,可當我...
    茶點故事閱讀 67,234評論 6 388
  • 文/花漫 我一把揭開白布素跺。 她就那樣靜靜地躺著二蓝,像睡著了一般。 火紅的嫁衣襯著肌膚如雪指厌。 梳的紋絲不亂的頭發(fā)上刊愚,一...
    開封第一講書人閱讀 51,198評論 1 299
  • 那天,我揣著相機與錄音仑乌,去河邊找鬼百拓。 笑死,一個胖子當著我的面吹牛晰甚,可吹牛的內容都是我干的衙传。 我是一名探鬼主播,決...
    沈念sama閱讀 40,084評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼厕九,長吁一口氣:“原來是場噩夢啊……” “哼蓖捶!你這毒婦竟也來了?” 一聲冷哼從身側響起扁远,我...
    開封第一講書人閱讀 38,926評論 0 274
  • 序言:老撾萬榮一對情侶失蹤俊鱼,失蹤者是張志新(化名)和其女友劉穎刻像,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體并闲,經...
    沈念sama閱讀 45,341評論 1 311
  • 正文 獨居荒郊野嶺守林人離奇死亡细睡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,563評論 2 333
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了帝火。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片溜徙。...
    茶點故事閱讀 39,731評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖犀填,靈堂內的尸體忽然破棺而出蠢壹,到底是詐尸還是另有隱情,我是刑警寧澤九巡,帶...
    沈念sama閱讀 35,430評論 5 343
  • 正文 年R本政府宣布图贸,位于F島的核電站,受9級特大地震影響冕广,放射性物質發(fā)生泄漏疏日。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,036評論 3 326
  • 文/蒙蒙 一佳窑、第九天 我趴在偏房一處隱蔽的房頂上張望制恍。 院中可真熱鬧,春花似錦神凑、人聲如沸净神。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,676評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽鹃唯。三九已至,卻和暖如春瓣喊,著一層夾襖步出監(jiān)牢的瞬間坡慌,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,829評論 1 269
  • 我被黑心中介騙來泰國打工藻三, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留洪橘,地道東北人。 一個月前我還...
    沈念sama閱讀 47,743評論 2 368
  • 正文 我出身青樓棵帽,卻偏偏與公主長得像熄求,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子逗概,可洞房花燭夜當晚...
    茶點故事閱讀 44,629評論 2 354

推薦閱讀更多精彩內容