cocos2d-js cc.DrawNode用法示例
2016-01-26 10:23
561 查看
var draw = new cc.DrawNode(); //创建drawnode对象 this.addChild(draw, 10); var centerPos = cc.p(winSize.width / 2, winSize.height / 2); //drawSegment --- 绘制直线 //用法:draw.drawSegment(from, to, lineWidth, color) //参数 // from:起始点 // to:终点 // lineWidth:线条宽度 // color:线条颜色 draw.drawSegment(cc.p(0, 0), cc.p(winSize.width, winSize.height), 1, cc.color(255, 0, 255, 255)); draw.drawSegment(cc.p(0, winSize.height), cc.p(winSize.width, 0), 5, cc.color(255, 0, 0, 255)); //drawDot --- 绘制圆点 //draw.drawDot(pos, radius, color) //draw.drawDots(points, radius, color) //画点 points 点数组 draw.drawDot(cc.p(winSize.width / 2, winSize.height / 2), 40, cc.color(0, 0, 255, 128)); var points = [cc.p(60, 60), cc.p(70, 70), cc.p(60, 70), cc.p(70, 60)]; draw.drawDots(points, 4, cc.color(0, 255, 255, 255)); //drawCircle --- 绘制圆形 //draw.drawCircle(center, radius, angle, segments, drawLineToCenter, lineWidth, color) draw.drawCircle(cc.p(winSize.width / 2, winSize.height / 2), 100, 0, 10, false, 7, cc.color(0, 255, 0, 255)); draw.drawCircle(cc.p(winSize.width / 2, winSize.height / 2), 50, cc.degreesToRadians(90), 100, true, 2, cc.color(0, 255, 255, 255)); //draw poly --- 绘制多边形 //draw.drawPoly(verts, fillColor, lineWidth, color) //not fill var vertices = [cc.p(0, 0), cc.p(50, 50), cc.p(100, 50), cc.p(100, 100), cc.p(50, 100) ]; draw.drawPoly(vertices, null, 5, cc.color(255, 255, 0, 255)); var vertices2 = [cc.p(30, 130), cc.p(30, 230), cc.p(50, 200)]; draw.drawPoly(vertices2, null, 2, cc.color(255, 0, 255, 255)); //fill var vertices3 = [cc.p(60, 130), cc.p(60, 230), cc.p(80, 200)]; draw.drawPoly(vertices3, cc.color(0, 255, 255, 50), 2, cc.color(255, 0, 255, 255)); //draw rect --- 绘制矩形 //draw.drawRect(origin, destination, fillColor, lineWidth, lineColor) //not fill draw.drawRect(cc.p(120, 120), cc.p(200, 200), null, 2, cc.color(255, 0, 255, 255)); //fill draw.drawRect(cc.p(120, 220), cc.p(200, 300), cc.color(0, 255, 255, 180), 2, cc.color(128, 128, 0, 255)); // draw quad bezier path --- 绘制二次贝塞尔曲线 // draw.drawQuadBezier(origin, control, destination, segments, lineWidth, color) draw.drawQuadBezier(cc.p(0, winSize.height), cc.p(centerPos.x, centerPos.y), cc.p(winSize.width, winSize.height), 50, 2, cc.color(255, 0, 255, 255)); // draw cubic bezier path --- 绘制三次贝塞尔曲线 // draw.drawCubicBezier(origin, control1, control2, destination, segments, lineWidth, color) draw.drawCubicBezier(cc.p(winSize.width / 2, winSize.height / 2), cc.p(winSize.width / 2 + 30, winSize.height / 2 + 50), cc.p(winSize.width / 2 + 60, winSize.height / 2 - 50), cc.p(winSize.width, winSize.height / 2), 100, 2, cc.color(255, 0, 255, 255)); // draw cardinal spline --- 绘制曲线 // drawNode.drawCardinalSpline(config, tension, segments, lineWidth, color) var vertices4 = [ cc.p(centerPos.x - 130, centerPos.y - 130), cc.p(centerPos.x - 130, centerPos.y + 130), cc.p(centerPos.x + 130, centerPos.y + 130), cc.p(centerPos.x + 130, centerPos.y - 130), cc.p(centerPos.x - 130, centerPos.y - 130) ]; draw.drawCardinalSpline(vertices4, 0.5, 100, 2, cc.color(255, 255, 255, 255));
相关文章推荐
- COCOS学习笔记--变速动作Speed和ActionEase
- Json文件解析cocos
- Cocos Sprite创建的5种方法
- 【cocos2d-x 2.x 学习与应用总结】14: 自定义shader绘制混合颜色的矩形
- 【quick-cocos2d-x】Lua 语言基础
- 用Python新建一个cocos2dx2.2的工程
- cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第七步---英雄要升级&属性--解析csv配置文件
- 【Cocos2D-X 游戏引擎】初窥门径(1) 制作一个动态的精灵
- cocos2dx动画常见22种特效
- cocos2dx常见32种场景切换动画
- VS2010-win32下cocos2dx控制台打印的方法
- VS2010-win32下cocos2dx控制台打印的方法
- cocos2dx-lua捕获用户touch事件的几种方式
- cocos2dx常见49种Action
- cocos2d-x 笔记
- cocos2d-x3.2中加入Android手机震动
- 寒風的Cocos之旅之Lua篇---2048项目的结构
- 寒風的Cocos之旅之Lua篇---2048移动块的机制
- cocos2dx-lua牧场小游戏(一)
- cocos2dx发展路线