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

布满荆棘的人生 2022-06-13 00:53 178阅读 0赞

运行环境：

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 */

如图：

![Center][]

修改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;
    }

如图：

![Center 1][]

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

如图：

![Center 2][]

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;
    }

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

运行效果：

![Center 3][]

[Center]: /images/20220613/887cec1682f3468284882764f15246b8.png
[Center 1]: /images/20220613/66972189d2784032a5816f3c769d2368.png
[Center 2]: /images/20220613/0d021b238fd64db2a0ade8ad17ca96b1.png
[Center 3]: /images/20220613/5c15b05cd581497c8a47fe2182d36455.png