如何摆脱这种“点”当我画画时,我的线条之间? [英] How to get rid of this "points" between my lines when I am drawing?

查看:179
本文介绍了如何摆脱这种“点”当我画画时,我的线条之间?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有没有一种简单的方法可以不在我的线条中绘制这些点?

我不知道为什么这些点存在,因为我在绘制线条时从不将手指从屏幕上释放。

is there an easy way to not draw this points in my lines?
I don't know why this points are there because i never release my finger from screen during drawing of a line.

I得到了绘图示例中的代码。

I got the code from a drawing example.

// 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,颜色的最终版本,每行的brushSize:

This is the final version with unique alpha, color, brushSize for every line:

- (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];
}


推荐答案

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

The problem is that you are gradually accumulating the line by drawing into an image. Where the old line and the new line overlap, you see "dots" from the overdraw.

解决办法是在路径中累积你的点并重新绘制图像使用那条路的时间。由于您将绘制单个路径,而不是多个重叠路径,因此您不应该看到这些点。

The solution is to accumulate your points in a path and draw the image afresh each time using that path. Since you will be drawing a single path, not multiple overlapping paths, you shouldn't see the dots.

代码大纲:


  • 在绘图开始前的一段时间,创建一个 CGMutablePathRef

  • 当你得到要添加到行中的新点,请使用 CGPathAddLineToPoint

  • 在绘制路径时,请使用 CGContextAddPath 将行添加到上下文中,然后根据需要填充或描边。您还可以使用 CGContextDrawPath

  • Some time before drawing begins, create a CGMutablePathRef.
  • When you get a new point you want to add to your line, use CGPathAddLineToPoint.
  • When it's time to draw the path, use CGContextAddPath to add the line to the context, then fill or stroke as desired. You could also use CGContextDrawPath.

或者,您可以使用 UIBezierPath 而不是 CGMutablePathRef ,在这种情况下,步骤是:

Alternatively, you can use UIBezierPath instead of CGMutablePathRef, in which case the steps are:


  • 创建 UIBezierPath

  • 使用 -addLineToPoint:在路径中添加行。

  • 使用 -stroke -fill ,类似于将路径绘制到上下文中。

  • Create a UIBezierPath.
  • Use -addLineToPoint: to add lines to the path.
  • Use -stroke, -fill, and similar to draw the path into the context.

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

This is likely to be simpler if you are not accustomed to working with CoreGraphics directly.

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

I would drop the intermediate image and move this code into a view class (LineDrawView or CanvasView or something) rather than leaving the code in a view controller. Instead of updating an image, the view can just draw itself directly to the screene. The view would have methods to clear the path, undo strokes, and create an image of the path. The view controller would then use these to clear the canvas, undo lines, and save the drawing. You could enrich this later with functionality to configure the line style.

这篇关于如何摆脱这种“点”当我画画时,我的线条之间?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆