5

i have a view with uiimageview i assign this uiimageview image by camera..now i want to do some drawing onto image....using coregraphics.i want to do something like this... select an area by touching and drawing line when line joins something like circle or any shape..i want to change that particular area in to something else for example change color there.turn that into grayscale.. till now i am able to draw line...here is an image of line drawn over a uiimage view...

alt text

but i am unable to figure it out how do i draw at imageview's image..mean how to modify imageview's image???

also i want to restore image when click on clear button or something like undo..does someone knows how to achieve this?

and

how do i create a rectangle when click on crop button move the rectangle any where on the screen...and then push the button to crop the image...and then save cropped image..

Glorfindel
  • 21,988
  • 13
  • 81
  • 109
Rahul Vyas
  • 28,260
  • 49
  • 182
  • 256

3 Answers3

9

These are the steps:

  1. Create a CGBitmapContext matching the image's colorspace and dimensions.
  2. Draw the image into that context.
  3. Draw whatever you want on top of the image.
  4. Create a new image from the context.
  5. Dispose off the context.

Here's a method that takes an image, draws something on top of it and returns a new UIImage with modified contents:

- (UIImage*)modifiedImageWithImage:(UIImage*)uiImage
{
    // build context to draw in
    CGImageRef image = uiImage.CGImage;
    CGColorSpaceRef colorspace = CGColorSpaceCreateDeviceRGB();
    CGContextRef ctx = CGBitmapContextCreate(NULL,
                                             CGImageGetWidth(image), CGImageGetHeight(image),
                                             8, CGImageGetWidth(image) * 4,
                                             colorspace, kCGImageAlphaPremultipliedLast);
    CGColorSpaceRelease(colorspace);

    // draw original image
    CGRect r = CGRectMake(0, 0, CGImageGetWidth(image), CGImageGetHeight(image));
    CGContextSetBlendMode(ctx, kCGBlendModeCopy);
    CGContextDrawImage(ctx, r, image);
    CGContextSetBlendMode(ctx, kCGBlendModeNormal);

    // draw something
    CGContextAddEllipseInRect(ctx, CGRectInset(r, 10, 10));
    CGContextSetRGBStrokeColor(ctx, 1.0f, 1.0f, 1.0f, 0.5f);
    CGContextSetLineWidth(ctx, 16.0f);
    CGContextDrawPath(ctx, kCGPathStroke);

    CGContextAddEllipseInRect(ctx, CGRectInset(r, 10, 10));
    CGContextSetRGBStrokeColor(ctx, 0.7f, 0.0f, 0.0f, 1.0f);
    CGContextSetLineWidth(ctx, 4.0f);
    CGContextDrawPath(ctx, kCGPathStroke);

    // create resulting image
    image = CGBitmapContextCreateImage(ctx);
    UIImage* newImage = [[[UIImage alloc] initWithCGImage:image] autorelease];
    CGImageRelease(image);
    CGContextRelease(ctx);

    return newImage;
}

To restore to old image, just keep a reference to it.

The cropping thing is not related to the above and you should create a new question for that.

Nikolai Ruhe
  • 81,520
  • 17
  • 180
  • 200
  • ok your code works great.now tell me when i use quartz for drawing line why it is slow on actual device.and also tell me a way how do i turn image into grayscale. – Rahul Vyas Sep 26 '09 at 10:21
  • 1
    Your other questions should be posted as new questions. – Nikolai Ruhe Sep 26 '09 at 10:35
  • ok i got it to turn it in gray.now is there a way i can turn the image into something else.where in the above image a selection like circle is there.i mean any path – Rahul Vyas Sep 26 '09 at 10:43
  • could you please explain your code in detail.you are such a genious person. – Rahul Vyas Sep 26 '09 at 10:45
  • it always turn image into gray.even if i pass a color to it.see the code below. just change your code in some places. // draw original image CGRect r = CGRectMake(0, 0, CGImageGetWidth(image), CGImageGetHeight(image)); CGContextSetBlendMode(ctx, kCGBlendModeCopy); CGContextDrawImage(ctx, r, image); // draw something CGRect rect=CGRectMake(50.0, 50.0, 50.0, 50.0); CGContextAddRect(ctx,rect); CGContextSetRGBStrokeColor(ctx, 0.0f, 1.0f, 1.0f, 0.5f); CGContextSetBlendMode(ctx, kCGBlendModeColor); CGContextFillPath(ctx); – Rahul Vyas Sep 26 '09 at 10:48
  • I'm sorry, I don't understand your follow up question. – Nikolai Ruhe Sep 26 '09 at 10:48
  • i mean i turn your code as i above posted but it always drwas gray in a give rectangle and redrwas the image.how do draw another colors.in your ellipse.i mean fill elipse with desired color – Rahul Vyas Sep 26 '09 at 10:56
1

A lot easier solution would be

(UIImage *) modifyImage:(UIImage *)inputImage
{
   UIGraphicsBeginImageContext(inputImage.size);
   [inputImage drawInRect:CGRectMake(0, 0, inputImage.size.width, inputImage.size.height);
   CGContextRef ctx = UIGraphicsGetCurrentContext();
   //Drawing code using above context goes here
   /*
    *
    */
   UIImage *outputImage = UIGraphicsGetImageFromCurrentImageContext();
   UIGraphicsEndImageContext();
   return outputImage;
}
zambrey
  • 1,452
  • 13
  • 21
0

Take a look at Overview of Quartz 2D for information on using Quartz 2D on iPhone.

Nick Bedford
  • 4,365
  • 30
  • 36