Question

我以前在图像上绘制的代码如下所示，我使用 panGesture 来查找用户触摸的位置。现在，当我使用此代码时，当我快速移动图像时，用户绘制的线条将作为点。

UIGraphicsBeginImageContextWithOptions((self.thatsMyImage.frame.size), NO, 0.0);
    [self.selfieImage.image drawInRect:CGRectMake(0,0,self.thatsMyImage.frame.size.width, self.thatsMyImage.frame.size.height)];
[[UIColor whiteColor] set];
CGContextMoveToPoint(UIGraphicsGetCurrentContext(), from.x, from.y);
CGContextAddLineToPoint(UIGraphicsGetCurrentContext(), to.x , to.y);
CGContextSetLineWidth(UIGraphicsGetCurrentContext(), 10.0f);
CGContextStrokeEllipseInRect(UIGraphicsGetCurrentContext(), CGRectMake(to.x, to.y,10,10));

CGContextSetFillColor(UIGraphicsGetCurrentContext(), CGColorGetComponents([[UIColor blueColor] CGColor]));
CGContextFillPath(UIGraphicsGetCurrentContext());

CGContextStrokePath(UIGraphicsGetCurrentContext());

self.thatsMyImage.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

这是检测到panGesture时调用的方法。

-(void)freeFormDrawing:(UIPanGestureRecognizer *)gesture
{
if(gesture.state == UIGestureRecognizerStateChanged)
{
    CGPoint p = [gesture locationInView:self.selfieImage];
    CGPoint startPoint = lastPoint;
    lastPoint = [gesture locationInView:self.selfieImage];

    [self drawLineFrom:startPoint endPoint:p];

}
if(gesture.state == UIGestureRecognizerStateEnded)
{
//        lastPoint = [gesture locationInView:self.selfieImage];
    }
}

有人可以告诉我如何在线条和曲线流畅的图像上进行自由形式（涂鸦）？提前致谢和Happy Coding！

Answer 1

我实现了与原来相同的功能，即我在UIImageView上面添加了一个透明的UIImageView，它有我想要绘制的UIImage。

UIImageView *drawableView = [[UIImageView alloc]initWithFrame:self.drawImageView.bounds];
drawableView.userInteractionEnabled = YES;
UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(drawingViewDidPan:)];
[drawableView addGestureRecognizer:panGesture];

然后当用户在UIImageView上进行平移时，我会调用此函数

- (void)drawingViewDidPan:(UIPanGestureRecognizer*)sender
{
  CGPoint currentDraggingPosition = [sender locationInView:drawableView];

  if(sender.state == UIGestureRecognizerStateBegan) {
      prevDraggingPosition = currentDraggingPosition;
  }

  if(sender.state != UIGestureRecognizerStateEnded){
      [self drawLine:prevDraggingPosition to:currentDraggingPosition];
  }
  prevDraggingPosition = currentDraggingPosition;
}

prevDraggingPosition和currentDraggingPosition都是CGPoint。

然后我使用以下函数从prevDraggingPosition到currentDraggingPosition画线

-(void)drawLine:(CGPoint)from to:(CGPoint)to
{
  @autoreleasepool {

    CGSize size = drawableView.frame.size;
    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);

    CGContextRef context = UIGraphicsGetCurrentContext();

    [drawableView.image drawAtPoint:CGPointZero];

    CGFloat strokeWidth = 4.0;
    strokeColor = colorChangeView.backgroundColor;

    CGContextSetLineWidth(context, strokeWidth);
    CGContextSetStrokeColorWithColor(context, strokeColor.CGColor);
    CGContextSetLineCap(context, kCGLineCapRound);


    CGContextMoveToPoint(context, from.x, from.y);
    CGContextAddLineToPoint(context, to.x, to.y);
    CGContextStrokePath(context);

    drawableView.image = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();
  }
}

然后最终获得带有绘图的图像，您可以通过将drawableView图像绘制到具有这样图像的UIImageView上来构建图像。

- (UIImage*)buildImage
{
  @autoreleasepool {

    UIGraphicsBeginImageContextWithOptions(originalImageSize, NO, self.drawImageView.image.scale);

    [self.drawImageView.image drawAtPoint:CGPointZero];
    [drawableView.image drawInRect:CGRectMake(0,0, originalImageSize.width, originalImageSize.height)];

    UIImage *tmp = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    return tmp;
  }
}

其中originalImageSize是图像的大小。

希望这有帮助！

我无法使用PAN GESTURE在另一个图像上绘制连续线条

1 个答案: