Iphonesdk Merge three images two single image

Question

i am working on iphone app where i have to merge three images and make them single image. I mean to say i have a background image, a header image and lower image, i need to combine all this to make a single image so i can use it to post to the facebook. thanks.

*EDIT* i know this code for two images but how can i use it for three images :

UIGraphicsBeginImageContext(saveView.bounds.size);
[saveView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

Answer 1

You can just align them together in a single UIView ( I think even off-screen but I haven't checked yet) - and then just convert that UIView to a UIImage using QuartzCode:

UIGraphicsBeginImageContext(myView.bounds.size);
[myView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

Then turn that into a format - like PNG for instance:

NSData *imageData = UIImagePNGRepresentation(image);

Then sending shouldn't be too difficult.

EDIT Here is an extended example you can also see for 3 images - you can of course use Interface Builder and Outlets instead of writing it all - but you can copy paste this to try:

UIImageView *imgView1, *imgView2, *imgView3;
imgView1 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image1"]];
imgView2 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image2"]];
imgView3 = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image3"]];

imgView1.frame = CGRectMake(0, 0, 50, 50);
imgView2.frame = CGRectMake(50, 50, 100, 100);
imgView3.frame = CGRectMake(100, 100, 200, 200);

[referenceView addSubview:imgView1];
[referenceView addSubview:imgView2];
[referenceView addSubview:imgView3];

UIGraphicsBeginImageContext(referenceView.bounds.size);
[referenceView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

resultView = [[UIImageView alloc] initWithImage:finalImage];
resultView.frame = CGRectMake(0, 0, 320, 480);
[self.view addSubview:resultView];

referenceView.hidden = YES; 

NOTE I've checked and the UIView must be drawable/visible at the time you call renderInContext (it can be off-screen but it cannot be hidden or alpha=0 because then it will be rendered invisible). So either put it off-screen or immediately hide it after drawing

Answer 2

Shein's answer helped me but I found I did not have to add the UIView to the main view in order to render it. Here is an example of adding text to an image...

    UIImage *image = [UIImage imageNamed:@"toolbar_icon"]; // image is 20 x 20 .png

    UIView *tempView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, image.size.width, image.size.height)];
    [tempView addSubview:[[UIImageView alloc] initWithImage:image]];

    UILabel *label = [[UILabel alloc] initWithFrame:tempView.frame];
    [label setText:[NSString stringWithFormat:@"%d", [self countValue]]];
    [label setFont:[UIFont systemFontOfSize:22.0]];
    [label setTextColor:[UIColor lightTextColor]];
    [label setTextAlignment:UITextAlignmentCenter];
    [label setBackgroundColor:[UIColor clearColor]];
    [tempView addSubview:label];

    UIGraphicsBeginImageContext(tempView.bounds.size);
    [tempView.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    UIBarButtonItem *countItem = [[UIBarButtonItem alloc] initWithImage:finalImage
                                                                       style:UIBarButtonItemStyleBordered
                                                                      target:self
                                                                      action:@selector(countAction:)];

NOTE: I suddenly realized my answer includes adding a label to an image which is what I was trying to do before finding this. Reference Combine Label Text With Image