cocos2d-x 源码剖析（17）

这节本来是打算接着上一篇发的，但是那天实在太晚了就拖了下来。没想到昨天在邮箱里面赫然发现了《炉石传说》的封测兑换码，节奏立马就变了。昨天和今天体验了一把，策略性很强，不过如果你玩到一定阶段就是拼人品和卡牌了。我相信之后《炉石传说》之后会加入四人对战模式，双人对战策略略显单薄了些。今天连胜五把，解锁了2个新英雄，来篇文章纪念下。

上一篇其实还没有将CCTexture讲完。cocos2d-x在很多地方，为了使用的方便把一些概念上分开的东西整合到了一起，比如CCTexture是维护Texture用的，但是里面却有两个绘制函数:

/** draws a texture at a given point */
void drawAtPoint(const CCPoint& point);
/** draws a texture inside a rect */
void drawInRect(const CCRect& rect);

这节之所以单独来讲，是因为这是整个2D引擎中最核心的所在——绘制一张图片。如果你是用原生的OpenGL来做到这一步，那是相当的繁琐。但是现在cocos2d-x把那些脏活累活都做完了，显示一张图片就变得很简单了。我们使用CCTexture来讲图片的绘制，是为了以后讲CCSprite做铺垫。知道如何显示图片，是了解如何显示更复杂内容的基础。先来看看代码：

void CCTexture2D::drawAtPoint(const CCPoint& point)
{
  GLfloat    coordinates[] = {    
    0.0f,    m_fMaxT,
    m_fMaxS,m_fMaxT,
    0.0f,    0.0f,
    m_fMaxS,0.0f };
 
  GLfloat    width = (GLfloat)m_uPixelsWide * m_fMaxS,
  height = (GLfloat)m_uPixelsHigh * m_fMaxT;
 
  GLfloat        vertices[] = {    
    point.x,            point.y,
    width + point.x,    point.y,
    point.x,            height  + point.y,
    width + point.x,    height  + point.y };
 
  ccGLEnableVertexAttribs( kCCVertexAttribFlag_Position | kCCVertexAttribFlag_TexCoords );
  m_pShaderProgram->use();
  m_pShaderProgram->setUniformsForBuiltins();
 
  ccGLBindTexture2D( m_uName );
 
#ifdef EMSCRIPTEN
  setGLBufferData(vertices, 8 * sizeof(GLfloat), 0);
  glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, 0, 0);
 
  setGLBufferData(coordinates, 8 * sizeof(GLfloat), 1);
  glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, 0, 0);
#else
  glVertexAttribPointer(kCCVertexAttrib_Position, 2, GL_FLOAT, GL_FALSE, 0, vertices);
  glVertexAttribPointer(kCCVertexAttrib_TexCoords, 2, GL_FLOAT, GL_FALSE, 0, coordinates);
#endif // EMSCRIPTEN
 
  glDrawArrays(GL_TRIANGLE_STRIP, 0, 4);
}

• 第一步初始化了一个纹理坐标。
• 第二步初始化了一个定点坐标。
• 第三步开启顶点坐标和纹理坐标。
• 第四步指定shader程序
• 第五步绑定当前纹理，这步就是纹理的核心了，也就是那个m_uNane。
• 第六步传输顶点坐标和纹理坐标。
• 第七步绘制图形。

简单的绘制一个图片就是这个流程，如果没有cocos2d-x的帮助，想要自己写一套还真要费不少事情。当然这个API要到OpenGL的上下文中才能执行。而cocos2d-x的OpenGL上下文只有在Node的draw中才有，所以我们写一个简单的demo来看看效果，为了省事我直接拿HelloCpp来改了，相关的函数如下：

bool HelloWorld::init()
{
  earth_ = new CCTexture2D();
  auto image = new CCImage();
  image->initWithImageFile("earth.jpg");
  earth_->initWithImage(image);
  CC_SAFE_DELETE(image);
  return true;
}
 
void HelloWorld::draw() {
  CCLayer::draw();
  earth_->drawAtPoint(CCPointZero);
}

同样没做错误处理，希望大家不要介意，下面是显示效果：