cocos2dx opengl入门系列二-画一个三角形

运行环境：

mac10.12.2

xcode Version 8.2.1

cocos2dx-x-3.13.1

代码：

新建cocos2dx项目，具体操作官网有教程。新建好后，

新建Test.cpp，代码如下：

//
//  Test.cpp
//  FirstTriangle
//
//  Created by zhufu on 2017/3/27.
//
//

#include "Test.h"

Test* Test::create()
{
    Test* test = new(std::nothrow) Test();
    if(test && test->init())
    {
        test->autorelease();
        return test;
    }
    else
    {
        delete test;
        test = nullptr;
        return nullptr;
    }
}

bool Test::init()
{
    _glProgram = new GLProgram();
    _glProgram->initWithFilenames("shader/myVertexShader.vsh", "shader/myFragmentShader.fsh");
    _glProgram->link();
    //set uniform locations
    //使用此shader
    _glProgram->use();
    
    
    
    GLuint vertexVBO, colorVBO;
    glGenVertexArrays(1, &_vao);
    glBindVertexArray(_vao);
    
    //创建和绑定vbo
    glGenBuffers(1, &vertexVBO);
    glBindBuffer(GL_ARRAY_BUFFER, vertexVBO);
    
    GLfloat vertexData[] = {
        //  X     Y     Z
        0.0f, 1.0f, 0.0f,
        -1.0f,-1.0f, 0.0f,
        1.0f,-1.0f, 0.0f,
    };
    glBufferData(GL_ARRAY_BUFFER, sizeof(vertexData), vertexData, GL_STATIC_DRAW);
    
    //获取vertex attribute "a_position"的入口点
    GLuint positionLocation = glGetAttribLocation(_glProgram->getProgram(), "a_position");
    //打开入a_position入口点
    glEnableVertexAttribArray(positionLocation);
    //传递顶点数据给a_position，注意最后一个参数是数组的偏移了。
    glVertexAttribPointer(positionLocation, 3, GL_FLOAT, GL_FALSE, 0, (GLvoid*)0);
    
    //set for color
    glGenBuffers(1, &colorVBO);
    glBindBuffer(GL_ARRAY_BUFFER, colorVBO);
    float color[] = {0,1,0,1,  1,0,0,1,  0,0,1,1};
    glBufferData(GL_ARRAY_BUFFER, sizeof(color), color, GL_STATIC_DRAW);
    
    GLuint colorLocation = glGetAttribLocation(_glProgram->getProgram(), "a_color");
    glEnableVertexAttribArray(colorLocation);
    glVertexAttribPointer(colorLocation, 4, GL_FLOAT, GL_FALSE, 0, (GLvoid*)0);
    
    _command.init(_globalZOrder);
    _command.func = CC_CALLBACK_0(Test::onDraw, this);
    
    return true;
}

void Test::draw(Renderer *renderer, const Mat4 &parentTransform, uint32_t parentFlags)
{
    
    Director::getInstance()->getRenderer()->addCommand(&_command);
}

void Test::onDraw()
{
    glClearColor(0, 0, 0, 1); // black
    glClear(GL_COLOR_BUFFER_BIT);
    
    // bind the program (the shaders)
    glUseProgram(_glProgram->getProgram());
    // bind the VAO (the triangle)
    glBindVertexArray(_vao);
    
    // draw the VAO
    glDrawArrays(GL_TRIANGLES, 0, 3);
    // unbind the VAO
    glBindVertexArray(0);
    
    // unbind the program
    glUseProgram(0);
}

新建Test.h，代码如下：

//
//  Test.h
//  FirstTriangle
//
//  Created by zhufu on 2017/3/27.
//
//

#ifndef Test_h
#define Test_h

#include <stdio.h>
USING_NS_CC;
class Test : public Node
{
public:
    GLuint _program = 0;
    virtual bool init() override;
    static Test* create();
    virtual void draw(Renderer *renderer, const Mat4& parentTransform, uint32_t parentFlags) override;
    void onDraw();
    
    cocos2d::CustomCommand _command;
    GLProgram* _glProgram;
    
    GLuint _vao = 0;
    GLuint _vertexVBO = 0;
    GLuint _colorVBO = 0;
};

#endif /* Test_h */

如图：

修改HelloWorldScene.cpp，

先

include "Test.h"

再修改CreateScene方法：

Scene* HelloWorld::createScene()
{
    // 'scene' is an autorelease object
    auto scene = Scene::create();
    
    auto test = Test::create();
    scene->addChild(test);
    
    // 'layer' is an autorelease object
    auto layer = HelloWorld::create();

    // add layer as a child to scene
    scene->addChild(layer);

    // return the scene
    return scene;
}

如图：

在Resources方位夹下新建shader文件夹，再在shader新建myVertexShader.vsh和myFragmentShader.fsh文件。

如图：

myVertexShader.vsh

attribute vec4 a_position;
attribute vec4 a_color;

varying vec4 v_fragmentColor;

void main()
{
    gl_Position = a_position;
    v_fragmentColor = a_color;
}

myFragmentShader.fsh

varying vec4 v_fragmentColor;

void main()
{
    gl_FragColor = v_fragmentColor;
}

接下来，可以开心地运行程序了。

运行效果：