Cocos2d-JS cc.DrawNode用法

app.js

var HelloWorldLayer = cc.Layer.extend({
    sprite:null,
    ctor:function () {
        //////////////////////////////
        // 1. super init first
        this._super();
        //這里輸入測試代碼
        

        return true;
    }
});

var HelloWorldScene = cc.Scene.extend({
    onEnter:function () {
        this._super();
        var layer = new HelloWorldLayer();
        this.addChild(layer);
    }
});

 

 

繪制矩形：drawRect

        //創建draw對象
        var drawNode =new cc.DrawNode();
        //繪制矩形，參數：坐標，大小，填充顏色，邊框大小，邊框顏色
        drawNode.drawRect(cc.p(0,0),cc.p(300,300),cc.color(),5,cc.color(255,255,0,255));
        //加入Layer層 
        this.addChild(drawNode);

 

畫圓點：drawDot

        //創建draw對象
        var drawNode =new cc.DrawNode();
        //畫點，參數：坐標，半徑， 顏色
        drawNode.drawDot(cc.p(100,100),10,cc.color(255,255,255));
        //加入Layer層 
        this.addChild(drawNode);

 

繪制圓形：drawCircle

        //創建draw對象
        var drawNode =new cc.DrawNode();
        //圓形，參數：原點，半徑，弧度，分段(越大越接近圓)，原點到弧度的線是否顯示，線條寬度，顏色
        drawNode.drawCircle(cc.p(200, 200), 50, 0, 50, false, 2, cc.color(0, 255, 0, 255));
        //加入Layer層 
        this.addChild(drawNode);

 

繪制多邊形：drawPoly

        //創建draw對象
        var drawNode =new cc.DrawNode();
       //轉折點坐標組
        var vertices = [cc.p(60, 80), cc.p(60, 230), cc.p(500, 80)];
        //多邊形，參數：坐標組，填充顏色，邊框寬度，邊框顏色
        drawNode.drawPoly(vertices, cc.color(0, 255, 255, 80), 2, cc.color(255, 0, 0, 255));
        //加入Layer層 
        this.addChild(drawNode);

 

繪制直線：drawSegment

        //創建draw對象
        var drawNode =new cc.DrawNode();
        //線，參數：起點，終點，線條寬度，線條顏色
        drawNode.drawSegment(cc.p(0, 0), cc.p(200,300), 1, cc.color(255, 0, 255, 255));
        //加入Layer層 
        this.addChild(drawNode);

 

繪制曲線：drawCardinalSpline

        //創建draw對象
        var drawNode =new cc.DrawNode();
        var vertices = [cc.p(60, 80), cc.p(60, 300), cc.p(300, 60)];
        //曲線，參數：點數組，張力，段落，線條寬度，顏色
        drawNode.drawCardinalSpline(vertices, 0.5,4,2,cc.color(255, 255, 255, 255));
        //加入Layer層 
        this.addChild(drawNode);
        

 

 

坐標移動：node.setPosition

        drawNode.setPositionX(22);
        drawNode.setPositionY(22);