I have UIView subclass and I want to draw a CGPath out of the drawRect. I have heard that it is and isn't possible. I understand that the CGPath needs context. I tried to give it context with the newImage. I am also thinking that I have to call this differently for example my code in a CCLayer for the view to display what would be in the drawRect
- (void)createPath:(CGPoint)origin
{
CGSize size=CGSizeMake(320, 480);
CGContextRef context = UIGraphicsGetCurrentContext();
UIGraphicsBeginImageContextWithOptions(size,YES,1.0f);
CGContextSaveGState(context);
UIImage *myImage = UIGraphicsGetImageFromCurrentImageContext();
CGRect newRect= CGRectMake(0, 0, 320, 480);
CGMutablePathRef path1 = CGPathCreateMutable();
CGPathMoveToPoint(path1, nil,100, 200);
CGPoint newloc = CGPointMake(300, 130);
CGPathMoveToPoint(path1, NULL, newloc.x, newloc.y);
CGPathAddLineToPoint(path1, NULL, newloc.x + 16,newloc.y + 38);
CGPathAddLineToPoint(path1, NULL, newloc.x + 49, newloc.y + 0);
CGPathAddLineToPoint(path1, NULL, newloc.x + 23, newloc.y - 39);
CGPathAddLineToPoint(path1, NULL, newloc.x - 25,newloc.y - 40);
CGPathAddLineToPoint(path1, NULL, newloc.x -43, newloc.y + 0);
CGPathCloseSubpath(path1);
CGContextAddPath(context, path1);
CGContextSaveGState(context);
CGContextSetLineWidth(context, 10.0);
CGContextSetStrokeColorWithColor(context, [UIColor orangeColor].CGColor);
CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor);
//Fill and stroke
CGContextDrawPath(context, kCGPathFillStroke);
//CGContextDrawImage(context, newRect, myImage.CGImage);
UIGraphicsEndImageContext();
CGContextRestoreGState(context);
CGPathRelease(path1);
CGContextRelease(context);
}
See if this helps you. Have a UIView with UIImageView as it's subview. Then implement the touches method as below:
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
//Get touch point
CGPoint currentPoint = [touch locationInView:drawImage];
UIGraphicsBeginImageContext(self.frame.size);
//drawImage is the UIImageView
[drawImage.image drawInRect:CGRectMake(0, 0, drawImage.frame.size.width, drawImage.frame.size.height)];
//Line attributes
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 10.0);
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 0.5, 1.0, 1.0);
//Begin path
CGContextBeginPath(UIGraphicsGetCurrentContext());
CGPathMoveToPoint(drawPath, NULL, lastPoint.x, lastPoint.y);
CGPathAddLineToPoint(drawPath, NULL, currentPoint.x, currentPoint.y);
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y);
CGContextStrokePath(UIGraphicsGetCurrentContext());
drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
}
Now you have the UIImageView visible with what you drew and drawPath will have your path.
Related
Im trying to make a UILabel with the edges looking like the following image.
Here is the drawRect: from my UILabel subclass.
-(void)drawRect:(CGRect)rect{
[super drawRect:rect];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
CGRect labelRect = self.bounds;
CGPoint bottomPoint = CGPointMake(labelRect.size.width, rect.size.height);
CGPoint topMinus30Point =CGPointMake(labelRect.size.width-30, 0);
CGPoint topPoint = CGPointMake(labelRect.size.width, 0);
CGContextBeginPath (context);
//from bottom to -30 top
CGContextMoveToPoint(context, bottomPoint.x,bottomPoint.y);
CGContextAddLineToPoint(context, topMinus30Point.x,topMinus30Point.y);
//from -30 to top
CGContextMoveToPoint(context, topMinus30Point.x,topMinus30Point.y);
CGContextAddLineToPoint(context, topPoint.x,topPoint.y);
//from top to bottom
CGContextMoveToPoint(context, topPoint.x,topPoint.y);
CGContextAddLineToPoint(context, bottomPoint.x,bottomPoint.y);
CGContextClosePath(context);
CGContextStrokePath(context);
CGContextRestoreGState(context);
}
How do I crop the created path from the current frame ?
[Im just getting started with Core Graphics, so please be gentle :)]
Any pointers on how to achieve this would be really helpful.
Thanks
Try this:
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
// clear drawing rect
CGContextClearRect(context, rect);
// save 1
CGContextSaveGState(context);
CGRect labelRect = self.bounds;
CGPoint bottomPoint = CGPointMake(labelRect.size.width, rect.size.height);
CGPoint topMinus30Point = CGPointMake(labelRect.size.width-30, 0);
CGPoint topPoint = CGPointMake(labelRect.size.width, 0);
CGContextBeginPath(context);
CGContextMoveToPoint(context, 0.0f, 0.0f);
CGContextAddLineToPoint(context, topMinus30Point.x, topMinus30Point.y);
CGContextAddLineToPoint(context, bottomPoint.x, bottomPoint.y);
CGContextAddLineToPoint(context, 0.0f, bottomPoint.y);
CGContextAddLineToPoint(context, 0.0f, 0.0f);
CGContextClosePath(context);
CGContextSetFillColorWithColor(context, [UIColor redColor].CGColor);
CGContextDrawPath(context, kCGPathFill);
// restore 1
CGContextRestoreGState(context);
}
Put this in the init you use:
[self setBackgroundColor:[UIColor clearColor]];
One approach is,
set the background color of label to clear color, and draw the required shape inside your drawRect method using CGContext.
Your drawRect will become like this
- (void)drawRect:(CGRect)rect{
[super drawRect:rect];
CGContextRef context = UIGraphicsGetCurrentContext();
CGRect labelRect = self.bounds;
CGPoint bottomPoint = CGPointMake(labelRect.size.width, rect.size.height);
CGPoint topMinus30Point =CGPointMake(labelRect.size.width-30, 0);
//from bottom to -30 top
CGContextMoveToPoint(context, self.bounds.origin.x,self.bounds.origin.y);
CGContextAddLineToPoint(context, topMinus30Point.x,topMinus30Point.y);
CGContextAddLineToPoint(context, bottomPoint.x,bottomPoint.y);
CGContextAddLineToPoint(context, self.bounds.origin.x,self.bounds.origin.x + self.bounds.size.height);
CGContextAddLineToPoint(context, self.bounds.origin.x,self.bounds.origin.y);
CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);
CGContextFillPath(context);
}
Another approach is using the CGContextClip using this approach your drawRect will become like this
CGContextMoveToPoint(context, self.bounds.origin.x,self.bounds.origin.y);
CGContextAddLineToPoint(context, topMinus30Point.x,topMinus30Point.y);
CGContextAddLineToPoint(context, bottomPoint.x,bottomPoint.y);
CGContextAddLineToPoint(context, self.bounds.origin.x,self.bounds.origin.x + self.bounds.size.height);
CGContextAddLineToPoint(context, self.bounds.origin.x,self.bounds.origin.y);
CGContextClip(context);
CGContextSetFillColorWithColor(context, [UIColor greenColor].CGColor);
CGContextFillRect(context, self.bounds);
Hope this helps
I have paint app. When i click button it launch paint view than user can paint. After i come back then click button the paintview won't reset. How can i reset a view in button click after draw pain.
code:
- (BOOL) initContext:(CGSize)size {
int bitmapByteCount;
int bitmapBytesPerRow;
// Declare the number of bytes per row. Each pixel in the bitmap in this
// example is represented by 4 bytes; 8 bits each of red, green, blue, and
// alpha.
bitmapBytesPerRow = (size.width * 4);
bitmapByteCount = (bitmapBytesPerRow * size.height);
// Allocate memory for image data. This is the destination in memory
// where any drawing to the bitmap context will be rendered.
cacheBitmap = malloc( bitmapByteCount );
if (cacheBitmap == NULL){
return NO;
}
cacheContext = CGBitmapContextCreate (cacheBitmap, size.width, size.height, 8, bitmapBytesPerRow, CGColorSpaceCreateDeviceRGB(), kCGImageAlphaNoneSkipFirst);
return YES;
}
- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];
[self drawToCache:touch];
[self setNeedsDisplay];
}
- (void) drawToCache:(UITouch*)touch {
hue += 0.005;
if(hue > 1.0) hue = 0.0;
UIColor *color = [UIColor colorWithHue:hue saturation:0.7 brightness:1.0 alpha:1.0];
CGContextSetStrokeColorWithColor(cacheContext, [color CGColor]);
CGContextSetLineCap(cacheContext, kCGLineCapRound);
CGContextSetLineWidth(cacheContext, 15);
CGPoint lastPoint = [touch previousLocationInView:self];
CGPoint newPoint = [touch locationInView:self];
CGContextMoveToPoint(cacheContext, lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(cacheContext, newPoint.x, newPoint.y);
CGContextStrokePath(cacheContext);
CGRect dirtyPoint1 = CGRectMake(lastPoint.x-10, lastPoint.y-10, 20, 20);
CGRect dirtyPoint2 = CGRectMake(newPoint.x-10, newPoint.y-10, 20, 20);
[self setNeedsDisplayInRect:CGRectUnion(dirtyPoint1, dirtyPoint2)];
}
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
// Drawing code
CGContextRef context = UIGraphicsGetCurrentContext();
CGImageRef cacheImage = CGBitmapContextCreateImage(cacheContext);
CGContextDrawImage(context, self.bounds, cacheImage);
CGImageRelease(cacheImage);
}
In viewcontroller code:
PaintView *paint = [[PaintView alloc] initWithFrame:self.view.bounds];
[self.view addSubview:paint];
[paint release];
in touches moved,,,
make a toggle for eraser and change the code as follows.
if(togleEraser == NO)
{
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 2.0);
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 0.0, 0.0, 0.0, 1.0);
CGContextBeginPath(UIGraphicsGetCurrentContext());
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y);
}
else
{
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 20);
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1, 0, 0, 10);
CGContextBeginPath(UIGraphicsGetCurrentContext());
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
CGContextClearRect (UIGraphicsGetCurrentContext(), CGRectMake(lastPoint.x, lastPoint.y, 50, 50));
}
I am trying to create a path, then immediately retrieve it and modify it. The problem is that the path gets created and displayed correctly but then I am unable to retrieve it and modify it further.
UPDATE: The problem is that when I call CGContextClosePath in the second function the compiler returns this error:
: CGContextClosePath: no current point.
It basically does not "recognise" the old path and therefore it cannot close it. Any advice would be highly appreciated! Thanks!
Here is my code:
//Defined at the very beginning outside the functions
CGMutablePathRef _path;
//First function
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self];
UIGraphicsBeginImageContext(self.frame.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[drawImage.image drawInRect:CGRectMake(0, 0, drawImage.frame.size.width, drawImage.frame.size.height)];
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), BrushSize);
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 1.0, 1.0, 1.0);
_path = CGPathCreateMutable();
CGContextAddPath (context, _path);
CGContextMoveToPoint(context, lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(context, currentPoint.x, currentPoint.y);
CGContextStrokePath(context);
drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
//Second function
UIGraphicsBeginImageContext(self.frame.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[drawImage.image drawInRect:CGRectMake(0, 0, drawImage.frame.size.width, drawImage.frame.size.height)];
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); //kCGLineCapSquare, kCGLineCapButt, kCGLineCapRound
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), BrushSize); //1.0); // Brush size
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 0.0, 0.0, 1.0);
CGContextSetRGBFillColor(context, 1.0, 0.4, 1.0, 1.0);
CGPathRef pathFill = CGPathCreateCopy (_path);
CGContextAddPath (context, pathFill);
CGContextClosePath(context);
CGContextFillPath(context);
drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
Try adding the path to the context again before you stroke it.
CGContextAddPath (UIGraphicsGetCurrentContext(), _path);
CGContextStrokePath(UIGraphicsGetCurrentContext());
drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
It that doesn't work, try creating a copy of the original path and add a new line to that instead of trying to use the original. Use:
CGPathCreateCopy
Actually i got few samples for drawing image through free hand and i integrated as well in my application.I need additional functionalities such as undo/redo.How can i achieve this?Need help on this..I used following code.
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
mouseSwiped = YES;
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self.view];
currentPoint.y -= 20;
UIGraphicsBeginImageContext(self.view.frame.size);
[drawImage.image drawInRect:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound);
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 10.0);
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), 1.0, 0.0, 0.0, 1.0);
CGContextBeginPath(UIGraphicsGetCurrentContext());
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), currentPoint.x, currentPoint.y);
CGContextStrokePath(UIGraphicsGetCurrentContext());
drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
lastPoint = currentPoint;
mouseMoved++;
if (mouseMoved == 10) {
mouseMoved = 0;
}
}
CGMutablePathRef path;
path = CGPathCreateMutable();
- (void)drawRect:(CGRect)rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGPathMoveToPoint(path, NULL, previousPoint.x, previousPoint.y);
CGPathAddLineToPoint(path, NULL, lastPoint.x, lastPoint.y);
CGContextAddPath(context, path);
CGContextSetLineWidth(context, 10.0);
[[UIColor greenColor] setStroke];
CGContextDrawPath(context,kCGPathFillStroke);
}
Now you can perform Undo/Redo by path's index.
You can try storing all paths in an array.
When you draw a new one, add it last and draw it, when you delete - remove the last and redraw all. Keep removed in another array so you can redo actions, clear the redo array when a new path is added to the paths array.
That's the most straight-forward method I can think of.
I already tried kCGBlendModeXOR but it turn black after the transparency.
Here my code that i done , but it not what I want.
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self.view];
CGPoint lastPoint = [touch locationInView: [UIApplication sharedApplication].keyWindow];
UIGraphicsBeginImageContext(self.view.frame.size);
CGRect rect = CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height);
[imageView_skype.image drawInRect:rect];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, 36.0);
CGContextSetRGBStrokeColor(context, 1.0, 1.0, 1.0, 1.0);
CGContextSetAlpha(context,0.10);
CGContextSetBlendMode(context, kCGBlendModeXOR);
CGContextBeginPath(context);
CGContextMoveToPoint(context, lastPoint.x, lastPoint.y);
CGContextAddLineToPoint(context, currentPoint.x, currentPoint.y);
CGContextStrokePath(context);
imageView_skype.image = UIGraphicsGetImageFromCurrentImageContext();
your can use mask to do this
http://developer.apple.com/library/ios/#documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_images/dq_images.html
in your touches moved event draw a mask image only black and white
and mask your original image