Cocos2d 和 iOS:无法理解使用 ccBezierConfig 控制点的使用 [英] Cocos2d and iOS: Can't understand use of control points using ccBezierConfig

问题描述

如果问题写得不好，请观看视频 (3)，链接与本页底部.

If the question is badly written have a look at the video (3), same link as in the bottom of this page.

我正在尝试使用 ccBezierConfig 和 Cocos2D 绘制一个非常简单的贝塞尔曲线.在维基百科上阅读我试图了解一点控制点并找到了这张图片:

I am trying to draw a very simple bezier curve using ccBezierConfig and Cocos2D. Reading on Wikipedia I tried to understand a bit controls points and found this image:

http://upload.wikimedia.org/wikipedia/commons/thumb/b/bf/Bezier_2_big.png/240px-Bezier_2_big.png

如果您查看我从中获取图像的维基百科页面，就会发现一个很酷的动画.看看这里.

If you look on the wikipedia page from which I took the image there is a cool animation. Have a look here.

这是我使用的代码:

        CCSprite *r = [CCSprite spriteWithFile:@"hi.png"];
        r.anchorPoint = CGPointMake(0.5f, 0.5f);
        r.position = CGPointMake(0.0f, 200.0f);

        ccBezierConfig bezier;
        bezier.controlPoint_1 = CGPointMake(0.0f, 200.0f);
        bezier.controlPoint_1 = CGPointMake(180.0f, 330.0f);
        bezier.endPosition = CGPointMake(320.0f,200.0f);

        id bezierForward = [CCBezierBy actionWithDuration:1 bezier:bezier];
        [r runAction:bezierForward];
        [self addChild:r z:0 tag:77];

应用程序在纵向模式下运行，我的推测与 1 而我的代码中的那些是:

The app runs on Portrait mode and my speculation matching the control points of 1 and the ones in my code was that:

sprite.position should correspond to P0
bezier.controlPoint_1 should correspond to P0 
bezier.controlPoint_2 should correspond to P1
bezier.endPosition  should correspond to P2

我确实尝试了两种方法.通过设置精灵的位置和不设置它.

I did try two approaches. By setting the position of the sprite and by not setting it.

我假设位置应该与维基百科架构中的 controlPoint_1 相同 1 只有三点.

I assumed that position should be the same as controlPoint_1 as in the wikipedia schema 1 there are only three points.

我得到了一个我不太明白的输出.我制作了一个小视频，是一个私人 youtube 视频:

点击此处观看视频

推荐答案

好吧，答案比较简单……

OK, the answer is rather simple...

二次贝塞尔曲线是不是cocos2d画的.相反，请检查 三次贝塞尔曲线.这才是你应该关注的.

The quadratic Bézier curve is not the one drawn by cocos2d. Instead, check the same wiki page for cubic Bézier curve. That's what you should be looking at.

1. 初始位置是精灵的位置 (P0)
2. 控制点 1 和2 是 P1 &分别为 P2.
3. 终点就是终点.

不错的视频，顺便说一句，我很喜欢 xD.

Nice video, btw, I enjoyed it xD.

来自cocos2d库中CCActionInterval.h文件的证据:

Evidence from the CCActionInterval.h file in the cocos2d library:

/** An action that moves the target with a cubic Bezier curve by a certain distance.
 */
@interface CCBezierBy : CCActionInterval <NSCopying>
{
    ccBezierConfig config;
    CGPoint startPosition;
}

---

这个链接应该可以帮助你构建你的三次贝塞尔曲线在视觉上，而不是调整值并运行应用程序.

---

This link should help you construct your cubic Bézier curves visually, instead of tweaking the values and running the app.

这篇关于Cocos2d 和 iOS:无法理解使用 ccBezierConfig 控制点的使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！