Sprite가 bezier curve를 따르는 방법

Question

Im 객관적인 -c와 sprite kit에 상당히 새로운 것이지만 나는 잠시 동안 게임 개발을 해왔다. 현재 2 차원 게임을하고있는 Im은 적의 함선을 화면의 오른쪽에서 왼쪽으로 움직이게합니다. 필자의 게임의 여러 부분에 대한 자습서를 읽고 필 요한 곳에서 추가했습니다. 나는 게임 적들이 베 지어 경로를 따르고 게임에서 이것을 구현할 수있는 튜토리얼을 발견했다. 그러나 베 지어 곡선을 처음 접했을 때 나는 그것을 완전히 이해하지 못했고 알고리즘은 내 스프라이트를 위에서 아래로 이동시킨다. 하지만 나는 그들에게 왼쪽에서 오른쪽으로 갈 필요가있다.

필자는 스프라이트에 베 지어 곡선을 추가하는 데 사용한 코드 단편을 포함시켜 위에서 아래로가 아니라 오른쪽에서 왼쪽으로 이동할 수있는 방법에 대한 제안을했습니다.

CGMutablePathRef cgpath = CGPathCreateMutable(); 

     float xStart = [self getRandomNumberBetween:0+asteroid.size.width to:self.frame.size.width-asteroid.size.width]; 
     float xEnd = [self getRandomNumberBetween:0+asteroid.size.width to:self.frame.size.width-asteroid.size.width]; 
     float cp1X =[self getRandomNumberBetween:0+asteroid.size.width to:self.frame.size.width-asteroid.size.width]; 
     float cp1y = [self getRandomNumberBetween:0+asteroid.size.width to:self.frame.size.width-asteroid.size.height]; 
     float cp2x = [self getRandomNumberBetween:0+asteroid.size.width to:self.frame.size.width-asteroid.size.width]; 
     float cp2Y = [self getRandomNumberBetween:0 to:cp1y]; 

     CGPoint s = CGPointMake(xStart, 1024.0); 
     CGPoint e = CGPointMake(xEnd, -100); 
     CGPoint cp1 = CGPointMake(cp1X, cp1y); 
     CGPoint cp2 = CGPointMake(cp2x, cp2Y); 
     CGPathMoveToPoint(cgpath, NULL, s.x, s.y); 
     CGPathAddCurveToPoint(cgpath, NULL, cp1.x, cp1.y, cp2.x, cp2.y, e.x, e.y); 

     SKAction *enemyCurve = [SKAction followPath:cgpath asOffset:NO orientToPath:YES duration:5]; 

    CGPoint location = CGPointMake(-self.frame.size.width-asteroid.size.width, randY); 

     SKAction *moveAction = [SKAction moveTo:location duration:randDuration]; 
     SKAction *doneAction = [SKAction runBlock:(dispatch_block_t)^(){ 

      asteroid.hidden = YES; 
     }]; 

     SKAction *moveAsteroidActionWithDone = [SKAction sequence:@[enemyCurve,moveAction, doneAction]]; 

도움을 주셔서 감사합니다.

Answer 1

베 지어 곡선은 두 점 사이에서 부드러운 곡선을 생성하는 데 사용됩니다. 경로를 왼쪽에서 오른쪽으로 이동하려면 왼쪽에서 시작점을 선택하고 오른쪽에서 끝점을 선택하십시오. 두 개의 제어점은 경로의 모양을 왼쪽에서 오른쪽으로 결정합니다. 다음 코드에서 startpoint 및 endpoint을 변경하면 베 지어 곡선이 시작되는 위치와 끝나는 위치를 제어 할 수 있습니다. control points을 변경하면 커브의 모양이 달라집니다. 첨부 된 GIF로 볼 수 있습니다.

P0 및 P3

CGMutablePathRef cgpath = CGPathCreateMutable(); 

CGPoint startingPoint = CGPointMake(50, 100); 

CGPoint controlPoint1 = CGPointMake(160, 250); 
CGPoint controlPoint2 = CGPointMake(200, 140); 

CGPoint endingPoint = CGPointMake(303, 100); 


CGPathMoveToPoint(cgpath, NULL, startingPoint.x, startingPoint.y); 
CGPathAddCurveToPoint(cgpath, NULL, controlPoint1.x, controlPoint1.y, 
         controlPoint2.x, controlPoint2.y, 
         endingPoint.x, endingPoint.y); 


SKAction *enemyCurve = [SKAction followPath:cgpath asOffset:NO orientToPath:YES duration:5]; 

[enemy runAction:[SKAction sequence:@[[SKAction waitForDuration:1],enemyCurve]]]; 

은 시작과 끝 지점과 P1 및 P2 컨트롤 포인트입니다 있습니다.

베 지어 곡선으로 더 많은 것을 재생하려면이 페이지를 확인하십시오. http://www.jasondavies.com/animated-bezier/