Question

I have a view with UIImageview of width 75 and height 75. I capture an image from Camera or Photo Library,resize it and set to imageview.

The captured image is uploaded to server but resized image is uploaded and quality of image is lost. A blur image is viewed while retrieving from server.

Now, what i need is, whenever i tap on imageview a full screen image preview should display and image with high quality should be uploaded instead of resized image

I resized image using the following code

- (UIImage*)imageWithImage:(UIImage*)sourceImage scaledToSize:(CGSize)newSize;
{
    CGFloat targetWidth = newSize.width;
    CGFloat targetHeight = newSize.height;

    NSLog(@"target Width:%f",targetWidth);
    NSLog(@"target Height:%f",targetHeight);

    CGImageRef imageRef = [sourceImage CGImage];
    CGBitmapInfo bitmapInfo = CGImageGetBitmapInfo(imageRef);
    CGColorSpaceRef colorSpaceInfo = CGImageGetColorSpace(imageRef);

    if (bitmapInfo == kCGImageAlphaNone) {
        bitmapInfo = kCGImageAlphaPremultipliedLast;
    }

    CGContextRef bitmap;

    if (sourceImage.imageOrientation == UIImageOrientationUp || sourceImage.imageOrientation == UIImageOrientationDown) {
        bitmap = CGBitmapContextCreate(NULL, targetWidth, targetHeight, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo);

        NSLog(@"ImageOrientation UP/DOWN");

    } else {
        bitmap = CGBitmapContextCreate(NULL, targetHeight, targetWidth, CGImageGetBitsPerComponent(imageRef), CGImageGetBytesPerRow(imageRef), colorSpaceInfo, bitmapInfo);

    }   

    if (sourceImage.imageOrientation == UIImageOrientationLeft) {
        NSLog(@"ImageOrientation LEFT");

        CGContextRotateCTM (bitmap, radians(90));
        CGContextTranslateCTM (bitmap, 0, -targetHeight);

    } else if (sourceImage.imageOrientation == UIImageOrientationRight) {
        NSLog(@"ImageOrientation RIGHT");
        CGContextRotateCTM (bitmap, radians(-90));
        CGContextTranslateCTM (bitmap, -targetWidth, 0);

    } else if (sourceImage.imageOrientation == UIImageOrientationUp) {
        NSLog(@"ImageOrientation UP/DOWN");
        // NOTHING
    } else if (sourceImage.imageOrientation == UIImageOrientationDown) {
        CGContextTranslateCTM (bitmap, targetWidth, targetHeight);
        CGContextRotateCTM (bitmap, radians(-180.));
    }

    // CGContextSetInterpolationQuality(bitmap, 1);

    CGContextDrawImage(bitmap, CGRectMake(0, 0, targetWidth, targetHeight), imageRef);
    CGImageRef ref = CGBitmapContextCreateImage(bitmap);
    UIImage* newImage = [UIImage imageWithCGImage:ref];

    CGContextRelease(bitmap);
    CGImageRelease(ref);

    return newImage; 
}

Please help me

Answer 1

Once you have resized the image down to 75×75 the quality is lost – resizing it back upwards won’t restore it. So you have to keep a reference to the original unresized image to pass for uploading to the server. You could do this keeping two copies – your manually resized copy and the original copy for upload, and simply using the latter in your full sized view.

But alternately, as robin has noted in the comment above, you can use the content mode of your UIImageView to have it automatically resize the image within the view based on the content mode.

The relevant content modes for your situation are:

UIViewContentModeScaleToFill, UIViewContentModeScaleAspectFill, UIViewContentModeScaleAspectFit

These will all cause the image to be resized within the 75×75 UIImageView

i.e.

myImageView.contentMode = UIViewContentModeScaleAspectFit;
myImageView.image = myUnscaledImage;

The ScaleToFill will stretch your image so that it fills the available space – even if this distorts it.

The ScaleAspectFill will stretch your image so that the shortest dimension (width or height) fills the available space, and will crop the longest dimension (width or height).

The ScaleAspectFit will stretch your image so that the longest dimension still fits into the available space, and leave empty space around the shortest dimension (horizontal or vertical)

UIViewContentModeScaleAspectFit is the one that seems most likely to fit your goal.

One way to pop up a full screen image would be to cover your UIImageView with a transparent button, add an action handler for touch, and in that present a modal view controller which has an image view for your full image set to the view. Alternately subclass image view and add your own touch handling or use a gesture recognizer instead of a transparent button.

If the full size image is larger than your view window and you want it to be scrollable then put it inside a scrollview. If you want it to be zoomable as well then load it into img tags inside a web view instead of using a scroll view.

If you want the display to be temporary use an NSTimer and close the modal view controller when the time pops, or you could listen for the end of your upload http request and close the full size view when the image has finished uploading.