Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

GIF do not animate when share on twitter

Tags:

ios

image

gif

I am creating animated GIF file with NSArray of UIImage. And saving it in NSDocumentDirectory as well as in Photo Album of iPhone.

The problem I am facing is, when I open the saved GIF in Email Composer or in iMessage, it animates fine. But when i share it through twitter, it does not animate. I tried sharing through twitter app on iPhone and saw an Interesting thing(ScreenShot below) that The GIFs i downloaded from different websites using Safari shows a label 'GIF' on top left corner of GIF. While my saved GIFs does not. What might be the problem here? Can anyone please guide me.

enter image description here

Here is the code for creating the GIF file:

float delay = 1.0/15.0; // 15 FPS

NSDictionary *prep = @{
                       (__bridge id)kCGImagePropertyGIFDictionary: @{
                               (__bridge id)kCGImagePropertyGIFDelayTime: @(delay) 
                               }
                       };

//    static NSUInteger kFrameCount = 16;

NSDictionary *fileProperties = @{
                                 (__bridge id)kCGImagePropertyGIFDictionary: @{
                                         (__bridge id)kCGImagePropertyGIFLoopCount: @0 // 0 means loop forever
                                         }
                                 };

CFURLRef url = (__bridge CFURLRef)[NSURL fileURLWithPath:path];

CGImageDestinationRef dst = CGImageDestinationCreateWithURL(url, kUTTypeGIF, [images count], nil);
CGImageDestinationSetProperties(dst, (__bridge CFDictionaryRef)fileProperties);

for (int i=0;i<[images count];i++)
{
        //load anImage from array
        UIImage * anImage = [images objectAtIndex:i];

        CGImageDestinationAddImage(dst, anImage.CGImage,(__bridge CFDictionaryRef)prep);

}

bool fileSave = CGImageDestinationFinalize(dst);
CFRelease(dst);
if(fileSave) {
    NSLog(@"animated GIF file created at %@", path);
}else{
    NSLog(@"error: no animated GIF file created at %@", path);
}

And saving the GIF into Photo Album as well as in NSDocumentDirectory. To save in Photo Album of iPhone, here is the code:

ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init];

NSData *data = [NSData dataWithContentsOfFile:tempPath];

[library writeImageDataToSavedPhotosAlbum:data metadata:nil completionBlock:^(NSURL *assetURL, NSError *error) {
    if (error) {
        NSLog(@"Error Saving GIF to Photo Album: %@", error);
    } else {
        // TODO: success handling
        NSLog(@"GIF Saved to %@", assetURL);

        success(tempPath);
    }
}];

HJImagesToGIF was big help, as well as this gist!

UPDATE:

On analysing the Image Header of 2 GIFs: 1- Image Header: GIF89a - downloaded through safari and shows GIF label in twitter app 2- Image Header: GIF87a - Created through code, doesnt show GIF label in twitter app

So the Image Header! hmmm.. how do I change it?

like image 792
Haris Hussain Avatar asked Jul 27 '14 23:07

Haris Hussain


1 Answers

Ok so solved the issue, I am not sure if its the best solution, and would appreciate better solutions from anyone!

The problem was indeed related to the image header of the GIFs which I created through Code. I took a GIF89a header GIF and copied the header (first 6 bytes) and replaced my GIF's image header with it. Working fine now on twitter as well as email and iMessage.

Here is the code I used:

NSMutableData *gifData = [NSMutableData dataWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"1.gif" ofType:nil]]; // GIF89a file
NSMutableData *data = [NSMutableData dataWithContentsOfFile:path]; // My created GIF file 
NSMutableData *gif89 = [NSMutableData dataWithData:[gifData subdataWithRange:NSMakeRange(0, 6)]]; // the first 6 bytes we needed (or the Header)
[data replaceBytesInRange:NSMakeRange(0, 6) withBytes:gif89.bytes]; // replace the header.. Voila! 
like image 82
Haris Hussain Avatar answered Oct 02 '22 10:10

Haris Hussain