iOS 中對(duì) GIF 的裁剪與展示

GIF 裁剪過程可以大致分為三步

  • 獲取 GIF 的幀集合,并對(duì)每一幀圖片進(jìn)行裁剪后生成裁剪后的 UIImage 對(duì)象
  • 裁剪后的 GIF 的 NSData 數(shù)據(jù)

這里主要用到了 Image I/O 的相關(guān)接口儡循,Image I/O framework 提供一種不透明的數(shù)據(jù)類型(opaque data types)官还,從 CGImageSourceRef 獲取圖片數(shù)據(jù)堕虹,將圖片數(shù)據(jù)寫入到 CGImageDestinationRef鬼雀。它提供一個(gè)范圍很廣的圖片格式实撒,包含 web 格式靴患,動(dòng)態(tài)圖,原始相機(jī)數(shù)據(jù)等豁状。

獲取幀集合并裁剪

首先是獲取 GIF 的幀集合捉偏。

  • 通過 GIF 的 NSData 創(chuàng)建一個(gè) CGImageSourceRef 對(duì)象
CGImageSourceRef source = CGImageSourceCreateWithData((__bridge CFDataRef)assetData, NULL);

這里 CGImageSourceRef 就是一個(gè)代表圖片的不透明的數(shù)據(jù)類型,它抽象了讀取圖像數(shù)據(jù)的通道泻红,但本身不會(huì)讀取圖像的任何數(shù)據(jù)夭禽。

  • 獲取 GIF 幀的個(gè)數(shù)
size_t count = CGImageSourceGetCount(source);

對(duì)于 GIF 等 AnimateImage 對(duì)象可以包含多個(gè) Image,這里 CGImageSourceGetCount 就可以獲取到對(duì)應(yīng)的源圖片數(shù)據(jù)的幀數(shù)谊路。

  • 獲取幀集合并裁剪
            NSMutableArray *images = [NSMutableArray array];
            NSTimeInterval duration = (1.0f / 100.0f) * count;
            for (size_t i = 0; i < count; i++) {
                CGImageRef image = CGImageSourceCreateImageAtIndex(source, i, NULL);
                CGImageRef newImageRef = CGImageCreateWithImageInRect(image, cropRect);
                UIImage *newImage = [UIImage imageWithCGImage:newImageRef];
                [images addObject:newImage];
                CGImageRelease(image);
            }
            animatedImage = [UIImage animatedImageWithImages:images duration:duration];

GIF 的一個(gè)重要屬性是它的 duration 值讹躯,這里簡單取為幀數(shù)的 10%,相當(dāng)于每一幀的 duration 是 0.1s缠劝。SDWebImage 庫的 SDWebImageGIFCoder.m 文件中提供了一種更準(zhǔn)確的獲取方法

- (float)sd_frameDurationAtIndex:(NSUInteger)index source:(CGImageSourceRef)source {
    float frameDuration = 0.1f;
    CFDictionaryRef cfFrameProperties = CGImageSourceCopyPropertiesAtIndex(source, index, nil);
    NSDictionary *frameProperties = (__bridge NSDictionary *)cfFrameProperties;
    NSDictionary *gifProperties = frameProperties[(NSString *)kCGImagePropertyGIFDictionary];
    
    NSNumber *delayTimeUnclampedProp = gifProperties[(NSString *)kCGImagePropertyGIFUnclampedDelayTime];
    if (delayTimeUnclampedProp) {
        frameDuration = [delayTimeUnclampedProp floatValue];
    } else {
        NSNumber *delayTimeProp = gifProperties[(NSString *)kCGImagePropertyGIFDelayTime];
        if (delayTimeProp) {
            frameDuration = [delayTimeProp floatValue];
        }
    }
    
    // Many annoying ads specify a 0 duration to make an image flash as quickly as possible.
    // We follow Firefox's behavior and use a duration of 100 ms for any frames that specify
    // a duration of <= 10 ms. See <rdar://problem/7689300> and <http://webkit.org/b/36082>
    // for more information.
    
    if (frameDuration < 0.011f) {
        frameDuration = 0.100f;
    }
    
    CFRelease(cfFrameProperties);
    return frameDuration;
}

通過 CGImageSourceCreateImageAtIndex 方法我們可以從一個(gè) CGImageSourceRef 數(shù)據(jù)源中讀到一個(gè)幀位的未解碼圖片數(shù)據(jù)潮梯,然后通過 CGImageCreateWithImageInRect 對(duì)這一幀數(shù)據(jù)進(jìn)行裁剪后,解碼生成一個(gè) UIImage 對(duì)象剩彬,將其放入一個(gè)數(shù)組中酷麦。最后通過 [UIImage animatedImageWithImages: duration:] 方法來生成一個(gè)被裁剪后的 GIF 的 UIImage 對(duì)象。這時(shí)候 可以把這個(gè) UIImage 對(duì)象賦給 UIImageView 對(duì)象來展示一個(gè) GIF 圖片喉恋。

最后要注意手動(dòng)釋放 CGImageSourceRef 對(duì)象

CFRelease(source);

獲取裁剪后的 NSData

如果要傳輸裁剪后的 GIF 圖片給服務(wù)器,還需要將上一步得到的 UIImage 轉(zhuǎn)化為 NSData 對(duì)象。

            size_t frameCount = animatedImage.images.count;
            NSTimeInterval frameDuration = animatedImage.duration / frameCount;
            NSDictionary *frameProperties = @{
                                              (__bridge NSString *)kCGImagePropertyGIFDictionary: @{
                                                      (__bridge NSString *)kCGImagePropertyGIFDelayTime: @(frameDuration)
                                                      }
                                              };
            NSMutableData *mutableData = [NSMutableData data];
            NSDictionary *imageProperties = @{ (__bridge NSString *)kCGImagePropertyGIFDictionary: @{
                                                       (__bridge NSString *)kCGImagePropertyGIFLoopCount: @0
                                                       }
                                               };
            CGImageDestinationRef destination = CGImageDestinationCreateWithData((__bridge CFMutableDataRef)mutableData, kUTTypeGIF, frameCount, NULL);
            CGImageDestinationSetProperties(destination, (__bridge CFDictionaryRef)imageProperties);
            for (size_t index = 0; index < frameCount;index++) {
                CGImageDestinationAddImage(destination, [[animatedImage.images objectAtIndex:index] CGImage], (__bridge CFDictionaryRef)frameProperties);
            }
            BOOL success = CGImageDestinationFinalize(destination);
            CFRelease(destination);

這里通過上一步得到的 UIImage 對(duì)象轻黑,首先獲得 GIF 圖的幀數(shù)糊肤,然后獲得每一幀的 duration。同時(shí)創(chuàng)建一個(gè) NSMutableData 的對(duì)象用于存儲(chǔ) GIF 圖片的數(shù)據(jù)氓鄙,然后創(chuàng)建一個(gè) CGImageDestinationRef 來指定存入數(shù)據(jù)區(qū)(mutableData)馆揉、存入數(shù)據(jù)類型(kUTTypeGIF)和幀數(shù)(frameCount)。最后遍歷 animatedImage 的每一個(gè) UIImage 對(duì)象抖拦,依據(jù)每一幀的 duration 值存入 CGImageDestinationRef 對(duì)象中升酣。執(zhí)行完遍歷操作后,mutableData 中就是我們需要的裁剪后的 GIF 圖片的 NSData 數(shù)據(jù)态罪。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末噩茄,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子复颈,更是在濱河造成了極大的恐慌绩聘,老刑警劉巖,帶你破解...
    沈念sama閱讀 217,657評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件耗啦,死亡現(xiàn)場(chǎng)離奇詭異凿菩,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)帜讲,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,889評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門衅谷,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人似将,你說我怎么就攤上這事获黔。” “怎么了玩郊?”我有些...
    開封第一講書人閱讀 164,057評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵肢执,是天一觀的道長。 經(jīng)常有香客問我译红,道長预茄,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,509評(píng)論 1 293
  • 正文 為了忘掉前任侦厚,我火速辦了婚禮耻陕,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘刨沦。我一直安慰自己诗宣,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,562評(píng)論 6 392
  • 文/花漫 我一把揭開白布想诅。 她就那樣靜靜地躺著召庞,像睡著了一般岛心。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上篮灼,一...
    開封第一講書人閱讀 51,443評(píng)論 1 302
  • 那天忘古,我揣著相機(jī)與錄音,去河邊找鬼诅诱。 笑死髓堪,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的娘荡。 我是一名探鬼主播干旁,決...
    沈念sama閱讀 40,251評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼炮沐!你這毒婦竟也來了争群?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,129評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤央拖,失蹤者是張志新(化名)和其女友劉穎祭阀,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體鲜戒,經(jīng)...
    沈念sama閱讀 45,561評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡专控,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,779評(píng)論 3 335
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了遏餐。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片伦腐。...
    茶點(diǎn)故事閱讀 39,902評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖失都,靈堂內(nèi)的尸體忽然破棺而出柏蘑,到底是詐尸還是另有隱情,我是刑警寧澤粹庞,帶...
    沈念sama閱讀 35,621評(píng)論 5 345
  • 正文 年R本政府宣布咳焚,位于F島的核電站,受9級(jí)特大地震影響庞溜,放射性物質(zhì)發(fā)生泄漏革半。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,220評(píng)論 3 328
  • 文/蒙蒙 一流码、第九天 我趴在偏房一處隱蔽的房頂上張望又官。 院中可真熱鬧,春花似錦漫试、人聲如沸六敬。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,838評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽外构。三九已至普泡,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間典勇,已是汗流浹背劫哼。 一陣腳步聲響...
    開封第一講書人閱讀 32,971評(píng)論 1 269
  • 我被黑心中介騙來泰國打工叮趴, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留割笙,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,025評(píng)論 2 370
  • 正文 我出身青樓眯亦,卻偏偏與公主長得像伤溉,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子妻率,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,843評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容

  • 展示本地gif圖片SDWebImage比較占內(nèi)存,FLAnimatedImage不怎么占用內(nèi)存 1.使用SDWeb...
    蕭雪痕閱讀 5,016評(píng)論 0 2
  • 1.自定義控件 a.繼承某個(gè)控件 b.重寫initWithFrame方法可以設(shè)置一些它的屬性 c.在layouts...
    圍繞的城閱讀 3,389評(píng)論 2 4
  • (侵刪) 推薦引擎的分類 根據(jù)不同的數(shù)據(jù)源發(fā)現(xiàn)數(shù)據(jù)相關(guān)性的方法可以分為以下幾種: 根據(jù)系統(tǒng)用戶的基本信息發(fā)現(xiàn)用戶的...
    暗黑破壞球嘿哈閱讀 1,587評(píng)論 0 4
  • 2016年乱顾,還蠻特殊,走在高三的大道上宫静,迷茫走净,勞累,可那又怎樣呢孤里,總以為只與學(xué)霸掛鉤的我伏伯,走上了一條連...
    凝眸M閱讀 281評(píng)論 0 0
  • 青春是趟跌跌撞撞的旅行,我們有著后知后覺的美麗捌袜。做夢(mèng)初一的語文老師兼班主任說我成績下降了说搅,非找我談話,問我喜歡了多...
    十一月的陽光閱讀 170評(píng)論 0 0