在iOS中沿着路徑均勻地繪製圖像

Question

我想要做的是將手指在屏幕上移動（touchesMoved）並沿touchesMoved生成的點繪製均勻間隔的圖像（可能是CGImageRefs）。我可以畫線，但我想要生成的東西看起來像這樣（對於這個例子，我使用的是一個箭頭的圖像，但它可能是任何圖像，可能是我的狗的圖片:)）主要的是當用iPhone或iPad上的手指進行繪圖時，圖像均勻分佈。

Answer 1

假設您已有追蹤用戶的觸摸，因爲他們把他們的觸摸屏幕上的代碼，這聽起來像你想，當他們搬到等於圖像的長度的距離來檢測，此時你想在他們的觸摸下繪製另一個圖像副本。

要做到這一點，我想你將需要：

• 計算圖像的長度（寬度）
• 執行代碼來繪製圖像的拷貝到您的視圖，旋轉到任何角度
每次用戶的觸摸移動時（例如在touchesMoved :)中：
• 每次移動觸摸時計算觸摸的增量，並生成該增量的「長度」（例如像sqrt（dx^2 + dy^2））
• 累積距上一幅圖像的距離
• 如果距離已達到圖像的長度，請在觸摸的當前位置下繪製圖像的副本，並進行適當旋轉（可能根據從最後一個圖像到當前位置）

你覺得如何？

Answer 2

首先是巨大的道具出去肯德爾。所以，根據他的回答，這裏是取UIImage的代碼，根據觸摸之間的距離在屏幕上沿着路徑繪製它（不是真實的路徑參考，只是由點創建的邏輯路徑），然後旋轉圖像正確地基於當前點和前一點的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中

然後在觸摸開始：

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