Merge Two uiimageview into single a single uiimageview in iOS

Question

I found given below code for Merge two image if any one has another code merge this two image into a single image.

When i Merge two uiimageview into a single uiimageview then the Final image getting black or white shade.. Actual Color of masking image not coming in final image enter image description here

- (void)viewDidLoad {
  [super viewDidLoad];
  // Do any additional setup after loading the view from its nib.
  self.navigationController.navigationBarHidden = YES;
  imgBack = [UIImage imageNamed:@"img1.jpg"];
  imgMask = [UIImage imageNamed:@"img2.png"];
  imgBackground.image = imgBack;
  imgMasking.image = imgMask;

  imgFinally = [self maskImage:imgBack withMask:imgMask];
  imgFinal.image = imgFinally;

  imgBackground.image= nil;
  imgMasking.image = nil;
}

- (UIImage *) maskImage:(UIImage *)image
             withMask:(UIImage *)maskImage {

CGImageRef maskRef = maskImage.CGImage;

CGImageRef mask = CGImageMaskCreate(CGImageGetWidth(maskRef),
                                    CGImageGetHeight(maskRef),
                                    CGImageGetBitsPerComponent(maskRef),
                                    CGImageGetBitsPerPixel(maskRef),
                                    CGImageGetBytesPerRow(maskRef),
                                    CGImageGetDataProvider(maskRef), NULL, false);

CGImageRef masked = CGImageCreateWithMask([image CGImage], mask);

return [UIImage imageWithCGImage:masked];
}

Mind posting some appropriate images? Some of us might be in office. — viral, Apr 11 '13 at 09:44
see my this answer... http://stackoverflow.com/questions/14049796/howe-to-capture-uiview-top-uiview/14049828#14049862 just capture that view and save in your library — Paras Joshi, Apr 11 '13 at 09:44

score 6 · Answer 1 · edited Apr 11 '13 at 12:49

6

Put your All the Images in One View and call this method, it merges all the images and give new image

+ (UIImage *) imageWithView:(UIView *)view
{

     UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0);

     [view.layer renderInContext:UIGraphicsGetCurrentContext()];

     UIImage * img = UIGraphicsGetImageFromCurrentImageContext();

     UIGraphicsEndImageContext();

     return img;

}

edited Apr 11 '13 at 12:49

Popeye

11,839
9
58
91

answered Apr 11 '13 at 12:46

yen

772
3
10

What do you mean by Put your All the Images in One View. Do we add UIImageView to view as subviews? – Van Du Tran Jul 26 '13 at 22:27
Yes you need to put your image in UIView and call this method to create image. – yen Jul 29 '13 at 03:50

Arun · Answer 2 · 2013-04-11T11:45:38.710

Hi try this....

   UIImage* bottomImage = [UIImage imageNamed:@"index.jpg"];
    UIImage* topImage    = [UIImage imageNamed:@"tiger.png"];
    UIImageView* imageView = [[UIImageView alloc] initWithImage:bottomImage];
    UIImageView* subView   = [[UIImageView alloc] initWithImage:topImage];
    [imageView addSubview:subView];
     UIGraphicsBeginImageContext(imageView.frame.size);
    CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeMultiply);
    [imageView.layer renderInContext:UIGraphicsGetCurrentContext()];
    UIImage* blendedImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    [subView release];
    [imageView release];
    self.resultImage.image=blendedImage; //Your Image set

The final modified method for your issue:-

- (UIImage*) mergeTwoImages : (UIImage*) topImage : (UIImage*) bottomImage
{
    // URL REF: http://iphoneincubator.com/blog/windows-views/image-processing-tricks
    // URL REF: http://stackoverflow.com/questions/1309757/blend-two-uiimages?answertab=active#tab-top
    // URL REF: http://www.waterworld.com.hk/en/blog/uigraphicsbeginimagecontext-and-retina-display

    int width = bottomImage.size.width;
    int height = bottomImage.size.height;

    CGSize newSize = CGSizeMake(width, height);
    static CGFloat scale = -1.0;

    if (scale<0.0)
    {
        UIScreen *screen = [UIScreen mainScreen];

        if ([[[UIDevice currentDevice] systemVersion] floatValue] >= 4.0)
        {
            scale = [screen scale];
        }
        else
        {
            scale = 0.0;    // Use the standard API
        }
    }

    if (scale>0.0)
    {
        UIGraphicsBeginImageContextWithOptions(newSize, NO, scale);
    }
    else
    {
        UIGraphicsBeginImageContext(newSize);
    }

    [bottomImage drawInRect:CGRectMake(0,0,newSize.width,newSize.height)];
//    [topImage drawInRect:CGRectMake(0,0,newSize.width,newSize.height) blendMode:kCGBlendModeLighten alpha:1.0];
    [topImage drawInRect:CGRectMake(0,0,newSize.width,newSize.height) blendMode:kCGBlendModeMultiply alpha:1.0];
    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return newImage;
}

I hope this method will solve your issue....

let me know if you face any difficulties and don't post images like above... may be some peoples may not answer your question for this — Arun, Apr 11 '13 at 11:04
hi it's work but bottom image not appear and if it merge then the merge color will be changed that is my problem — kagmanoj, Apr 12 '13 at 04:39

score 1 · Answer 3 · answered Jun 22 '18 at 06:49

Try this

UIImage *image1 = [UIImage imageNamed:@"image1.png"];
UIImage *image2 = [UIImage imageNamed:@"image2.png"];

CGSize size = CGSizeMake(image1.size.width, image1.size.height);

UIGraphicsBeginImageContext(size);

[image1 drawInRect:CGRectMake(0,0,size.width, image1.size.height)];
[image2 drawInRect:CGRectMake(0,0,size.width, image2.size.height)];

UIImage *finalImage = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

//Add image to view
imageView.image = finalImage;

score 0 · Answer 4 · answered Apr 11 '13 at 09:49

The developer documentation states that:

A mask. If the mask is an image, it must be in the DeviceGray color space, must not have an alpha component, and may not itself be masked by an image mask or a masking color. If the mask is not the same size as the image specified by the image parameter, then Quartz scales the mask to fit the image.

Unlike e.g. Photoshop, CoreGraphics does not allow masking trough alpha channels, but rather trough grayscale. Did you make sure your mask is grayscale?

score 0 · Answer 5 · answered Apr 11 '13 at 12:57

0

I have no code for you, but as I understand, you must mask that flame image with itself and than merge it into the image with the beauty.

answered Apr 11 '13 at 12:57

vikingosegundo

52,040
14
137
178

Merge Two uiimageview into single a single uiimageview in iOS

5 Answers5