沿iOS中的路径均匀分布图像

Question

我想做的是将手指移过屏幕(touchesMoved)并沿着touchesMoved生成的点绘制均匀间隔的图像(可能是CGImageRefs).我可以绘制线条,但我想要生成的东西看起来像这样(对于这个例子我使用箭头的图像,但它可能是任何图像,可能是我的狗的照片:))主要的是用手指在iPhone或iPad上绘图时,使图像均匀分布.

Answer 1

首先,巨大的道具前往肯德尔.因此,根据他的回答,这里是获取UIImage的代码,根据触摸之间的距离,然后旋转图像,沿着路径(不是真正的pathRef,只是由点创建的逻辑路径)在屏幕上绘制它正确地基于当前和先前点的VECTOR.我希望你喜欢它:

首先,您需要一遍又一遍地加载要用作CGImage的图像:

NSString *imagePath = [[NSBundle mainBundle] pathForResource:@"arrow.png" ofType:nil];
  UIImage *img = [UIImage imageWithContentsOfFile:imagePath];
  image = CGImageRetain(img.CGImage);

确保你打电话给你的dealloc

 CGImageRelease(image);

然后在touchesBegan中,只将起点存储在方法外的范围内的var中(在此标题中声明它:)在这种情况下我将绘制成一个UIView

@interface myView : UIView {
    CGPoint lastPoint;
    }
@end

然后接触开始:

-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

{

UITouch *touch = [touches anyObject];
lastPoint = [touch locationInView:self];

}

最后在touchesMoved中,将位图绘制到屏幕上,然后当你的距离移动得足够时(在我的情况下为73,因为我的图像是73像素x 73像素)将该图像绘制到屏幕上,保存新图像并设置lastPoint相等到currentPoint

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

        UITouch *touch = [touches anyObject];   
        currentPoint = [touch locationInView:self];

        double deltaX = lastPoint.x - currentPoint.x;
        double deltaY = lastPoint.y - currentPoint.y;

        double powX = pow(deltaX,2);
        double powY = pow(deltaY,2);

        double distance = sqrt(powX + powY);
        if (distance >= 73){

            lastPoint = currentPoint;

             UIGraphicsBeginImageContext(self.frame.size);
            [drawImage.image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
            CGContextSaveGState(UIGraphicsGetCurrentContext());

            float angle = atan2(deltaX, deltaY);
            angle *= (M_PI / 180);


            CGContextDrawImage(UIGraphicsGetCurrentContext(), CGRectMake(currentPoint.x, currentPoint.y, 73, 73),[self CGImageRotatedByAngle:image angle:angle * -1]);
            CGContextRestoreGState(UIGraphicsGetCurrentContext());
             drawImage.image = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();
            distance = 0;

        }

    }


    - (CGImageRef)CGImageRotatedByAngle:(CGImageRef)imgRef angle:(CGFloat)angle
{
    CGFloat angleInRadians = angle * (M_PI / 180);
    CGFloat width = CGImageGetWidth(imgRef);
    CGFloat height = CGImageGetHeight(imgRef);

    CGRect imgRect = CGRectMake(0, 0, width, height);
    CGAffineTransform transform = CGAffineTransformMakeRotation(angleInRadians);
    CGRect rotatedRect = CGRectApplyAffineTransform(imgRect, transform);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef bmContext = CGBitmapContextCreate(NULL,
                                                   rotatedRect.size.width,
                                                   rotatedRect.size.height,
                                                   8,
                                                   0,
                                                   colorSpace,
                                                   kCGImageAlphaPremultipliedFirst);
    CGContextSetAllowsAntialiasing(bmContext, FALSE);
    CGContextSetInterpolationQuality(bmContext, kCGInterpolationNone);
    CGColorSpaceRelease(colorSpace);
    CGContextTranslateCTM(bmContext,
                          +(rotatedRect.size.width/2),
                          +(rotatedRect.size.height/2));
    CGContextRotateCTM(bmContext, angleInRadians);
    CGContextTranslateCTM(bmContext,
                          -(rotatedRect.size.width/2),
                          -(rotatedRect.size.height/2));
    CGContextDrawImage(bmContext, CGRectMake(0, 0,
                                             rotatedRect.size.width,
                                             rotatedRect.size.height),
                       imgRef);

    CGImageRef rotatedImage = CGBitmapContextCreateImage(bmContext);
    CFRelease(bmContext);
    [(id)rotatedImage autorelease];

    return rotatedImage;
}

这将创建一个如下所示的图像:

要添加以下内容(对上面的代码进行一些更改,以便尝试填充当快速移动时touchesMoved缺少某些点时出现的空白:

CGPoint point1 = CGPointMake(100, 200);

CGPoint point2 = CGPointMake(300, 100);



double deltaX = point2.x - point1.x;
double deltaY = point2.y - point1.y;

double powX = pow(deltaX,2);
double powY = pow(deltaY,2);

double distance = sqrt(powX + powY);

distance = 0;


for (int j = 1; j * 73 < distance; j++ )
{
    double x =  (point1.x + ((deltaX / distance) * 73 * j));
    double y =  (point1.y + ((deltaY / distance) * 73 * j));


    NSLog(@"My new point is x: %f y :%f", x, y);
}

Answer 2

假设您已经有了跟踪用户在屏幕上移动触摸时的触摸的代码，听起来您想要检测他们何时移动了等于图像长度的距离，此时您想要绘制另一个副本在他们的触摸下您的形象。

为了实现这一目标，我认为您需要：

• 计算图像的长度（宽度）
• 实现代码以将图像的副本绘制到视图上，并旋转到任意角度
• 每次用户的触摸移动时（例如在touchesMoved:中）：
  • 计算每次移动时触摸的增量并生成该增量的“长度”（例如 sqrt(dx^2 + dy^2) 之类的东西）
  • 累计自上次绘制图像以来的距离
  • 如果距离达到了图像的长度，则在触摸的当前位置下绘制图像的副本，并适当旋转（可能根据从最后一个图像的位置到当前位置的向量）

听上去怎么样？