如何使Sprite遵循贝塞尔曲线

时间:2015-02-05 10:49:41

标签: sprite-kit bezier 2d-games

我对objective-c和sprite kit相当新,但我已经做了一段时间的游戏开发。我目前正在进行2D游戏,我的敌人船只在屏幕上从右向左移动。我一直在关注我游戏的不同部分的教程,然后在必要时添加它。我找到了一个教程,其中游戏中的敌人遵循更好的路径,并且我已经设法在我的游戏中实现这一点,但是因为我对bezier曲线不熟悉我不完全理解它们并且算法使我的精灵移动从上到下但我需要它们从左到右。

我已经包含了我用来将贝塞尔曲线添加到我的精灵的代码片段,以及如何让它们从右到左而不是从上到下移动的任何建议。

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

感谢您提供任何帮助和建议。

1 个答案:

答案 0 :(得分:7)

贝塞尔曲线用于在两点之间生成平滑曲线。 要从左向右移动路径,请选择左侧的起点并选择右侧的终点。两个控制点确定从左到右采取的路径的形状。改变以下代码中的startpointendpoint将控制贝塞尔曲线的开始位置和结束位置。改变control points会改变曲线的形状。您可以通过附加的GIF查看。

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

enter image description here

P0P3是起点和终点,P1P2是控制点。

查看此页面,了解贝塞尔曲线的更多信息。 http://www.jasondavies.com/animated-bezier/