【问题标题】:Draw smooth Bezier curve with cocos2d-x用 cocos2d-x 绘制平滑的贝塞尔曲线
【发布时间】:2014-05-01 14:46:16
【问题描述】:

可能与此question 重复, 但我不知道如何在我的应用程序中应用这种方法,以及我应该在 cocos2d-x 中使用哪种方法来绘制贝塞尔曲线。我的应用程序应该允许用户在触摸画布时绘制线条和曲线。我怎样才能做到这一点?

【问题讨论】:

    标签: c++ cocos2d-x cocos2d-x-3.0


    【解决方案1】:

    从 Cocos2dx v3.3 开始,您可以使用 DrawNode 绘制贝塞尔曲线。检查 DrawPrimitivesTest.cpp,它很容易使用。 这只是从上述文件中提取的示例脚本。您可以在场景中的任何位置使用它:

    auto draw = DrawNode::create();
    addChild(draw, 10);
    
    auto s = Director::getInstance()->getWinSize();
    draw->drawQuadBezier(Vec2(0, s.height), Vec2(s.width/2, s.height/2), Vec2(s.width, s.height), 50, Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), 0.5));  
    draw->drawCubicBezier(VisibleRect::center(), Vec2(VisibleRect::center().x+30,VisibleRect::center().y+50), Vec2(VisibleRect::center().x+60,VisibleRect::center().y-50),VisibleRect::right(),100, Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), 0.5));
    

    【讨论】:

      【解决方案2】:

      在 CCDrawPrimitives.cpp 文件中。

      你可以使用这个方法。

      ccDrawCubicBezier
      ccDrawQuadBezier

      -MyClass::draw() {
          glLineWidth(4.0f);
          ccPointSize(4);
      
          //Draw a blue quadratic bezier curve
          ccDrawColor4B(0, 0, 255, 255);
          ccDrawQuadBezier(ccp(90,0), ccp(200, 70), ccp(350,0), 12);
      
          //Draw cubic red bezier curve
          ccDrawColor4B(255, 0, 0, 255);
          ccDrawCubicBezier(ccp(100,100), ccp(300,150), ccp(250,50), ccp(350,100), 12);
      
          //Restore original values
          glLineWidth(1);
          ccDrawColor4B(255,255,255,255);
          ccPointSize(1);
      }
      

      您可能知道,每次移动触摸位置时,都会调用 ccTouchesMoved 方法。
      您可以使用方法和成员变量来控制曲线形状。

      【讨论】:

      • 谢谢,但是有没有任何选项可以将点数组传递给这个方法?因为我需要按点数组存储和重绘曲线。另一个,我在文档cocos2d-x.org/reference/native-cpp/V2.2.3/d6/da4/… 中看到了这个警告:Warning This function could be pretty slow. Use it only for debugging purposes. 我需要担心这个警告吗?
      • 请检查 CCDdrawprimitives.cpp 中的函数 'ccDrawQuadBezier'。所有细节都在里面。复制并制作您的版本。而且 glDrawArrays 函数的性能我认为并没有那么糟糕。如果您有疑问,请对其进行分析。
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2022-09-27
      • 1970-01-01
      • 1970-01-01
      • 2011-02-26
      • 2017-05-18
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多