Cocos2d-x 3.2学习笔记(三)学习绘图API

时间:2023-03-09 03:47:08
Cocos2d-x 3.2学习笔记(三)学习绘图API

  关于cocos2d-x 3.2 版本的绘图方法有两种

  1、使用DrawNode类绘制自定义图形。

  2、继承Layer类重写draw()方法。

  以上两种方法都可以绘制自定义图形,根据自己的需要选择合适的方法。

一、使用DrawNode类绘制自定义图形

  使用DrawNode 类绘制图形是最简单的方法,create一个DrawNode类,然后添加进场景。然后就可以愉快的绘图了。

  

     auto s = Director::getInstance()->getWinSize();
   //创建
auto draw = DrawNode::create();
this->addChild(draw, ); // 画圆
for( int i=; i < ; i++)
{
draw->drawDot(Vec2(s.width/, s.height/), *(-i), Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), ));
} // 画多边形
Vec2 points[] = { Vec2(s.height/,), Vec2(s.width,s.height/), Vec2(s.width/*,s.height) };
draw->drawPolygon(points, sizeof(points)/sizeof(points[]), Color4F(,,,0.5), , Color4F(,,,)); // 画线
draw->drawSegment(Vec2(,s.height), Vec2(,s.height/), , Color4F(, , , )); draw->drawSegment(Vec2(,s.height/), Vec2(s.width/, s.height/), , Color4F(, , , 0.5)); // 画三角形
draw->drawTriangle(Vec2(, ), Vec2(, ), Vec2(, ), Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), 0.5)); // 画贝赛尔曲线
draw->drawQuadraticBezier(Vec2(s.width - , s.height - ), Vec2(s.width - , s.height - ), Vec2(s.width - , s.height - ), , Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), 0.5)); draw->drawCubicBezier(Vec2(s.width - , ), Vec2(s.width - , ), Vec2(s.width - , ), Vec2(s.width - , s.height - ), , Color4F(CCRANDOM_0_1(), CCRANDOM_0_1(), CCRANDOM_0_1(), 0.5));

  根据需要可以用这些api创造出自己需要的图像。

二、继承Layer类重写draw()方法

  这种方式可以自定义一个绘图类,用于创作自己需要的图形。

  

#ifndef __HELLOWORLD_SCENE_H__
#define __HELLOWORLD_SCENE_H__
#include "cocos2d.h"
USING_NS_CC; class HelloWorld : public cocos2d::Layer
{
public:
virtual void draw(Renderer *renderer, const Mat4 &transform, bool transformUpdated) override;
protected:
void onDraw(const kmMat4 &transform, bool transformUpdated);
CustomCommand _customCommand;
};
#endif
#include "HelloWorldScene.h"
#include "VisibleRect.h" void HelloWorld::draw(cocos2d::Renderer *renderer, const kmMat4 &transform, bool transformUpdated)
{
_customCommand.init();
_customCommand.func = CC_CALLBACK_0(HelloWorld::onDraw, this,transform,transformUpdated);
renderer->addCommand(&_customCommand);
} void HelloWorld::onDraw(const kmMat4 &transform, bool transformUpdated)
{
kmGLPushMatrix();
kmGLLoadMatrix(&transform); /*直线*/
CHECK_GL_ERROR_DEBUG();
DrawPrimitives::drawLine(VisibleRect::leftBottom(), VisibleRect::rightTop()); CHECK_GL_ERROR_DEBUG(); glLineWidth( 5.0f );
DrawPrimitives::setDrawColor4B(,,,);
DrawPrimitives::drawLine( Point(, ), Point(, ) ); // draw big point in the center
DrawPrimitives::setPointSize();
DrawPrimitives::setDrawColor4B(, , , );
DrawPrimitives::drawPoint(VisibleRect::center());
CHECK_GL_ERROR_DEBUG(); // draw 4 small points
Point points[] = { Point(,), Point(,), Point(,), Point(,) };
DrawPrimitives::setPointSize();
DrawPrimitives::setDrawColor4B(,,,);
DrawPrimitives::drawPoints( points, ); CHECK_GL_ERROR_DEBUG(); // draw a green circle with 10 segments
glLineWidth();
DrawPrimitives::setDrawColor4B(, , , );
DrawPrimitives::drawCircle( VisibleRect::center(), , , , false); CHECK_GL_ERROR_DEBUG(); // draw a green circle with 50 segments with line to center
glLineWidth();
DrawPrimitives::setDrawColor4B(, , , );
DrawPrimitives::drawCircle( VisibleRect::center(), , CC_DEGREES_TO_RADIANS(), , false); CHECK_GL_ERROR_DEBUG(); // draw a pink solid circle with 50 segments
glLineWidth();
DrawPrimitives::setDrawColor4B(, , , );
DrawPrimitives::drawSolidCircle( VisibleRect::center() + Point(,), , CC_DEGREES_TO_RADIANS(), , 1.0f, 1.0f); CHECK_GL_ERROR_DEBUG(); // open yellow poly
DrawPrimitives::setDrawColor4B(, , , );
glLineWidth();
Point vertices[] = { Point(,), Point(,), Point(,), Point(,), Point(,) };
DrawPrimitives::drawPoly( vertices, , false); CHECK_GL_ERROR_DEBUG(); // filled poly
glLineWidth();
Point filledVertices[] = { Point(,), Point(,), Point(,), Point(,), Point(,) };
DrawPrimitives::drawSolidPoly(filledVertices, , Color4F(0.5f, 0.5f, , ) ); // closed purble poly
DrawPrimitives::setDrawColor4B(, , , );
glLineWidth();
Point vertices2[] = { Point(,), Point(,), Point(,) };
DrawPrimitives::drawPoly( vertices2, , true); CHECK_GL_ERROR_DEBUG(); // draw quad bezier path
DrawPrimitives::drawQuadBezier(VisibleRect::leftTop(), VisibleRect::center(), VisibleRect::rightTop(), ); CHECK_GL_ERROR_DEBUG(); // draw cubic bezier path
DrawPrimitives::drawCubicBezier(VisibleRect::center(), Point(VisibleRect::center().x+,VisibleRect::center().y+), Point(VisibleRect::center().x+,VisibleRect::center().y-),Point(VisibleRect::center().x+,VisibleRect::center().y+),); CHECK_GL_ERROR_DEBUG(); //draw a solid polygon
Point vertices3[] = {Point(,), Point(,), Point(,), Point(,)};
DrawPrimitives::drawSolidPoly( vertices3, , Color4F(,,,) ); CHECK_GL_ERROR_DEBUG(); //end draw
kmGLPopMatrix();
}

  其中涉及到辅助类VisibleRect类得到获取视口。

 #ifndef __VISIBLERECT_H__
#define __VISIBLERECT_H__ #include "cocos2d.h" class VisibleRect
{
public:
static cocos2d::Rect getVisibleRect(); static cocos2d::Vec2 left();
static cocos2d::Vec2 right();
static cocos2d::Vec2 top();
static cocos2d::Vec2 bottom();
static cocos2d::Vec2 center();
static cocos2d::Vec2 leftTop();
static cocos2d::Vec2 rightTop();
static cocos2d::Vec2 leftBottom();
static cocos2d::Vec2 rightBottom();
private:
static void lazyInit();
static cocos2d::Rect s_visibleRect;
}; #endif /* __VISIBLERECT_H__ */

VisibleRect.h

 #include "VisibleRect.h"

 USING_NS_CC;

 Rect VisibleRect::s_visibleRect;

 void VisibleRect::lazyInit()
{
// no lazy init
// Useful if we change the resolution in runtime
s_visibleRect = Director::getInstance()->getOpenGLView()->getVisibleRect();
} Rect VisibleRect::getVisibleRect()
{
lazyInit();
return s_visibleRect;
} Vec2 VisibleRect::left()
{
lazyInit();
return Vec2(s_visibleRect.origin.x, s_visibleRect.origin.y+s_visibleRect.size.height/);
} Vec2 VisibleRect::right()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width, s_visibleRect.origin.y+s_visibleRect.size.height/);
} Vec2 VisibleRect::top()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width/, s_visibleRect.origin.y+s_visibleRect.size.height);
} Vec2 VisibleRect::bottom()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width/, s_visibleRect.origin.y);
} Vec2 VisibleRect::center()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width/, s_visibleRect.origin.y+s_visibleRect.size.height/);
} Vec2 VisibleRect::leftTop()
{
lazyInit();
return Vec2(s_visibleRect.origin.x, s_visibleRect.origin.y+s_visibleRect.size.height);
} Vec2 VisibleRect::rightTop()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width, s_visibleRect.origin.y+s_visibleRect.size.height);
} Vec2 VisibleRect::leftBottom()
{
lazyInit();
return s_visibleRect.origin;
} Vec2 VisibleRect::rightBottom()
{
lazyInit();
return Vec2(s_visibleRect.origin.x+s_visibleRect.size.width, s_visibleRect.origin.y);
}

VisibleRect.cpp