Image inside another image - ios

I'm based on this code:Custom MKAnnotationView with frame,icon and image
And I'm trying to do it a little different...I have an image non-transparent, and I want put an image inside.
My problem is that the background image cover my image. So it looks something like: http://cl.ly/image/0E0S00072G1n
My code is so:
annotationImageView.image = [UIImage imageNamed:#"marker_fb"];
UIImage *frame = [UIImage imageNamed:#"marker_fb"];
ImagePin *imagePinImage = annotation;
NSString *urlStringForImage = [NSString stringWithFormat:#"%#", imagePinImage.image];
NSURL *urlForImage = [NSURL URLWithString:urlStringForImage];
UIImageView *imageView = [[UIImageView alloc] init];
[imageView setImageWithURL:[NSURL URLWithString:[NSString stringWithFormat:#"%#", urlForImage]] placeholderImage:[UIImage imageNamed:#"avatar-placeholder.png"]];
UIGraphicsBeginImageContext(CGSizeMake(annotationImageView.image.size.width, annotationImageView.image.size.height));
[frame drawInRect:CGRectMake(0, 0, frame.size.width, frame.size.height)];
[imageView.image drawInRect:CGRectMake(2, 2, 48, 38)]; // the frame your inner image
annotationImageView.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
Does z-indez exist in object-c? or how should I do??
Thanks.
EDIT: I tried also with:
UIGraphicsBeginImageContextWithOptions(CGSizeMake(annotationImageView.image.size.width, annotationImageView.image.size.height), NO, 0);

Related

Download image through AFNetworking & edit it

I'm trying to download some image files from a remote server through the AFNetworking (UIImageView+AFNetworking.h) & retrieve the UIImage from it, edit that image. Editing means add that image(downloaded image) on top of another png file.( background image - UIImage )
I have tried several code blocks finally I'm stuck in here . I'm getting a black box only. Can't see the actual server image .
-(UIImage *)downloadImages:(NSString *)url{
UIImageView *downloadedImageView = [[UIImageView alloc]initWithFrame:CGRectMake(0,0,40,40)];
[downloadedImageView setImageWithURL:[NSURL URLWithString:url]
placeholderImage:[UIImage imageNamed:#"Loading_image"]];
UIGraphicsBeginImageContextWithOptions(downloadedImageView.bounds.size, downloadedImageView.opaque, 0.0);
[downloadedImageView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage * img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return img;
}
Then I'm calling through that function in a for loop.
for( int i=0;i<[Images count];i++){
NSString *image_Url = [NSString stringWithFormat:#"%#%#",imageURL, imagename];
UIImage *downloadimage =[[UIImage alloc]init];
downloadimage = [self downloadImages:image_Url];
UIImage *bottomImage = [UIImage imageNamed:#"map_marker_black"];
CGSize newSize = CGSizeMake(60, 60);
UIGraphicsBeginImageContext( newSize );
[backgroundImage drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
[downloadimage drawInRect:CGRectMake(0,0,newSize.width,newSize.height) blendMode:kCGBlendModeNormal alpha:0.7];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
}
Where am I doing wrong ? Your help is highly appreciated. Thanks a lot
A few issues. Lets start with the download code. There is no reason to deal with an image view and drawing it to create an image. Just use the actual image:
- (UIImage *)downloadImage:(NSString *)url{
NSData *imageData = [NSData dataWithContentsOfURL:[NSURL URLWithString:url]];
UIImage *image = [UIImage imageWithData:imageData];
return image;
}
The big issue with your original code is that the AFNetworking method you used runs in the background. So you were always trying to draw the "loading" image.
Now the drawing code:
// Only need to load this once
UIImage *backgroundImage = [UIImage imageNamed:#"map_marker_black"];
// What is the loop used for?
for (NSUInteger i = 0; i < [Images count]; i++){
// Where does imageURL and imagename come from?
NSString *imageURL = [NSString stringWithFormat:#"%#%#",imageURL, imagename];
UIImage *downloadImage = [self downloadImage:imageURL];
CGRect newRect = CGRectMake(0, 0, 60, 60);
UIGraphicsBeginImageContextWithOptions(newRect.size, NO, 0.0);
[backgroundImage drawInRect:newRect];
[downloadimage drawInRect:newRect blendMode:kCGBlendModeNormal alpha:0.7];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
// Do something here with newImage
UIGraphicsEndImageContext();
}
Note the comments in the code.

Image not showing from CGImageCreateWithImageInRect

My image will not display and I've tried other images as well, I just get a blank screen.
UIImage *img = [[UIImage alloc] initWithContentsOfFile:#"building-demolition4.gif"];
CGImageRef imageRef = CGImageCreateWithImageInRect([img CGImage], CGRectMake(0, 0, 208.5, 119));
UIImageView *ckImage = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 208.5, 119)];
ckImage.image = [UIImage imageWithCGImage:imageRef];
CGImageRelease(imageRef);
[self.view addSubview:ckImage];
The problem is that initWithContentsOfFile: requires a file path. #"building-demolition4.gif" is not a file path - it's just a bare name. So the runtime does not know where to look for the file - and is thus failing to find it.
If this image is inside your app bundle (because it was part of your project), the simple way to access it is with the UIImage class method imageNamed:.
(The more complex way is to get the path to the image with the NSBundle method pathForResource:..., but there is really no need for that here.)
I have used following code which works for me:
NSString *fileName = [[NSBundle mainBundle] pathForResource:#"myimg" ofType:#"png"];
UIImage *image = [UIImage imageWithContentsOfFile:fileName];
CGImageRef cgimg = image.CGImage;
UIImageView *imgview = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)];
[imgview setImage:[UIImage imageWithCGImage:cgimg]];
[self.view addSubview:imgview];
if you want to add gif file have look to following link might help you.
https://github.com/unixpickle/Giraffe

merge multiple UIImages on iOS

I want to merge multiple UIImages in iOS.
To do this, I tried to do as below:
UIImage *imageLeft = [UIImage imageNamed:#"ico-left"];
UIImage *imageRight = [UIImage imageNamed:#"ico-right"];
CGSize size = CGSizeMake(imageLeft.size.width + imageRight.size.width, imageLeft.size.height);
UIGraphicsBeginImageContext(size);
[imageLeft drawInRect:CGRectMake(0, 0, imageLeft.size.width, imageLeft.size.height)];
[imageRight drawInRect:CGRectMake(imageLeft.size.width, 0, imageRight.size.width, imageRight.size.height)];
UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, finalImage.size.width, finalImage.size.height)];
imageView.image = finalImage;
[cell.contentView addSubview:imageView];
But I cannot get any image. How can I fix it?
Thanks.
I think you are not adding extension of image (.png) so change your upper two lines by these
UIImage *imageLeft = [UIImage imageNamed:#"ico-left.png"];
UIImage *imageRight = [UIImage imageNamed:#"ico-right.png"];
I am not sure whether this is your problem but you can give it a try. Sometimes it worked for me
NSString *path1 = [[NSBundle mainBundle] pathForResource:#"ico-left" ofType:#"png"];
NSString *path2 = [[NSBundle mainBundle] pathForResource:#"ico-right" ofType:#"png"];
UIImage *imageLeft = [[UIImage alloc] initWithContentsOfFile:path1];
UIImage *imageRight = [[UIImage alloc] initWithContentsOfFile:path2];
Here's the code I use to merge images. (I think I found all or part of it online at some point). Put it in a UIImage category.
// NOTE! this method should only be called from the main thread because of
// UIGraphicsGetImageFromCurrentImageContext();
- (UIImage *)merge:(UIImage *)image atRect:(CGRect)pos overlay:(BOOL)overlay fillColor:(UIColor *)fill
{
UIGraphicsBeginImageContext(self.size);
UIImage *bottom = (overlay)?self:image;
UIImage *top = (overlay)?image:self;
CGRect lf = CGRectMake(0, 0, self.size.width, self.size.height);
CGRect bottomRect = (overlay)?lf:pos;
CGRect topRect = (overlay)?pos:lf;
if (fill){
[fill setFill];
CGContextFillRect (UIGraphicsGetCurrentContext(), topRect);
}
[bottom drawInRect:bottomRect];
[top drawInRect:topRect];
UIImage *destImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return destImage;
}

Strange behaviour with CGContext - iOS

The following code splits an image into 2. It seems working fine with non-retina devices, however it gives a different output with retina devices. Could someone please help me fix it? Thanks..
My Code
UIImage *img = [UIImage imageNamed:#"apple.png"];
CGSize sz = [img size];
UIGraphicsBeginImageContextWithOptions(CGSizeMake(sz.width/2, sz.height), NO, 0);
[img drawAtPoint:CGPointMake(-sz.width/2, 0)];
UIImage *right = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
rightView = [[[UIImageView alloc] initWithImage:right] autorelease];
rightView.frame = CGRectMake(self.view.frame.size.width/2, 0, self.view.frame.size.width/2, self.view.frame.size.height);
CGImageRef leftRef = CGImageCreateWithImageInRect([img CGImage],CGRectMake(0,0,sz.width/2,sz.height));
UIGraphicsBeginImageContextWithOptions(CGSizeMake(sz.width/2, sz.height), NO, 0);
CGContextRef con = UIGraphicsGetCurrentContext();
CGContextDrawImage(con, CGRectMake(0,0,sz.width/2.0,sz.height), leftRef);
UIImage *left = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImage *rotatedImage = [left imageRotatedByDegrees:180.0];
leftView = [[[UIImageView alloc] initWithImage:rotatedImage] autorelease];
leftView.frame = CGRectMake(0, 0, self.view.frame.size.width/2, self.view.frame.size.height);
leftView.transform = CGAffineTransformMake(-1,0,0,1,0,0);
CGImageRelease(leftRef);
[self.view addSubview:leftView];
[self.view addSubview:rightView];
non-retina
retina
PS: I don't know if this is important but apple.png has a #2x version..
The [-UIImage size] property returns the size in points, not in pixels. You probably need to also call [-UIImage scale] to figure out how the image is scaled.
When you create the left view with
leftView = [[[UIImageView alloc] initWithImage:rotatedImage] autorelease];,
you're not specifying the correct scale. Rather than creating your UIImage this way:
UIImage *left = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImage *rotatedImage = [left imageRotatedByDegrees:180.0];
try creating a CGImageRef and then initializing the UIImage using
[UIImage imageWithCGImage:scale:orientation:]
while specifying the correct scale. There are a number of ways to convert the raw image data from the context to a CGImageRef, or you can use the image you've created and use the CGImage property of UIImage.

my image is not getting cropped

i have the following code that i mostly got from SO but my image still is not getting cropped, what am i doing wrong?
#synthesize TopImage;
#synthesize BottomImage;
#synthesize RotaterImage;
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
TopImage = [UIImage imageNamed:#"zero.png"];
[TopImage drawAtPoint:CGPointMake(0, 0)];
[self cropImage:TopImage:0];
[self addSubview:[[UIImageView alloc] initWithImage:TopImage]];
// BottomImage = [UIImage imageNamed:#"zero.png"];
// [BottomImage drawAtPoint:CGPointMake(0, 55)];
// [self cropImage:BottomImage:50];
// [self addSubview:[[[UIImageView alloc] initWithImage:BottomImage]retain]];
// RotaterImage = [UIImage imageNamed:#"zero.png"];
// [RotaterImage drawAtPoint:CGPointMake(0, 0) blendMode:kCGBlendModeNormal alpha:0];
// [self addSubview:[[[UIImageView alloc] initWithImage:RotaterImage]retain]];
// [self cropImage:RotaterImage:50];
}
return self;
}
-(void)cropImage:(UIImage *)image:(int)startCroppingPosition{
CGRect tempRect = CGRectMake(0, startCroppingPosition, 23, 40);
CGImageRef imageRef = CGImageCreateWithImageInRect([image CGImage], tempRect);
// or use the UIImage wherever you like
image = [UIImage imageWithCGImage:imageRef];
CGImageRelease(imageRef);
}
I am very new to IOS so any help is appreciated
You're creating a new cropped image but not telling the init method about it :)
Try this change :
-(UIImage *)cropImage:(UIImage *)image:(int)startCroppingPosition{
CGRect tempRect = CGRectMake(0, startCroppingPosition, 23, 40);
CGImageRef imageRef = CGImageCreateWithImageInRect([image CGImage], tempRect);
// or use the UIImage wherever you like
UIImage *newImage = [UIImage imageWithCGImage:imageRef];
CGImageRelease(imageRef);
return newImage;
}
and, in init, replace
[TopImage drawAtPoint:CGPointMake(0, 0)];
with
UIImageView* topImageView = [[UIImageView alloc] initWithImage:topImage];
topImageView.frame = CGRectMake(x,y,width,height);
Your crop method now returns the newly cropped image and stores it in TopImage.
Other advice :
Class names begin with a CapitalLetter, variables begin with lowercase. TopImage should really be topImage.
Also, I would always use named parameters in your methods, so
-(void)cropImage:(UIImage *)image:(int)startCroppingPosition
should be something like
-(void)cropImage:(UIImage *)image startPosition:(int)startCroppingPosition
That will make your code much much more readable when you come back to it in a month's time (I've learned that the hard way in the past!)
You are only changing the image and not the image of the UIImageView,
What I would do is replace:
[self addSubview:[[UIImageView alloc] initWithImage:TopImage]];
with
UIImageView *iv = [[UIImageView alloc] initWithImage:TopImage]];
iv.tag = 1000 //number does not matter
[self.view addSubview:iv];
[iv release];
then in crop image you just add:
UIImageView *iv = [self.vief viewWithTag:1000];
iv.image = [UIImage imageWithCGImage:imageRef];
This should then work as expected!

Resources