Alternative to UIImage's imageWithCGImage:scale:orientation: - iphone

I built an app for 4.x which should be deployed for all iPhones 3.0-4.x. I realized that the imageWithCGImage:scale:orientation method is only available in 4.0 and later. Any alternative for 3.x? For reference:
Creates and returns an image object with the specified scale and orientation factors.
+ (UIImage *)imageWithCGImage:(CGImageRef)imageRef scale:(CGFloat)scale orientation:(UIImageOrientation)orientation
My current usage:
UIImage *inputImage = [UIImage imageWithCGImage:[[UIImage imageNamed: #"arrow.png"] CGImage] scale:1.2 orientation:UIImageOrientationUp];
The scale is static (i.e. I never change it) so I might scale the image through photoshop instead but the orientation remains a necessity in my application.
Thanks!

You can do the scale, rotate (translate) with CGContext functions. Then you can use...
CGImageRef CGBitmapContextCreateImage (
CGContextRef c
);
and
+ (UIImage *)imageWithCGImage:(CGImageRef)cgImage

Related

Rotating portrait UIImage that somehow has a UIImageOrientationRight orientation

Hi everyone,
I'm having an issue rotating a portrait UIImage (i.e. WIDTH < HEIGHT) that somehow has an orientation equal to UIImageOrientationRight. I'm not sure how this comes to be but it happens with a few images in my library captured with an iPhone 4.
This is my code (that does work but only if the orientation is equal to UIImageOrientationUp):
UIGraphicsBeginImageContextWithOptions(rotatedScaledRect.size, NO, 0.0);
CGContextRef myContext = UIGraphicsGetCurrentContext();
CGContextSetInterpolationQuality(myContext, kCGInterpolationHigh);
CGContextTranslateCTM(myContext,
(rotatedScaledRect.size.width/2),
(rotatedScaledRect.size.height/2));
CGContextConcatCTM(myContext, transformation);
CGContextScaleCTM(myContext, 1.0, -1.0);
CGContextDrawImage(myContext, CGRectMake(-roundf(newImage.size.width / 2), -roundf(newImage.size.height / 2), newImage.size.width, newImage.size.height), [newImage CGImage]);
newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
I need to apply CGContextConcatCTM because I have several concatenated transformations to the image.
I've tried several different approaches to no avail.
Thanks in advance for your help.
First of all, excuse me for my english, because it's not my native language. I hope it's not so late to give this answer!
I had a similar problem loading photos from library taken with iPhone or iPod cammera because of this. If that's your case, you can found some info here: https://discussions.apple.com/thread/2495567?start=30&tstart=0, specifically from an answer that says "Apple chose to use the Orientation flag in the EXIF data to inform the program displaying the image as to how to rotate it so the image is presented correctly."
So, for load a photo from library taken with iPhone Cammera, you have to do this:
ALAssetRepresentation *assetRep = [photo defaultRepresentation];
CGImageRef imageRef = [assetRep fullResolutionImage];
UIImage *image = [UIImage imageWithCGImage:imageRef scale:[assetRep scale] orientation:[assetRep orientation]];
where photo is an ALAsset object taken from library.
Well, i hope this helps!

How to draw a Mirrored UIImage in UIView with drawRect?

I load a image and create a mirror in this way:
originalImg = [UIImage imageNamed:#"ms06.png"];
mirrorImg = [UIImage imageWithCGImage:[originalImg CGImage] scale:1.0 orientation:UIImageOrientationUpMirrored];
Then I set the above UIImage object to a subclass of UIView, and override the drawRect:
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
CGAffineTransform t0 = CGContextGetCTM(context);
CGContextConcatCTM(context, t0);
CGContextDrawImage(context, self.bounds, [image CGImage]);
CGContextRestoreGState(context);
}
No matter which image I draw, the displayed image always be the original one, mirrored image was never displayed when set to the UIView subclass.
I'm sure that the mirrored image was set to the UIView correctly because the debug info showed that the orientation member variable equals to 4, which means "UIImageOrientationUpMirrored", while the original image equals to 0.
Does anyone could help me with this problem, thanks.
I also tried to display the mirrored image in UIImageView with setImage: and it works correctly. By the way I found that the breakpoint in drawRect was never hit when call the setImage of UIImageView, how can we define the drawing behavior(such as draw a line above the image) when loading image to the UIImageView?
You mirrow the image on UI-Level. This returns a new UIImage, but the CGImage stays the same. If you do some NSLogs, you will notice this.
You can also do transformations on UI-Level. If you use this approach, I would suggest to use originalImg.scale instead of 1.0. Then the code would work for retina and non-retina displays.
[UIImage imageWithCGImage:[originalImg CGImage] scale:originalImg.scale orientation:UIImageOrientationUpMirrored];
If you really need to mirror the CGImage, take a look at NYXImagesKit on GitHub (see UIImage+Rotating.m)

Add 2 UIImages into One UIImage

I am adding 2 images to each other and wanted to know if this is a good way to do this? This code works and looked to be powerful.
So, my question really is, It this good or is there a better way?
PS: Warning code written by a designer.
Call the function:
- (IBAction) {
UIImage *MyFirstImage = UIImage imageNamed: #"Image.png"];
UIImage *MyTopImage = UIImage imageNamed: #"Image2.png"];
CGFloat yFloat = 50;
CGFloat xFloat = 50;
UIImage *newImage = [self placeImageOnImage:MyFirstImage imageOver:MyTopImage x:&xFloat y:&yFloat];
}
The Function:
- (UIImage*) placeImageOnImage:(UIImage *)image topImage:(UIImage *)topImage x:(CGFloat *)x y:(CGFloat *)y {
// if you want the image to be added next to the image make this CGSize bigger.
CGSize newSize = CGSizeMake(image.size.width,image.size.height);
UIGraphicsBeginImageContext( newSize );
[topImage drawInRect:CGRectMake(*x,*y,topImage.size.width,topImage.size.height)];
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height) blendMode:kCGBlendModeDestinationOver alpha:1];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
Looks OK. Perhaps you don't really need the CGFloat pointers, but that's fine, too.
The main idea is correct. There is no better way to do what you want.
Minuses:
1) Consider UIGraphicsBeginImageContextWithOptions method. UIGraphicsBeginImageContext isn't good for retina.
2) Don't pass floats as pointers. Use x:(CGFloat)x y:(CGFloat)y instead
You should use the begin context version, UIGraphicsBeginImageContextWithOptions, that allows you to specify options for scale (and pass 0 as the scale) do you don't lose any quality on retina displays.
If you want one image drawn on top of another image, just draw the one in back, then the one in front, exactly as if you were using paint. There is no need to use blend modes.
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
[topImage drawInRect:CGRectMake(*x,*y,topImage.size.width,topImage.size.height)];

How to ReSize Image with Good Quality in iPhone

I want to create a Photos Library as existing photo library in iPhone. I add image in scrollviewer which is chosen from Photo library. Before add image i resize the selected image and set it to ImageView Control.But when i compare to added image quality with iPhone Photo library image quality, my control image is not good. How to bring the quality and withou memory overflow issue.
-(UIImage*)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize
{
// Create a bitmap context.
UIGraphicsBeginImageContext( newSize );
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
I ran into this issue also. I think you're using an iPhone 4 with Retina Display. Even if you're not, you should account for it. Instead of UIGraphicsBeginImageContext(), use UIGraphicsBeginImageContextWithOptions() and use the scale property of UIScreen for the third argument. All iOS devices have the scale property, on iPhone 4 it's set to 2.0; on the rest, as I write this, it's set to 1.0.
So your code, with those changes, becomes
-(UIImage *)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize
{
// Create a bitmap context.
UIGraphicsBeginImageContextWithOptions(newSize, YES, [UIScreen mainScreen].scale);
[image drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
UIImage* newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
Following the solution from ageektrapped, for PNG's transparent images, you should set the second parameter to NO/false for
UIGraphicsBeginImageContextWithOptions(..., NO, ...);
will solve the black/white background issue

Saving UIView contents in iOS 4 with real size of the images inside (i.e. scale contentes up for save)

I have an UIView with many UIImageViews as subviews. The app runs on iOS4 and I use images with retina display resolution (i.e. the images load with scale = 2)
I want to save the contents of the UIView ... BUT ... have the real size of the images inside. I.e. the view has size 200x200 and images with scale=2 inside, I'd like to save a resulting image of 400x400 and all the images with their real size.
Now what comes first to mind is to create a new image context and load again all images inside with scale=1 and that should do, but I was wondering if there is any more elegant way to do that? Seems like a waist of memory and processor time to reload everything again since it's already done ...
p.s. if anyone has an answer - including code would be nice
Implementation for rendering any UIView to image (working also for retina display).
helper.h file:
#interface UIView (Ext)
- (UIImage*) renderToImage;
#end
and belonging implementation in helper.m file:
#import <QuartzCore/QuartzCore.h>
#implementation UIView (Ext)
- (UIImage*) renderToImage
{
// IMPORTANT: using weak link on UIKit
if(UIGraphicsBeginImageContextWithOptions != NULL)
{
UIGraphicsBeginImageContextWithOptions(self.frame.size, NO, 0.0);
} else {
UIGraphicsBeginImageContext(self.frame.size);
}
[self.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
0.0 is the scale factor. The scale factor to apply to the bitmap. If you specify a value of 0.0, the scale factor is set to the scale factor of the device’s main screen.
QuartzCore.framework also should be put into the project because we are calling function on the layer object.
To enable weak link on UIKit framework, click on the project item in left navigator, click the project target -> build phases -> link binary and choose "optional" (weak) type on UIKit framework.
Here is library with similar extensions for UIColor, UIImage, NSArray, NSDictionary, ...
I've performed such thing to save the pins from the MKMapView as a PNG file (in retina display): MKPinAnnotationView: Are there more than three colors available?
Here's an extract of the crucial part that performs the saving of a UIView (theView) using its retina definition:
-(void) saveMyView:(UIView*)theView {
//The image where the view content is going to be saved.
UIImage* image = nil;
UIGraphicsBeginImageContextWithOptions(theView.frame.size, NO, 2.0);
[theView.layer renderInContext: UIGraphicsGetCurrentContext()];
image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
NSData* imgData = UIImagePNGRepresentation(image);
NSString* targetPath = [NSString stringWithFormat:#"%#/%#", [self writablePath], #"thisismyview.png" ];
[imgData writeToFile:targetPath atomically:YES];
}
-(NSString*) writablePath {
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *documentsDirectory = [paths objectAtIndex:0];
return documentsDirectory;
}
The key is that the third parameter to UIGraphicsBeginImageContextWithOptions is the scale, which determines how the image will ultimately be written out.
If you always want the real pixel dimensions, use [[UIScreen mainScreen] scale] to get the current scale of the screen:
UIGraphicsBeginImageContextWithOptions(viewSizeInPoints, YES, [[UIScreen mainScreen] scale]);
If you use scale=1.0 on iPhone4, you will get an image with its dimension in points and the result is scaled down from the true pixel count. If you manually write the image out to a 640x960 dimension (eg: passing pixels as the first parameter), it will actually be the scaled-down image that is scaled back up which looks about as terrible as you imagine it would look.
Couldn't you just create a new graphics context at the desired size, use a CGAffineTransform to scale it down, render the root UIView's root layer, restore the context to the original size and render the image? Haven't tried this for retina content, but this seems to work well for large images that have been scaled down in UIImageViews...
something like:
CGSize originalSize = myOriginalImage.size; //or whatever
//create context
UIGraphicsBeginImageContext(originalSize);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context); //1 original context
// translate/flip the graphics context (for transforming from CG* coords to UI* coords
CGContextTranslateCTM(context, 0, originalSize.height);
CGContextScaleCTM(context, 1.0, -1.0);
//original image
CGContextDrawImage(context, CGRectMake(0,0,originalSize.width,originalSize.height), myOriginalImage.CGImage);
CGContextRestoreGState(context);//1 restore to original for UIView render;
//scaling
CGFloat wratio = originalSize.width/self.view.frame.size.width;
CGFloat hratio = originalSize.height/self.view.frame.size.height;
//scale context to match view size
CGContextSaveGState(context); //1 pre-scaled size
CGContextScaleCTM(context, wratio, hratio);
//render
[self.view.layer renderInContext:context];
CGContextRestoreGState(context);//1 restore to pre-scaled size;
UIImage *exportImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
Import QuartzCore (Click main project, Build Phases, import) and where you need it add:
#import <QuartzCore/QuartzCore.h>
My imageViews are properties, if your are not, ignore the .self and pass the imageViews into the function as parameters, then call renderInContext on the two images in a new UIGraphicsCurrentContext
- (UIImage *)saveImage
{
UIGraphicsBeginImageContextWithOptions(self.mainImage.bounds.size, NO, 0.0);
[self.backgroundImage.layer renderInContext:UIGraphicsGetCurrentContext()];
[self.mainImage.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *savedImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return savedImage;
}