在cocos2d中使用shader

最新推荐文章于 2025-08-20 13:25:32 发布

原创最新推荐文章于 2025-08-20 13:25:32 发布 · 1.9k 阅读

0 ·

CC 4.0 BY-SA版权

ios 同时被 2 个专栏收录

22 篇文章

订阅专栏

cocos2d

17 篇文章

订阅专栏

本文深入探讨了Cocos2d-X框架中图像处理部分的改进，重点介绍了Shader技术的应用流程，包括自定义和预设Shader的使用方法、属性绑定、参数设置及绘图过程。

cocos2d2.0以后，关于图像处理部分已经全部改为使用shader来进行，下面我们来看看shader的使用过程吧。

首先，shader可以分为2类，一类是自定义的，一类是cocos2d提供的一些默认shader，2者使用的方法有所不同。

cocos2d提供的默认shader

const GLchar * ccPosition_uColor_frag =

#import "ccShader_Position_uColor_frag.h"

const GLchar * ccPosition_uColor_vert =

#import "ccShader_Position_uColor_vert.h"

//

const GLchar * ccPositionColor_frag =

#import "ccShader_PositionColor_frag.h"

const GLchar * ccPositionColor_vert =

#import "ccShader_PositionColor_vert.h"

//

const GLchar * ccPositionTexture_frag =

#import "ccShader_PositionTexture_frag.h"

const GLchar * ccPositionTexture_vert =

#import "ccShader_PositionTexture_vert.h"

//

const GLchar * ccPositionTextureA8Color_frag =

#import "ccShader_PositionTextureA8Color_frag.h"

const GLchar * ccPositionTextureA8Color_vert =

#import "ccShader_PositionTextureA8Color_vert.h"

//

const GLchar * ccPositionTextureColor_frag =

#import "ccShader_PositionTextureColor_frag.h"

const GLchar * ccPositionTextureColor_vert =

#import "ccShader_PositionTextureColor_vert.h"

//

const GLchar * ccPositionTextureColorAlphaTest_frag =

#import "ccShader_PositionTextureColorAlphaTest_frag.h"

//

const GLchar * ccPositionTexture_uColor_frag =

#import "ccShader_PositionTexture_uColor_frag.h"

const GLchar * ccPositionTexture_uColor_vert =

#import "ccShader_PositionTexture_uColor_vert.h"

这些shader被包装在CCShaderCache类中，如果要调用，可以通过以下函数来进行

1、初始化shader以及shaderProgram

self.shaderProgram = [[CCShaderCachesharedShaderCache]programForKey:kCCShader_PositionTextureColor]

2、使用shader

[shaderProgram_ use]

3、决定使用哪些属性

ccGLEnableVertexAttribs(kCCVertexAttribFlag_PosColorTex )

4、为各个属性赋值，这些值将传入shader

// vertex

NSInteger diff =offsetof(ccV3F_C4B_T2F,vertices);

glVertexAttribPointer(kCCVertexAttrib_Position,3,GL_FLOAT, GL_FALSE,kQuadSize, (void*) (offset + diff));

// texCoods

diff = offsetof(ccV3F_C4B_T2F,texCoords);

glVertexAttribPointer(kCCVertexAttrib_TexCoords,2,GL_FLOAT, GL_FALSE,kQuadSize, (void*)(offset + diff));

// color

diff = offsetof(ccV3F_C4B_T2F,colors);

glVertexAttribPointer(kCCVertexAttrib_Color,4,GL_UNSIGNED_BYTE,GL_TRUE, kQuadSize, (void*)(offset + diff));

5、画出图形

glDrawArrays(GL_TRIANGLE_STRIP,0,4);

自定义的Shader

这方面的主要函数都被包装在CCGLProgram类中

1、初始化shaderProgram

self.shaderProgram = [[CCGLProgramalloc]initWithVertexShaderByteArray:ccPositionTextureColor_vertfragmentShaderByteArray:Mask_frag];

2、将shader中的属性变量与访问索引绑定起来

cocos2d提供的shader的绑定方法：

[shaderProgram_addAttribute:kCCAttributeNamePositionindex:kCCVertexAttrib_Position];

[shaderProgram_addAttribute:kCCAttributeNameColorindex:kCCVertexAttrib_Color];

[shaderProgram_addAttribute:kCCAttributeNameTexCoordindex:kCCVertexAttrib_TexCoords];

3、链接shaderProgram_

[shaderProgram_link];

4、将程序中与shader中的各个参数绑定起来

如果前面属性变量没有绑定，那么也可以通过以下方式绑定

_positionSlot = glGetAttribLocation(shaderProgram_->program_,, "a_Position");

将UniForms矩阵与shader中的矩阵绑定

[shaderProgram_updateUniforms];

自定义Shader变量的获取方法：

_maskLocation = glGetUniformLocation(shaderProgram_->program_,"u_mask");

5、使用Shader

[shaderProgram_use];

6、设置传入shader中的参数

//投影矩阵

[shaderProgram_setUniformForModelViewProjectionMatrix];

//属性参数

glVertexAttribPointer(kCCVertexAttrib_Position,3,GL_FLOAT, GL_FALSE,kQuadSize, (void*) (offset + diff));

//自定义参数

[shaderProgram_setUniformLocation:_maskLocationwithI1:1];

7、画图

glDrawArrays(GL_TRIANGLE_STRIP,0,4);