This question already has answers here:
The simplest way to resize an UIImage?
(34 answers)
Closed 9 years ago.
I've created a UIImageView which contains an image with a high resolution. The problem is that the resolution of that image is too high to put into the imageView. The size of the imageView is 92 x 91 (so it's small). It contains an UIImage, whose resolution is too high so it looks ugly in the UIImageView.
So how can I reduce the resolution of that UIImage?
My code for the UIImageView:
UIImageView *myImageView = [[UIImageView alloc] initWithImage:[UIImage imageWithContentsOfFile:pngFilePath]];
myImageView.frame = CGRectMake(212.0, 27, 92,91);
have a look at this
https://stackoverflow.com/a/2658801
This will help you to resize your image according to your need
Add method to your code and call like this
UIImage *myImage =[UIImage imageWithContentsOfFile:pngFilePath];
UIImage *newImage =[UIImage imageWithImage:myImage scaledToSize:CGSizeMake(92,91)];
You can resize an image using this method that returns a resized image :
-(UIImage *)imageWithImage:(UIImage *)image scaledToSize:(CGSize)newSize {
UIGraphicsBeginImageContextWithOptions(newSize, NO, 0.0);
// Here pass new size you need
[image drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
Hope it helps you.
try with this
myImageView.contentMode = UIViewContentModeScaleToFill;
You need to downsize the image, which will reduce the resolution, make it easier to store. I actually wrote a class (building on some stuff from SO) that does just that. It's on my github, take a look:
https://github.com/pavlovonline/UIImageResizer
the main method is
-(UIImage*)resizeImage:(UIImage*)image toSize:(CGFloat)size
so you give this method the size to which you want to downsize your image. If the height is greater than the width, it will auto-calculate the middle and give you a perfectly centered square. Same for width being greater than height. If you need an image that is not square, make your own adjustments.
so you'll get back a downsized UIImage which you can then put into your UIImageView. Save some memory too.
Related
I'm trying to resize the UIImage
Before the UIImage:
After this code and UIImage:
UIGraphicsBeginImageContext (CGPointMake(155,139));
[currentImageView.image drawInRect:CGRectMake(0,0,155,139)];
currentImageView.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
NSLog(#"get size : %#",NSStringFromCGSize(currentImageView.image.size));
NSLog: get size : {155,139}
Last, I try to restore the size by this code. but its blurry.
UIGraphicsBeginImageContext (OriginalSize);
[currentImageView.image drawInRect:CGRectMake(0,0,OriginalSize.width,OriginalSize.height)];
currentImageView.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
NSLog(#"get size : %#",NSStringFromCGSize(cnurrentImageView.image.size));
NSLog: get size : {1024,352}
What happened?
Have any suggestions and advice?
You are making two mistakes,
1.Reducing the image size and setting it to a larger size imageView,
this can be fixed with the code,
imageView.contentMode = UIViewContentModeScaleAspectFit;
2.You have resize the original image to a smaller size, then
resizing the smaller image to original size, this will stretch the
image.
FOR 1 : first step,
You can use this code so that the image quality doesn't loose:
Instead of
UIGraphicsBeginImageContext
Use
UIGraphicsBeginImageContextWithOptions(currentImageView.frame.size, NO, 0);
as the size you want is smaller and the imageview is larger so you also need to set
YourimageView.contentMode = UIViewContentModeScaleAspectFit;
For Second Step :
Use original image to resize it.
I've got an image that I need crop. To do this, I wanted to use the contentMode (set it to Top/TopLeft instead of Aspect Fit) but when I'm doing this, the image go back to it's real size (and not the size I gave to it). So my question is :
How to crop the bottom of my image retaining its size ?
Thanks a lot.
May be you have to set the rect for the imageView
imageView is the instance of UIImageView
Let the rectangle to be cropped is croppedRect
CGImageRef imageRef = CGImageCreateWithImageInRect([imageView.image CGImage], croppedRect);
[imageView setImage:[UIImage imageWithCGImage:imageRef]];
CGImageRelease(imageRef);
I have bubble like image, that I need to resize dynamically.
Example attached.
I will have dynamic text and I need to resize only straight parts of bubble. Leave down arrow on the middle
How can I do this?
Thanks
You can use method:
- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;
call like this:
UIImage* image = [[UIImage imageNamed:#"bubbleImageName.png"]
stretchableImageWithLeftCapWidth:15 topCapHeight:13];
Change capWidth and capHeight values
I think that resizableImageWithCapInsets: will be pretty useful for you
Example:
UIImage *image = [[UIImage imageNamed:#"buttonImage"] resizableImageWithCapInsets:UIEdgeInsetsMake(5.0,10.0,5.0,10.0)];
[self.yourButton setBackgroundImage:image forState:UIControlStateNormal];
I wrote example with button because it's a common case of using this method. Just play with caps values.
HTH!
EDIT:
Thought about this problem and wrote small example.
I understood that resizableImageWithCapInsets: can save only corners of image in case we use two dimension scale.
I see 2 ways:
Use two controls: one for balloon and one for arrow with proper images
Render image for this one control from two images
I decided to realize second one.
Pass ballonView.frame as argument here:
- (UIImage *)balloonImageWithRect:(CGRect)rect{
//create two images, ballon image with cap corners
UIImage *ballonImage = [[UIImage imageNamed:#"balloon"] resizableImageWithCapInsets:UIEdgeInsetsMake(IMAGE_CAP_INSET_TOP, IMAGE_CAP_INSET_LEFT, IMAGE_CAP_INSET_BOTTOM, IMAGE_CAP_INSET_RIGHT) resizingMode:UIImageResizingModeStretch];
UIImage *arrowImage = [UIImage imageNamed:#"arrow"];
//drawing area
CGSize newSize = rect.size;
UIGraphicsBeginImageContext(newSize);
//leave some space for arrow at the bottom
[ballonImage drawInRect:CGRectMake(0, 0, newSize.width, newSize.height - arrowImage.size.height)];
//draw arrow at the bottom
[arrowImage drawInRect:CGRectMake((newSize.width - arrowImage.size.width)/2, newSize.height - arrowImage.size.height, arrowImage.size.width, arrowImage.size.height)];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
Then we just set this image to our ballonView.
Also I leave gist with full code of that ViewController with random sizes of that balloon: https://gist.github.com/AlloyDev/7910637
Also you can use that two images:
Use UIImage.h delegate method
// use resizableImageWithCapInsets: and capInsets.
- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;
#property(nonatomic,readonly) NSInteger leftCapWidth; // default is 0. if non-zero, horiz. stretchable. right cap is calculated as width - leftCapWidth - 1
#property(nonatomic,readonly) NSInteger topCapHeight; // default is 0. if non-zero, vert. stretchable. bottom cap is calculated as height - topCapWidth - 1
like this
UIImage *balloon = [[UIImage imageNamed:#"grey.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];
hope this helps.
For the image in the question (assuming it's a Retina image):
[[UIImage imageNamed:#"Bubble"] resizableImageWithCapInsets:UIEdgeInsetsMake(14, 28, 14, 26) resizingMode:UIImageResizingModeStretch];
If the image you've provided in the question is a non-retina image, halve the values.
Modify the values (UIEdgeInsetsMake(top, left, bottom, right)) to suit any image you need.
Image Size captured using Camera return's image of size 720*960.
The captured Image is displayed in a UIImageView of 320*436, like this.
UIImageView *imgView=[[UIImageView alloc] initWithFrame:CGRectMake(0.0,0.0,320.0,436.0)];
imgView.image=img;//Image received from camera.
[self.view addSubView:imgView];
This, works fine image 720*960 is scaled to 320*436 and displayed.
Now, from here actual problem starts. I have another image of size 72*72. This image is overlapped with the image received from camera at some arbitrary coordinates.
CGRectMake(0.0,0.0,72.0,72.0);
I am not able to find a better way to handle scaling and applying a overlay of another Image, at the same time maintain its quality.
The image needs to be send to a server.
Use the following code to scale images:
-(UIImage*) imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize
{
UIGraphicsBeginImageContext(newSize);
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
I am displaying an image in tableview cell (Image name saved in a plist). Before setting it to the cell, I am resizing the image to
imageSize = CGSizeMake(32, 32);
But, after resizing the image, quality is also getting degraded in retina display.
I have both the images added to the project (i.e. 1x and #2x).
This is how I am reducing the image size to 32x32.
+ (UIImage *)scale:(UIImage *)image toSize:(CGSize)size
{
UIGraphicsBeginImageContext(size);
[image drawInRect:CGRectMake(0, 0, size.width, size.height)];
UIImage *scaledImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return scaledImage;
}
Any pointers on this is very much appreciated.
Thanks
try this : instead of UIGraphicsBeginImageContext(size);use UIGraphicsBeginImageContextWithOptions(size,NO,0.0);
from what i understand what you're doing there is resizing the image to 32x32 (in points) no matter what the resolution. the UIGraphicsBeginImageContextWithOptions scales the image to the scale of the device's screen..so you have the image resized to 32x32 points but the resolution is kept for retina display
(note that this is what i understood from apple's uikit reference..it may not be so..but it should)
read here