【Cocos2d-X开发学习笔记】第10期:渲染框架之几何图形的绘制

本系列学习教程使用的是cocos2d-x-2.1.4(最新版为3.0alpha0-pre) ,PC开发环境Windows7,C++开发环境VS2010       

 

 

 

一、图形的绘制

 

      有时为了调试游戏,我们常常会需要绘制一些简单的几何图形,比如点、直线或者圆圈。这些几何图形颜色颜色

简单,样式单一,很少出现在游戏画面中,Cocos2D-X引擎提供了一个绘制几何图形的类CCDrawingPrimitives。我

们可以使用它来绘制几何图形,用于调试游戏画面。

 

注意:因为类CCDrawingPrimitives纯粹是为了调试游戏而存在的,所以我们在技术文档中找不到此类说明。

 

1、常用绘制图形函数如下。

 

<1> ccDrawColor4B(GLubyte r,GLubyte g,GLubyte b,GLubyte a)

作用:设置绘制颜色。

参数1:红色分量。

参数2:绿色分量。

参数3:蓝色分量。

参数4:透明度。

 

<2> glLineWidth(GLfloat width)

作用:设置线条宽度。

参数:宽度值。

 

<3> ccDrawLine(const CCPoint& origin,const CCPoint& destination)

作用:绘制一条直线。

参数1:起始坐标。

参数2:终点坐标。

 

<4> ccPointSize(GLfloat pointSize)

作用:设置每个点的大小。

参数:点的大小。

 

<5> ccDrawPoint(const CCPoint& point)

作用:绘制一个点。

参数:点的坐标。

 

<6> ccDrawCircle(const CCPoint& center,float radius,float angle,unsigned int segments,bool drawLineToCenter)

作用:绘制圆形。

参数1:中心点坐标。

参数2:半径长度。

参数3:圆形的角度。

参数4:角度。

参数5:定点数。

 

<7> ccDrawPoly(const CCPoint * poli,unsigned int numberOfPoints,bool closePolygon)

作用:绘制空心多边形。

参数1:顶点数组。

参数2:点数量。

参数3:是否自动封闭多边形。

 

<8> ccDrawSolidRect(CCPoint origin,CCPoint destination,ccColor4F color)

作用:绘制填充的矩形。

参数1:顶点数组。

参数2:点数量。

参数3:矩形的颜色。

 

<9> ccDrawRect(CCPoint origin,CCPoint destination)

作用:绘制空心的矩形。

参数1:顶点数组。

参数2:点数量。

 

<10> ccDrawQuadBezier(const CCPoint& origin,const CCPoint& control,const CCPoint& destination,unsigned int segments)

作用:绘制贝塞尔曲线。

参数1:起始点。

参数2:控制点。

参数3:结束点。

参数4:顶点数。

 

<11> ccDrawCubicBezier(conts CCPoint& origin,const CCPoint& control1,const CCPoint& control2,const CCPoint& destination,unsigned int segments)

作用:绘制立体贝塞尔曲线。

参数1:起始点。

参数2:控制点1。

参数3:控制点2.

参数4:结束点。

参数5:顶点数。

 

2、示例代码如下。

 

<1> 首先新建Cocos2D-X项目,在HelloWorldScene.h头文件中重写draw函数:

//重写draw函数
    virtual void draw();


<2> 然后在HelloWorldScene.cpp文件中实现了draw函数:

void HelloWorld::draw(){
    CCSize s = CCDirector::sharedDirector()->getWinSize();
    //设置颜色
    ccDrawColor4B(255,0,0,255);
    //设置线的宽度
    glLineWidth(2);
    //绘制一条直线
    ccDrawLine( ccp(0, 0), ccp(s.width*0.5, s.height*0.5) );
    
    ccDrawColor4B(255,255,0,0);
    //设置像素尺寸
    ccPointSize(30);
    //绘制一个点
    ccDrawPoint( ccp(s.width*0.5, s.height *0.5) );
    
    ccDrawColor4B(0,0,255,0);
    //绘制圆形
    ccDrawCircle( ccp(s.width/2, s.height/2), 50, CC_DEGREES_TO_RADIANS(90), 50, false);
    ccDrawCircle( ccp(s.width/2, s.height/2), 50, CC_DEGREES_TO_RADIANS(45), 6, false);
    
    ccDrawColor4B(0, 255, 255, 255);
    glLineWidth(5);
    //绘制多边形
    CCPoint vertices[] = { ccp(70,150), ccp(150,150), ccp(150,200),ccp(190,300)  };
    ccDrawPoly( vertices, 4, true);
    
    ccDrawColor4B(255, 0, 255, 255);
    //绘制填充的多边形
    CCPoint filledVertices[] = { ccp(0,120), ccp(50,120), ccp(50,170), ccp(25,200), ccp(0,170) };
	ccDrawSolidPoly(filledVertices, 5, ccc4f(0.5f, 0.5f, 1, 1 ) );
//    ccDrawPoly(<#const cocos2d::CCPoint *vertices#>, <#unsigned int numOfVertices#>, <#bool closePolygon#>)
    
    //绘制贝塞尔曲线
    ccDrawQuadBezier(ccp(0,s.height), ccp(s.width/2,s.height/2), ccp(s.width,s.height), 50);
    
    //绘制立体的贝塞尔曲线
    // draw cubic bezier path
    ccDrawCubicBezier(ccp(s.width/2, s.height/2), ccp(s.width/2+30,s.height/2+50), ccp(s.width/2+60,s.height/2-50),ccp(s.width, s.height/2),100);
    
    //绘制填充举行
    ccDrawSolidRect(ccp(240,50), ccp(300,10), ccc4f(255, 177, 177, 255));
    //绘制空心矩形
//    ccDrawRect(<#cocos2d::CCPoint origin#>, <#cocos2d::CCPoint destination#>)
    
}


 

3、示例效果图。

 

 

 

源码下载地址

 

 

你可能感兴趣的:(cocos2d-x,手机游戏开发,Cocos2D-x游戏引擎,Cocos2D-X游戏开发)