Create Scalable Path CGContextPath

Question

I'm new to developing in iOS.

I have problem when draw with Core Graphics/UIKit. I want to implement a function like shape of paint in Window.

I use this source: https://github.com/JagCesar/Simple-Paint-App-iOS, and add new function.

When touchesMoved, I draw a shape, based on the point when touchesBegan, and the current touch point. It draws all the shape.

    - (void)drawInRectModeAtPoint:(CGPoint)currentPoint
    {
    UIGraphicsBeginImageContext(self.imageViewDrawing.frame.size);
    CGContextRef context = UIGraphicsGetCurrentContext();

    [self.currentColor setFill];

    [self.imageViewDrawing.image drawInRect:CGRectMake(0, 0, self.imageViewDrawing.frame.size.width, self.imageViewDrawing.frame.size.height)];

    CGContextMoveToPoint(context, self.beginPoint.x, self.beginPoint.y);
    CGContextAddLineToPoint(context, currentPoint.x, currentPoint.y);
    CGContextAddLineToPoint(context, self.beginPoint.x * 2 - currentPoint.x, currentPoint.y);
    CGContextAddLineToPoint(context, self.beginPoint.x, self.beginPoint.y);
    CGContextFillPath(context);

    self.currentImage = UIGraphicsGetImageFromCurrentImageContext();
    self.imageViewDrawing.image = self.currentImage;
    UIGraphicsEndImageContext();
    }

I mean, I want to create only one shape, when touchesBegan, the app record the point, when touchesMoved, the shape is scaled by touches, and when touchesEnd, draw the shape to the ImageContex

Hope you can give me some tips to do that. Thank you.

So you mean you want to drag out from the touch start to end, resizing the image each time you get an update and then save the final image to the context at the end? — Wain, Sep 26 '13 at 10:17
I mean, I want to create only one shape, when touchesBegan, the app record the point, when touchesMoved, the shape is scaled by touches, and when touchesEnd, draw the shape to the ImageContext — user2818764, Sep 26 '13 at 14:08

score 0 · Answer 1 · answered Sep 26 '13 at 15:10

You probably want to extract this functionality away from the context. As you are using an image, use an image view. At the start of the touches, create the image and the image view. Set the image view frame to the touch point with a size of {1, 1}. As the touch moves, move / scale the image view by changing its frame. When the touches end, use the start and end points to render the image into the context (which should be the same as the final frame of the image view).

Doing it this way means you don't add anything to the context which would need to be removed again when the next touch update is received. The above method would work similarly with a CALayer instead of an image view. You could also look at a solution using a transform on the view.

Create Scalable Path CGContextPath

1 Answers1