Cache URL images iphone UITableview

Question

I'm seeking a tutorial on how to cache images loaded from a url into cells of a uitableview.

I found an example here

http://www.ericd.net/2009/05/iphone-caching-images-in-memory.html#top

But the code is incomplete. I'm an objective c novice so I found it very difficult to fill in the missing pieces.

Solution 1

A nice working example was found here

http://ezekiel.vancouver.wsu.edu/~wayne/yellowjacket/YellowJacket.zip

Solution 2

Here is a simple ImageCache implementation using NSCache. ImageCache is a singelton.

ImageCache.h

    #import <Foundation/Foundation.h>

    @interface ImageCache : NSObject

    @property (nonatomic, retain) NSCache *imgCache;


    #pragma mark - Methods

    + (ImageCache*)sharedImageCache;
    //- (void) AddImage:(NSString *)imageURL: (UIImage *)image;
   - (void) AddImage:(NSString *)imageURL withImage:(UIImage *)image;
    - (UIImage*) GetImage:(NSString *)imageURL;
    - (BOOL) DoesExist:(NSString *)imageURL;

    @end

ImageCache.m

  #import "ImageCache.h"

    @implementation ImageCache

    @synthesize imgCache;

    #pragma mark - Methods

    static ImageCache* sharedImageCache = nil;

    +(ImageCache*)sharedImageCache
    {
        @synchronized([ImageCache class])
        {
            if (!sharedImageCache)
                sharedImageCache= [[self alloc] init];

            return sharedImageCache;
        }

        return nil;
    }

    +(id)alloc
    {
        @synchronized([ImageCache class])
        {
            NSAssert(sharedImageCache == nil, @"Attempted to allocate a second instance of a singleton.");
            sharedImageCache = [super alloc];

            return sharedImageCache;
        }

        return nil;
    }

    -(id)init 
    {
        self = [super init];
        if (self != nil) 
        {
            imgCache = [[NSCache alloc] init];
        }

        return self;
    }

   // - (void) AddImage:(NSString *)imageURL: (UIImage *)image
- (void) AddImage:(NSString *)imageURL withImage:(UIImage *)image
    {
        [imgCache setObject:image forKey:imageURL];
    }

    - (NSString*) GetImage:(NSString *)imageURL
    {
        return [imgCache objectForKey:imageURL];
    }

    - (BOOL) DoesExist:(NSString *)imageURL
    {
        if ([imgCache objectForKey:imageURL] == nil)
        {
            return false;
        }

        return true;
    }


    @end

Example

UIImage *image;

    // 1. Check the image cache to see if the image already exists. If so, then use it. If not, then download it.

    if ([[ImageCache sharedImageCache] DoesExist:imgUrl] == true)
    {
        image = [[ImageCache sharedImageCache] GetImage:imgUrl];
    }
    else
    {
        NSData *imageData = [[NSData alloc] initWithContentsOfURL: [NSURL URLWithString: imgUrl]];
        image = [[UIImage alloc] initWithData:imageData];

        // Add the image to the cache 
        //[[ImageCache sharedImageCache] AddImage:imgUrl :image];

        [[ImageCache sharedImageCache] AddImage:imgUrl withImage:image];
    }

Solution 3

You could also try using the awesome EgoImage library written by the sharp fellows at enormego to accomplish this. It is very simple to use, makes efficient use of cache behind the scenes and is ideally suited to meet your requirements.

Here's the github path for the library which includes a demo app.

Comments

[Dr4ke the b4dass]

An additional tip here: if you are caching lots of images, or large images, and are therefore using a good amount of memory, you may want to make a "+ (void)flushCache" method that does "[cache removeAllObjects]" so you can call it from within the didReceiveMemoryWarning methods as needed.. that will free up all of that memory.

[wcochran]

Updated version for iOS 5: git clone http://ezekiel.vancouver.wsu.edu/~cs458/demos/YellowJackets/‌​.git link

[Huang Yen-Chieh]

in ImageCache.m the method there's a typo: - (void) AddImage:(NSString *)imageURL: (NSString *)image should be - (void) AddImage:(NSString *)imageURL: (UIImage *)image. The (NSString *)image should be (UIImage *)image.

[Umut Koseali]

Thanks for your great answer. It is full fill with req. information

[Dilip]

Really helpful answer +1, 1 question where is this cache images are stored i have checked document directory that does not contain it and other question is how could this code will delete this cache images or no need to do that?

[Rob]

Well done. But I'd suggest 1. following camelCase naming conventions for your methods; and 2. use dispatch_once for instantiating your singleton (see Matt Galloway's singleton discussion.

[Tulon]

Hi, I do the same as you did here, but it is not working. I want to show the thumbnail image in customCell with NSCache. Here is my post, stackoverflow.com/questions/19252991/… please take have a look on it. Thanks..

[Gautam Jain]

Good one. But once there are a lot of images in the cache, it will cause a memory warning and might eventually crash. Why don't you add an observer for memoryWarning: in init and remove cache objects if the method is fired.

[MarBVI]

@GautamJain can you explain a bit more about this? Can you give the code to do that for this example?