当我画画时,如何摆脱我的线条之间的这些“点”?

时间:2011-06-07 08:20:02

标签: iphone xcode cgcontext uitouch

有没有一种简单的方法可以不在我的线条中绘制这些点? 我不知道为什么会出现这一点,因为在绘制线条时我从未将手指从屏幕上松开。 enter image description here

我从绘图示例中获取了代码。

// draw a line
- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {

mouseSwiped = YES;
UITouch *touch = [touches anyObject];   
CGPoint currentPoint = [touch locationInView:self.view];
currentPoint.y -= 0; // 20 only for 'kCGLineCapRound'
UIGraphicsBeginImageContext(self.view.frame.size);
//Albert Renshaw - Apps4Life
[drawImage.image drawInRect:CGRectMake(0, 0, drawImage.frame.size.width, drawImage.frame.size.height)]; //originally self.frame.size.width, self.frame.size.height)];
CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); //kCGLineCapSquare, kCGLineCapButt, kCGLineCapRound
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), brushSize); // for size
CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), r, g, b, alpha); //values for R, G, B, and Alpha
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;
}

    }

    - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {


//Draw a dot
if(!mouseSwiped) {

    UIGraphicsBeginImageContext(self.view.frame.size);
    [drawImage.image drawInRect:CGRectMake(0, 0, drawImage.frame.size.width, drawImage.frame.size.height)]; //originally self.frame.size.width, self.frame.size.height)];
    CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapRound); //kCGLineCapSquare, kCGLineCapButt, kCGLineCapRound
    CGContextSetLineWidth(UIGraphicsGetCurrentContext(), brushSize);
    CGContextSetRGBStrokeColor(UIGraphicsGetCurrentContext(), r, g, b, alpha);
    CGContextMoveToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
    CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), lastPoint.x, lastPoint.y);
    CGContextStrokePath(UIGraphicsGetCurrentContext());
    CGContextFlush(UIGraphicsGetCurrentContext());
    drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
}
    }

这是最终版本,每行都有唯一的alpha,color,brushSize:

- (void) updateDrawingBoard 
{
UIGraphicsBeginImageContext(self.drawImage.bounds.size);

for ( NSDictionary *dict in paths ) {

   UIBezierPath *p = (UIBezierPath*)[dict objectForKey:@"path"];
   p.lineWidth = [[dict objectForKey:@"size"]floatValue];
   [[UIColor colorWithRed:[[dict objectForKey:@"red"]floatValue] 
                     green:[[dict objectForKey:@"green"]floatValue] 
                      blue:[[dict objectForKey:@"blue"]floatValue] 
                     alpha:[[dict objectForKey:@"alpha"]floatValue]] setStroke];
  [p stroke];
}
[[UIColor colorWithRed:r green:g blue:b alpha:alpha] setStroke];
[path stroke];

self.drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
}

- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
CGPoint touchPoint = [[touches anyObject] locationInView:self.drawImage];

path = [[UIBezierPath bezierPath] retain];
path.lineCapStyle = kCGLineCapRound;
path.lineJoinStyle = kCGLineJoinBevel;
path.lineWidth = brushSize;
[path moveToPoint:touchPoint];

[self updateDrawingBoard];
}

- (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
CGPoint touchPoint = [[touches anyObject] locationInView:self.drawImage];

[path addLineToPoint:touchPoint];

NSDictionary   *dict = [NSDictionary dictionaryWithObjectsAndKeys:
                        path,@"path",
                        [NSNumber numberWithFloat:r], @"red", 
                        [NSNumber numberWithFloat:g], @"green", 
                        [NSNumber numberWithFloat:b], @"blue", 
                        [NSNumber numberWithFloat:alpha], @"alpha", 
                        [NSNumber numberWithFloat:brushSize], @"size", nil];
[paths addObject:dict];
[path release];
path = nil;

[self updateDrawingBoard];
}

- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
CGPoint touchPoint = [[touches anyObject] locationInView:self.drawImage];

[path addLineToPoint:touchPoint];

[self updateDrawingBoard];
}

2 个答案:

答案 0 :(得分:6)

问题是你是通过绘制图像逐渐累积线条。旧线和新线重叠的地方,你会看到透支的“点”。

解决方案是在路径中累积您的点,并使用该路径每次重新绘制图像。由于您将绘制单个路径,而不是多个重叠路径,因此您不应该看到这些点。

代码概要:

  • 在绘图开始前的某个时间,创建一个CGMutablePathRef
  • 当您想要添加到新线上时,请使用CGPathAddLineToPoint
  • 在绘制路径时,使用CGContextAddPath将线条添加到上下文中,然后根据需要填充或描边。您也可以使用CGContextDrawPath

或者,您可以使用UIBezierPath代替CGMutablePathRef,在这种情况下,步骤为:

  • 创建UIBezierPath
  • 使用-addLineToPoint:在路径中添加行。
  • 使用-stroke-fill和类似内容将路径绘制到上下文中。

如果您不习惯直接使用CoreGraphics,这可能会更简单。

我会删除中间图像并将此代码移动到视图类(LineDrawViewCanvasView或其他内容)中,而不是将代码保留在视图控制器中。视图可以直接将自己绘制到screene,而不是更新图像。视图将具有清除路径,撤消笔划和创建路径图像的方法。然后视图控制器将使用它们来清除画布,撤消线条并保存图形。您可以稍后通过配置线型的功能来丰富它。

答案 1 :(得分:3)

我一直试图打破这个问题几天,尝试Jeremy W. Sherman的答案,这可能是一个非常好的主意,但对我的实施来说是不可行的。

在我的绘图应用程序中,我不能通过不断渲染路径来使alpha曲线相互融合,尽管点消失了。如果你只想要一条干净的阿尔法色路径,那么这可能就是你要走的路。

但我找到了一个更简单的解决方案;这些调整通过混合实时创建完美的阿尔法色路径(将其视为毡尖笔式):

CGContextSetLineCap(UIGraphicsGetCurrentContext(), kCGLineCapButt);
CGContextSetBlendMode(UIGraphicsGetCurrentContext(), kCGBlendModeMultiply);

希望这可以帮助任何在iOS中进行简单CG绘画的人。