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?

Solution 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.

Solution 2

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

Solution 3

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.

Solution 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);

Solution 5

In cocos2d-x 3.0 alpha you can use

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

View more solutions

Comments

[Jon]

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?

[JavaRunner]

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 :)

[einverne]

If my Layer is not empty,I cannot draw.

[Gelldur]

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

[einverne]

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

[John]

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 stackoverflow.com/a/22724319/866333

[DLight]

The draw() method has been changed in the latest version. See stackoverflow.com/questions/23557033/…