Cocos2dx引擎11-OpenGLES渲染之Shader准备

Cocos2dx底层图形绘制是使用OpenGL ES协议的。OpenGL ES是什么呢?

OpenGL ES(OpenGl for Embedded System)是OpenGL三维图形API的子集,针对手机,PDA和游戏主机等嵌入式设备而设计.该API有Khronos集团定义推广,Khronos是一个图形软硬件行业协会,该协会主要关注图形和多媒体方面的开放标准.

OpenGL ES是从OpenGL剪裁或定制过来了,去除了glBegin/glEnd,四边形(GL_QUADS),多边形(GL_POLYGON)等复杂图元等许多非必要的特性.经过多年发展,现在主要有两个版本,OpenGLES1.x针对固定管线硬件,OpenGL ES2.x针对可编程管线硬件.OpenGL ES1.0是以OpenGL1.3规范为基础的,OpenGL ES1.1是以OpenGL1.5为基础的,他们分别又支持common和commonlite两种profile.OpenGL ES2.0是参照OpenGL2.0规范定义的.

从Cocos2dx 2.x版本开始，Cocos2dx底层图形渲染使用OpenGL ES2.x新特性可编程着色器(Shader),下面首先介绍Shader的使用流程

xxxxx… //Shader程序

1、创建着色器对象

glCreateShader

2、着色器对象关联着色器代码

glShaderSource

3、把着色器源代码编译成目标代码

glCompileShader

4、验证着色器是否已经变异通过

glGetShaderiv    glGetShaderInfoLog

5、创建一个着色器程序

glCreatePragram

6、把着色器链接到着色器程序中

glAttachShader

7、链接着色器程序

glLinkProgram

8、验证着色器程序是否链接成功

glGetProgramiv   glGetProgramInfoLog

9、使用着色器程序进行定点或片段处理

glUseProgram

在Cocos2dx引擎中GLProgramCache类扮演着一个重要的角色，初始化并且保存Shader程序；并且为需要渲染的元素提供需要的Shader程序；

classCC_DLL GLProgramCache : public Ref
{
public:
    /**
     * @构造函数
     */
    GLProgramCache();
    /**
     * @析构函数
     */
    ~GLProgramCache();

    /** 单例方法 */
    static GLProgramCache* getInstance();

    /**清除单例*/
    static void destroyInstance();

    /**加载Shader程序*/
    void loadDefaultGLPrograms();
    CC_DEPRECATED_ATTRIBUTE void loadDefaultShaders(){ loadDefaultGLPrograms(); }

    /**重新加载Shader程序 */
    void reloadDefaultGLPrograms();
    CC_DEPRECATED_ATTRIBUTE void reloadDefaultShaders(){ reloadDefaultGLPrograms(); }

    /** 使用Key获取Shader程序
     */
    GLProgram * getGLProgram(const std::string &key);
    CC_DEPRECATED_ATTRIBUTE GLProgram * getProgram(conststd::string &key) { return getGLProgram(key); }
    CC_DEPRECATED_ATTRIBUTE GLProgram * programForKey(conststd::string &key){ return getGLProgram(key); }

    /** 将Shader程序加入GLProgramCache单例中 */
    void addGLProgram(GLProgram* program, conststd::string &key);
    CC_DEPRECATED_ATTRIBUTE void addProgram(GLProgram*program, const std::string &key) { addGLProgram(program, key); }

private:
    bool init();
    void loadDefaultGLProgram(GLProgram *program,int type);

//使用字典programs保存所有的Shader程序
    std::unordered_map<std::string, GLProgram*>_programs;
};

下面为单例方法getInstance：

staticGLProgramCache *_sharedGLProgramCache = 0;
GLProgramCache*GLProgramCache::getInstance()
{
    if (!_sharedGLProgramCache) {
        _sharedGLProgramCache = new GLProgramCache();
        if (!_sharedGLProgramCache->init())
        {
            CC_SAFE_DELETE(_sharedGLProgramCache);
        }
    }
    return _sharedGLProgramCache;
}

1、  第一次调用GLProgramCache::getInstance()方法时会new一个GLProgramCache实例方法

2、  初始化GLProgramCache实例方法

3、  方法单例_sharedGLProgramCache

下面为GLProgramCache的init方法：

boolGLProgramCache::init()
{
    loadDefaultGLPrograms();
    return true;
}
voidGLProgramCache::loadDefaultGLPrograms()
{
    GLProgram *p = new GLProgram();
loadDefaultGLProgram(p, kShaderType_PositionTextureColor);_programs.insert( std::make_pair( GLProgram::SHADER_NAME_POSITION_TEXTURE_COLOR,p ) );
……
}

1、在GLProgramCache::init中会调用加载Shader方法loadDefaultGLPrograms

2、在loadDefaultGLPrograms方法中首先会创建一个GLProgram对象

3、将对应名称的Shader加载到GLProgram对象中

4、将GLProgram对象插入到字典_programs中

在loadDefaultGLProgram方法中：

voidGLProgramCache::loadDefaultGLProgram(GLProgram *p, int type)
{
    switch (type) {
        case kShaderType_PositionTextureColor:
            p->initWithByteArrays(ccPositionTextureColor_vert,ccPositionTextureColor_frag);
            break;
        ………
        default:
            CCLOG("cocos2d: %s:%d, errorshader type", __FUNCTION__, __LINE__);
            return;
    }

    p->link();
    p->updateUniforms();

    CHECK_GL_ERROR_DEBUG();
}

1、 根据GLProgram类型使用对应的shader程序初始化GLProgram；在initWithByteArrays中，会将上述Shader使用流程中1-6不走执行

2、 链接Program

3、 获取该Program中的一些Uniform变量，工后续使用

下面看一下Cocos2dx中Shader程序的保存方式：

在cocos2d\cocos\renderer\ccShaders.cpp中:

#include"ccShader_Position_uColor.frag"
#include"ccShader_Position_uColor.vert"
……

ccShader_Position_uColor.vert文件：

constchar* ccPosition_uColor_vert = STRINGIFY(

attributevec4 a_position;
uniformvec4 u_color;
uniformfloat u_pointSize;

\n#ifdefGL_ES\n
varyinglowp vec4 v_fragmentColor;
\n#else\n
varyingvec4 v_fragmentColor;
\n#endif\n

voidmain()
{
    gl_Position = CC_MVPMatrix * a_position;
    gl_PointSize = u_pointSize;
    v_fragmentColor = u_color;
}
);

这里定义了ccPosition_uColor_vert变量，该顶点着色器的功能室使用矩阵计算OpenGL中顶点的位置；

ccShader_Position_uColor.frag文件：

constchar* ccPosition_uColor_frag = STRINGIFY(

\n#ifdefGL_ES\n
precisionlowp float;
\n#endif\n

varyingvec4 v_fragmentColor;

voidmain()
{
    gl_FragColor = v_fragmentColor;
}
);

这里定义了ccPosition_uColor_frag变量，该片段Shader的功能就是设置顶点的颜色；

上面两段Shader程序会字符串的形式传入initWithByteArrays方法中，下面为initWithByteArrays方法：

boolGLProgram::initWithByteArrays(const GLchar* vShaderByteArray, const GLchar* fShaderByteArray)
{
    ……//Windows平台单独设定
    _program = glCreateProgram();
    CHECK_GL_ERROR_DEBUG();

    _vertShader = _fragShader = 0;

    if (vShaderByteArray)
    {
        if (!compileShader(&_vertShader, GL_VERTEX_SHADER,vShaderByteArray))
        {
            CCLOG("cocos2d: ERROR: Failedto compile vertex shader");
            return false;
       }
    }

    // Create and compile fragment shader
    if (fShaderByteArray)
    {
        if (!compileShader(&_fragShader, GL_FRAGMENT_SHADER,fShaderByteArray))
        {
            CCLOG("cocos2d: ERROR: Failedto compile fragment shader");
            return false;
        }
    }

    if (_vertShader)
    {
        glAttachShader(_program, _vertShader);
    }
    CHECK_GL_ERROR_DEBUG();

    if (_fragShader)
    {
        glAttachShader(_program, _fragShader);
    }
    _hashForUniforms = nullptr;

    CHECK_GL_ERROR_DEBUG();
    ……//Windows平台单独设定
    return true;
}

1、如果顶点Shader不为空，编译顶点Shader

2、如果片段Shader不为空，编译片段Shader

3、将program和顶点Shader绑定

4、将program和片段Shader绑定

在compileShader方法中：

boolGLProgram::compileShader(GLuint * shader, GLenum type, const GLchar* source)
{
    GLint status;
    if (!source)  return false;
const GLchar *sources[] = {
   ……//特殊平台需要的Uniform变量
        "uniform mat4 CC_PMatrix;\n"
        "uniform mat4 CC_MVMatrix;\n"
        "uniform mat4CC_MVPMatrix;\n"
        "uniform vec4 CC_Time;\n"
        "uniform vec4 CC_SinTime;\n"
        "uniform vec4 CC_CosTime;\n"
        "uniform vec4 CC_Random01;\n"
        "uniform sampler2DCC_Texture0;\n"
        "uniform sampler2DCC_Texture1;\n"
        "uniform sampler2DCC_Texture2;\n"
        "uniform sampler2DCC_Texture3;\n"
        "//CC INCLUDES END\n\n",
        source,
    };

    *shader = glCreateShader(type);
    glShaderSource(*shader, sizeof(sources)/sizeof(*sources),sources, nullptr);
    glCompileShader(*shader);

    glGetShaderiv(*shader, GL_COMPILE_STATUS, &status);
    if (! status) {
        GLsizei length;
        glGetShaderiv(*shader, GL_SHADER_SOURCE_LENGTH,&length);
        GLchar* src = (GLchar *)malloc(sizeof(GLchar)* length);

        glGetShaderSource(*shader, length, nullptr,src);
        CCLOG("cocos2d: ERROR: Failed tocompile shader:\n%s", src);

        if (type == GL_VERTEX_SHADER)
            CCLOG("cocos2d: %s", getVertexShaderLog().c_str());
        else
            CCLOG("cocos2d: %s", getFragmentShaderLog().c_str());
        free(src);
        return false;;
    }
    return (status == GL_TRUE);
}

1、在Shader程序字符串之前加入Shader执行时可能需要的Uniform变量，形成新的字符串

2、执行上述Shader使用流程中步骤1-3

3、验证该Shader有没有编译成功

此时Cocos2dx中需要使用到的Shader程序都已经准备好了，如何使用后面的博客中会继续讲述；对OpenGL Shader（GLSL）不是很了解的同学可以查询一下这方面的资料。

时间： 2024-08-02 14:01:10

Cocos2dx引擎11-OpenGLES渲染之Shader准备的相关文章

基于Cocos2d-x学习OpenGL ES 2.0系列——OpenGL ES渲染之Shader准备（7）

Cocos2d-x底层图形绘制是使用OpenGL ES协议的.OpenGL ES是什么呢? OpenGL ES(OpenGl for Embedded System)是OpenGL三维图形API的子集,针对手机.Pad和游戏主机等嵌入式设备而设计.该API由Khronos集团定义推广,Khronos是一个图形软硬件行业协会,该协会主要关注图形和多媒体方面的开放标准.OpenGL ES是OpenGL三维图形API的子集,针对手机.Pad和游戏主机等嵌入式设备而设计.Cocos2d-x底层图形渲染使

Cocos2dx引擎12-OpenGLES渲染之LayerColor

在前面微博中讲述了Cocos2dx引擎OpenGL渲染准备Shader方面,本博客中将使用LayerColor来讲述OpenGL的渲染过程. 1.LayerColor对象创建 添加LayerColor元素到游戏中: autolayerColor = LayerColor::create(Color4B(255, 0, 0, 255), 100, 100); layerColor->setPosition(100,100); this->addChild(layerColor); 下面是Laye

Cocos2d-x 3.x 图形学渲染系列十五

笔者介绍:姜雪伟,IT公司技术合伙人,IT高级讲师,CSDN社区专家,特邀编辑,畅销书作者,国家专利发明人;已出版书籍:<手把手教你架构3D游戏引擎>电子工业出版社和<Unity3D实战核心技术详解>电子工业出版社等. 在游戏开发中或者是游戏程序员招聘中,都有关于图形学或者引擎高级程序职位.凡是涉及到这些职位的招聘,对于此职位的开发人员都需要会Shader编程或者说GPU编程,同时他们的薪资也是比较高的.目前国内掌握图形学编程的人不是很多,物以稀为贵.Shader编程的主要目的是协

第1部分: 游戏引擎介绍， 渲染和构造3D世界

原文作者:Jake Simpson译者: 向海Email:[email protected] ------------------------------------------------------------第1部分: 游戏引擎介绍, 渲染和构造3D世界 介绍 自Doom游戏时代以来我们已经走了很远. DOOM不只是一款伟大的游戏,它同时也开创了一种新的游戏编程模式: 游戏 "引擎". 这种模块化,可伸缩和扩展的设计观念可以让游戏玩家和程序设计者深入到游戏核心,用新的模型,场景和

通过渲染器Shader实现图像变换效果

在上一篇文章中,一起学习了通过设定画笔风格来实现图形变换,没读过的朋友可以点击下面链接: http://www.cnblogs.com/fuly550871915/p/4886455.html 是不是觉得自己学到的知识更多了呢?那么再多学一点总没坏处.在本篇文章中,将会一起学习通过给画笔设定Shader属性,实现图形变换.并带领读者一起实现两个实际例子,图片渲染器和线性渲染器.有没有发现我们的画笔特别强大呢??确实,我们曾经给它设置过颜色矩阵属性,设置过xfermode风格属性,现在又来设定Sh

Cocos2dx引擎优化(1) ---音效系统

Cocos2dx提供的音频库位于CocosDenshion中,其接口由SimpleAudioEngine定义,提供了基本的背景音乐和音效播放. SimpleAudioEngine的实现是夸平台的, 在windows平台上由mci相关API实现; 在android平台上透过JNI,调用android sdk 中的AudioPlayer实现;而在IOS平台上由Cocoa sdk里的Core-Audio实现.但SimpleAudioEngine并不适用于大部分游戏情境,它在Android上的实现需要直

Cocos2d-x 3.x 图形学渲染系列二十八

笔者介绍:姜雪伟,IT公司技术合伙人,IT高级讲师,CSDN社区专家,特邀编辑,畅销书作者,国家专利发明人;已出版书籍:<手把手教你架构3D游戏引擎>电子工业出版社和<Unity3D实战核心技术详解>电子工业出版社等. CSDN视频网址:http://edu.csdn.net/lecturer/144 昨天,刚从丈母娘家回来,继续博客的更新,接着Cocos2d-x 3.x图形学渲染系列二十七继续系列二十八的编写. 接下来读取FBX模型文件信息,首先要做的是把读取的模型信息进行归类并

Android Cocos2dx引擎 prv.ccz/plist/so等优化缓存文件，手把手ida教你逆向project反编译apk库等文件

前段时间在 Android play 上看到一个非常牛逼的 3D 动态天气预报,效果真的非常炫.二话不说动手 dex2jar.bat/apktool 发现这并没 有什么卵用,在核心的地方看见 native 字段果断放弃了治疗,立刻转向 so 的逆向project.发现了cocos2dx so 引擎,搜噶.我就说 嘛这么炫酷的效果, Android 源代码是做不了的.即使达到了这样的程度,预计性能也特别不好.由于那个动态效果是不会循环播放 的,也就是不会反复.是自己绘制的依据资源文件,在反编译的

【转】cocos2d-x游戏开发(十四)用shader使图片背景透明

转自:http://blog.csdn.net/dawn_moon/article/details/8631783 好吧,终于抽时间写这篇文章了. 手头上有很多人物行走图,技能特效图等,但这些图都有个纯黑色背景,怎么样将内容显示出来,让背景透明呢?前段时间搞了一下,感谢群里的童鞋们,提供了思路和方法. 这里用shader处理了像素,使黑色背景透明,直接上代码 ShaderSprite.h 1 #ifndef __TestShader__ShaderSprite__ 2 #define __Tes