How do I draw a line using Cocos2D-X?

Question

I have been playing around with Cocos2D-X on my computer, and I have got it to build the hello world program on all the devices I would like to be able to build it on.

I know how to make the program display a sprite, and display a label, but I have not been able just to get the program to draw a line. How can I draw a line in Cocos2D-X?

Overshoot

Answer 1

use void ccDrawLine(const CCPoint& origin, const CCPoint& destination) function declared in CCDrawingPrimitives.h

Edit

I've never tried using primitives myself. But as I know everything in cocos2d is rendered vis CCNode or it's subclass. So you must put your code inside draw method of some CCNode or it's subclass.

Truc

I've included CCDrawingPrimitives.h, and written ccDrawLine(CCPoint(0.3f, 0.3f), CCPoint(77.7f, 77.7f)); into my code, but I see no visual difference when I run the application. Am I missing something obvious? – Overshoot

By the way. I faced with the following problem. I've wrote: this->colorLayer->initWithColor( ccc4( 100, 100, 100, 255 ) ) so I didn't see anything drown with ccDrawLine because of Z-order. Then I just changed it to: this->colorLayer->init(); and now all shows fine :) – Tonneson

Answer 2

You must use ccDrawLine function in draw()

Example

void GameLayer::draw()
{
    //red line from bottom left to top right corner
    cocos2d::ccDrawColor4F(1.0f, 0.0f, 0.0f, 1.0f);
    cocos2d::ccDrawLine(ccp(0,0), ccp(100, 100));
}

And remember layer must be empty because it call first draw next it will draw children so if you have children it will overlap what you draw.

Z order :)

So in your code you have class

class MyLayer : public CCLayer
{
    ... //your code
    init()
    {
         CCLayer* pLayer = new GameLayer(); //It will be debug layer :)
     addChild(pLayer);//Alse you can set here Z order.
     pLayer->release();
    }
    virtual void draw()
    {
         //red line from bottom left to top right corner
         ccDrawColor4F(1.0f, 0.0f, 0.0f, 1.0f);
         ccDrawLine(ccp(0,0), ccp(100, 100));
    }
}

Above code will draw what you want.

Immix

If my Layer is not empty,I cannot draw. – Byplay

You can but probably you will draw under your children. Change z-order of children. Or override visit and draw on the end – Immix

Thanks a lot. But I am a little confused about multi-layers. – Byplay

The draw() method has been changed in the latest version. See #23557533 – Brennabrennan

Answer 3

I have found another easy way to draw line in CCLayer. Cocos2d-x has a class named CCDrawNode. You can check reference here. And it is very easy to use the function:

void drawSegment(const CCPoint & from,
    const CCPoint & to,
    float   radius,
    const ccColor4F & color 
)

Little example:

CCDrawNode* node = CCDrawNode::create();
addChild(node,10);//Make sure your z-order is large enough
node->drawSegment(fromPoint,toPoint,5.0,ccc4f(180,180,180,100));

Byplay

Answer 4

auto node = DrawNode::create();
node->drawLine(Vec2(200, 200), Vec2(200, 500), Color4F(1.0, 1.0, 1.0, 1.0));
this->addChild(node);

Dotted

Answer 5

In cocos2d-x 3.0 alpha you can use

DrawPrimitives::drawLine(const cocos2d::Point &origin, const cocos2d::Point &destination);

Brusque

You can, and should use cocos2d-x 3.x, IMHO, but DrawPrimitives::drawLine(const cocos2d::Point &origin, const cocos2d::Point &destination); isn't working OOTB. See https://mcmap.net/q/910536/-cocos2d-x-3-0-draw-vs-ondraw – Zebec