CODEWITHSUNDEEP
objective-cuiviewuiimageview
Brett Gregson
Brett Gregson

Reputation: 5923

Saving UIImageView and overlayed UIView as an image (xcode/iOS)

I have an image loaded into a UIImageView, which has a UIView overlayed (with a CGRect drawn inside it), I am looking for a way to save what is displayed on the screen as a new image. I am using storyboards and ARC.

I have a UIViewController, which contains UIImageView. The UIView is displayed on top of this, and a circle is drawn where the user touches the screen. This all works fine, but now I want to save what is displayed as an image (JPG).

Screenshot of my storyboard:

enter image description here

Below is the code from my PhotoEditViewController so far. passedPhoto is the photo that is loaded into the UIImageView.

#import "PhotoEditViewController.h"
@interface PhotoEditViewController ()
@end

@implementation PhotoEditViewController
@synthesize selectedPhoto = _selectedPhoto;
@synthesize backButton;
@synthesize savePhoto;

- (void)viewDidLoad {
    [super viewDidLoad];
    [passedPhoto setImage:_selectedPhoto];
}

- (void)viewDidUnload {
    [self setBackButton:nil];
    [self setSavePhoto:nil];
    [super viewDidUnload];
}

- (IBAction)savePhoto:(id)sender{
    NSLog(@"save photo");
    // this is where it needs to happen!
}

@end

Below is the code from my PhotoEditView which handles the creation of the circle overlay:

#import "PhotoEditView.h"

@implementation PhotoEditView
@synthesize myPoint = _myPoint;

- (void)setMyPoint:(CGPoint)myPoint {
    _myPoint = myPoint;
    self.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.01];
    [self setNeedsDisplay];
}

- (id)initWithFrame:(CGRect)frame {
    self = [super initWithFrame:frame];
    return self;
}

-(void) touchesBegan: (NSSet *) touches withEvent: (UIEvent *) event {
    NSSet *allTouches = [event allTouches];
    switch ([allTouches count]){
        case 1: {
            UITouch *touch = [[allTouches allObjects] objectAtIndex:0];
            CGPoint point = [touch locationInView:self];
            NSLog(@"x=%f", point.x);
            NSLog(@"y=%f", point.y);    
            self.myPoint = point;
        }
        break;
    }
}

- (void)drawRect:(CGRect)rect {
    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextSetLineWidth(ctx, 4.0);
    CGContextSetRGBFillColor(ctx, 0, 0, 0, 0.5);
    CGContextSetRGBStrokeColor(ctx, 1.0, 0.0, 0.0, 1);
    CGContextStrokePath(ctx);
    CGRect circlePoint = CGRectMake(self.myPoint.x - 50, self.myPoint.y - 50, 100.0, 100.0);
    CGContextStrokeEllipseInRect(ctx, circlePoint);
}

@end

Any help would be appreciated.

Upvotes: 1

Views: 2317

Answers (1)

sergio
sergio

Reputation: 69047

Have you tried this:

UIGraphicsBeginImageContext(rect.size);

[imageView.layer renderInContext:UIGraphicsGetCurrentContext()];
[customView.layer renderInContext:UIGraphicsGetCurrentContext()];

UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

UIImageView *imgView = [[UIImageView alloc] initWithImage:viewImage];

This is just the same approach as for getting an UIImage from a UIView, only you draw two views in the same context.

Upvotes: 3

Related Questions