UICollectionView image on cell memory warning

Question

im using Xcode 4.6.1, iOS SDK 6.1, ARC and Storyboards, testing device iphone 4S running 6.1.3

I'm having a little trouble configuring a collectionviewcell containing pictures, there thing is when i try to add some custom pictures on the cell, the memory just jump directly by 30-40mb each picture, the picture are taking directly on the device camera and saved on documents directory, maybe you can help me with this.

here are the codes i use:

    --the code to load the images path on an array imagesArray
-(void) llenarArregloImagenes
{
imagesArray=[[NSMutableArray alloc]init];
NSFileManager *fileMgr=[[NSFileManager alloc]init];
NSError * error = nil;
NSString *documentsDirectory = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES)     lastObject];
//vemos cuantos objetos con la extension .jpg hay
NSArray *contenidoDirectorio=[fileMgr contentsOfDirectoryAtPath:documentsDirectory error:&error];
//FILTER THE JPG FILES
contenidoDirectorio = [contenidoDirectorio filteredArrayUsingPredicate:[NSPredicate predicateWithFormat:@"pathExtension ==[c] %@", @"jpg"]];
//para meter en el arrelo las imagenes
int indice=0;
if([contenidoDirectorio count]>0)
{
for(indice=0;indice<=[contenidoDirectorio count]-1;indice++)
{
    NSString* path = [documentsDirectory stringByAppendingPathComponent: [NSString stringWithString:[contenidoDirectorio objectAtIndex:indice]]];
    [imagesArray addObject:path];
}
}

    --end loading images

then i use this code to load the images on the collection view

--collection view code to add image to cell
-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
             cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
NSLog(@"Entra a las celdas");
static NSString *identificador=@"celdaImagen";
celdaImagen *myCell = [collectionView dequeueReusableCellWithReuseIdentifier:identificador forIndexPath:indexPath];
UIImage* image = [UIImage imageWithContentsOfFile:[imagesArray objectAtIndex:indexPath.item]];
//myCell.imagen.image = [imagesArray objectAtIndex:indexPath.item];
//comprimir la imagen
//double compressionRatio=1;
//NSData *imgData=UIImageJPEGRepresentation(image,compressionRatio);
//NSLog(@"tamano de la imagen %i",(imgData.length)/1024);
//UIImage *imagenRedimensionada=[[UIImage alloc] initWithData:imgData];
//
NSData *imageData = UIImagePNGRepresentation(image); //png o jpg
NSLog(@"tamano imagen %i",(imageData.length)/1024);
myCell.imagen.image=image;
return myCell;
}
--end of loading images

this is the code i use to save the image from the camera or from the camera roll, i must say i dont care if it is PNG or JPG i can use any.

--code to save image on documents file 
-(void)imagePickerController:(UIImagePickerController *)picker
didFinishPickingMediaWithInfo:(NSDictionary *)info
{
NSString *mediaType = info[UIImagePickerControllerMediaType];

[self dismissViewControllerAnimated:YES completion:nil];

if ([mediaType isEqualToString:(NSString *)kUTTypeImage]) {
    UIImage *image = info[UIImagePickerControllerOriginalImage];
        NSData *imageData = UIImageJPEGRepresentation(image,0.009); //png o jpg
        NSLog(@"tamano imagen %i",(imageData.length)/1024);
        NSFileManager *fileMgr=[[NSFileManager alloc]init];
        NSError * error = nil;
        NSString *documentsDirectory = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES)     lastObject];
        //vemos cuantos objetos con la extension .png hay
        NSArray *contenidoDirectorio=[fileMgr contentsOfDirectoryAtPath:documentsDirectory error:&error];
        //contenidoDirectorio = [contenidoDirectorio filteredArrayUsingPredicate:[NSPredicate predicateWithFormat:@"pathExtension ==[c] %@", @"mov"]];
        NSString *nombreArchivo=[NSString stringWithFormat:@"imagen%i.jpg",[contenidoDirectorio count]] ;
        NSString *path = [documentsDirectory stringByAppendingPathComponent:nombreArchivo];
        //mostramos el contenido del archivo
        NSLog(@"Documents directory: %@", [fileMgr contentsOfDirectoryAtPath:documentsDirectory error:&error]);
        //guardamos el archivo
        [imageData writeToFile:path options:NSDataWritingAtomic error:&error];
        //volvemos a cargar los datos del collectionview
        [self llenarArregloImagenes];
        //metemos la ruta completa de la imagen
        //double compressionRatio=0.1;
        //NSData *imgData=UIImageJPEGRepresentation(image,compressionRatio);
        //UIImage *imagenRedimensionada=[[UIImage alloc] initWithData:imgData];
        //
        //[imagesArray addObject:imagenRedimensionada];
        [self.collectionView reloadData];
        if (error != nil)
        {
            NSLog(@"Error: %@", error);
            return;
        }
}
else if ([mediaType isEqualToString:(NSString *)kUTTypeMovie])
{
    // Code here to support video if enabled
}
}
--end of code to save image

what is the best aproach to do an aplication like the camera roll, where i can see more than 6 images? maybe i'm saving them wrong or adding wrong to the collection view? thank you.

Answer 1

Scale down the image size in the method

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
         cellForItemAtIndexPath:(NSIndexPath *)indexPath

You can use the category for UIImage available here

Use the method

- (UIImage *)thumbnailImage:(NSInteger)thumbnailSize
      transparentBorder:(NSUInteger)borderSize
           cornerRadius:(NSUInteger)cornerRadius
   interpolationQuality:(CGInterpolationQuality)quality;

Edit: 1. Include the following files from the url http://vocaro.com/trevor/blog/2009/10/12/resize-a-uiimage-the-right-way/

• UIImage+Resize.h, UIImage+Resize.m
• UIImage+RoundedCorner.h, UIImage+RoundedCorner.m
• UIImage+Alpha.h, UIImage+Alpha.m

2.Import the UIImage+Resize.h.

3.Alter your method

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView
         cellForItemAtIndexPath:(NSIndexPath *)indexPath

to look like the below

-(UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath
{
    NSLog(@"Entra a las celdas");
    static NSString *identificador=@"celdaImagen";
    celdaImagen *myCell = [collectionView dequeueReusableCellWithReuseIdentifier:identificador forIndexPath:indexPath];
    UIImage* image = [UIImage imageWithContentsOfFile:[imagesArray objectAtIndex:indexPath.item]];

    NSData *imageData = UIImagePNGRepresentation(image); //png o jpg
    NSLog(@"tamano imagen %i",(imageData.length)/1024);

    myCell.imagen.image=[image thumbnailImage:20 // This should the size of the view in collection view. example: myCell width is 20 and height is 20. 
                            transparentBorder:0
                                 cornerRadius:0
                         interpolationQuality:kCGInterpolationMedium];
    return myCell;
}

hope it helps.