【quick-cocos2d-x】灰化效果

概述http://cn.cocos2d-x.org/tutorial/show?id=1976   先上效果图：   参考：Cocos2d-x让精灵图像变灰的方法 借鉴了Cocos2d-x 让精灵图像变灰的方法的方法。 但这个方法在Quick-Cocos（下面简称QC）3.2下不能完美实现变灰效果－变灰了的对象的位置会跳到屏幕右上角。 百思不得其解，搜一下有没有人发现这个问题，果然有： 关于Sprit

http://cn.cocos2d-x.org/tutorial/show?id=1976

先上效果图：

650) this.wIDth=650;" title="1417412520285069.jpg" alt="wKiom1Rqqo7jT37vAAB8uJUMC70224.jpg" src="http://img.jb51.cc/vcimg/static/loading.png" src="http://API.cocoachina.com/uploads/20141201/1417412520285069.jpg">

参考：Cocos2d-x让精灵图像变灰的方法

借鉴了Cocos2d-x 让精灵图像变灰的方法的方法。

但这个方法在Quick-Cocos（下面简称QC）3.2下不能完美实现变灰效果－变灰了的对象的位置会跳到屏幕右上角。
百思不得其解，搜一下有没有人发现这个问题，果然有：
关于Sprite的setShaderProgram后坐标改变的问题
发现4楼的仁兄的回复有亮点：
如何在Cocos2d-x 3.0中使用opengl shader？
点进去一看，内容是这样的：

“坐标变化的解决了，将附件gray.vsh 中的CC_MVPMatrix 改为 CC_PMatrix 即可 ”

我估计应该是位置转换的矩阵问题吧，gray.vsh是什么下面会说到。

经过分析，发现原因在addGray方法（）的27行：

pProgram->initWithVertexShaderByteArray(ccPositionTextureColor_vert,pszFragSource);

ccPositionTextureColor_vert是什么呢？它存放在cocos/renderer下，名为ccShader_PositionTextureColor.vert。它的作用是……以在下的理解，是一个shader方法(ccShader)，关于位置、材质与颜色的（PositionTextureColor）且是针对顶点的（.vert）。
它的内容是：

ccShader_PositionTextureColor.vert

const char* ccPositionTextureColor_vert = STRINGIFY(attribute vec4 a_position;attribute vec2 a_texCoord;attribute vec4 a_color;\n#ifdef GL_ES\nvarying lowp vec4 v_fragmentColor;varying mediump vec2 v_texCoord;\n#else\nvarying vec4 v_fragmentColor;varying vec2 v_texCoord;\n#endif\nvoid main(){  gl_Position = CC_MVPMatrix * a_position;  v_fragmentColor = a_color;  v_texCoord = a_texCoord;});

咦，发现有一个熟悉的面孔－“CC_MVPMatrix”。其实上面说到的gray.vsh的内容就是ccShader_PositionTextureColor.vert大括号括住的部分。那我将ccShader_PositionTextureColor.vert的CC_MVPMatrix改为CC_PMatrix是否就能解决灰化后对象的位置问题呢？答案是否定的，这样改会影响其他对象（例如文本）的定位。
那我再定义一个GLchar传到pProgram->initWithVertexShaderByteArray的第一个参数不就得咯？

const GLchar* pszVertSource =   "attribute vec4 a_position; \n \ attribute vec2 a_texCoord; \n \ attribute vec4 a_color; \n \ \n#ifdef GL_ES\n \n \ varying lowp vec4 v_fragmentColor; \n \ varying mediump vec2 v_texCoord; \n \ \n#else\n \n \ varying vec4 v_fragmentColor; \n \ varying vec2 v_texCoord; \n \ \n#endif\n \n \ void main() \n \ { \n \   gl_Position = CC_PMatrix * a_position; \n \   v_fragmentColor = a_color; \n \   v_texCoord = a_texCoord; \n \ }"; pProgram->initWithVertexShaderByteArray(pszVertSource,'Microsoft YaHei';font-size:14px;">经实践证实是可行的。其实有个更简单的方法，就是：
  
pProgram->initWithVertexShaderByteArray(ccPositionTextureColor_noMVP_vert,'Microsoft YaHei';font-size:14px;">原来cocos/renderer下有个文件叫ccShader_PositionTextureColor_noMVP.vert，我是怎么发现的，各位脑补一下。
  
最后附上实现灰化功能的全部代码。
 
C++部分，将此方法导出给lua用：
 
CUtil.cpp 
 
void setGray(Node *node){ USING_NS_CC; do {  const GLchar* pszFragSource =      "#ifdef GL_ES \n \     precision mediump float; \n \     #endif \n \     uniform sampler2D u_texture; \n \     varying vec2 v_texCoord; \n \     varying vec4 v_fragmentColor; \n \     void main(void) \n \     { \n \     // Convert to greyscale using NTSC weightings \n \     vec4 col = texture2D(u_texture,v_texCoord); \n \     float grey = dot(col.rgb,vec3(0.299,0.587,0.114)); \n \     gl_FragColor = vec4(grey,grey,col.a); \n \     }";     GLProgram* pProgram = new GLProgram();  pProgram->initWithByteArrays(ccPositionTextureColor_noMVP_vert,pszFragSource);  node->setGLProgram();  CHECK_GL_ERROR_DEBUG(); }while(0);}
 
lua部分：
 
DisplayUtil.lua 
 
--不进行灰化的对象特有的方法DisplayUtil.LIST_DONT_GRAY = {  "getSprite",--ProgressTimer  "setString",--Label}--判断能否灰化function DisplayUtil.canGray(node)  for i,v in ipairs(DisplayUtil.LIST_DONT_GRAY) do    if node[v] then      return false    end  end  return trueend--灰化对象function DisplayUtil.setGray(node,v)  if type(node) ~= "userdata" then    printError("node must be a userdata")    return  end  if v == nil then    v = true  end  if not node.__isGray__ then    node.__isGray__ = false  end  if v == node.__isGray__ then    return  end  if v then    if DisplayUtil.canGray(node) then    --调用C++的setGray方法      setGray(tolua.cast(node,"cocos2d::Node"))      --      -- local glProgram = node:getGLProgram()      -- node:setGLProgram(glProgram)      -- node:getGLProgram():bindAttribLocation(cc.ATTRIBUTE_NAME_POSITION,cc.VERTEX_ATTRIB_POSITION)      -- node:getGLProgram():bindAttribLocation(cc.ATTRIBUTE_NAME_COLOR,cc.VERTEX_ATTRIB_COLOR)      -- node:getGLProgram():bindAttribLocation(cc.ATTRIBUTE_NAME_TEX_COORD,cc.VERTEX_ATTRIB_TEX_COORDS)      --不知道为什么下面2行一定要写      node:getGLProgram():link()      node:getGLProgram():updateUniforms()    end    --children    local children = node:getChildren()    if children and table.nums(children) > 0 then      --遍历子对象设置      for i,v in ipairs(children) do        if DisplayUtil.canGray(v) then          DisplayUtil.setGray(v)        end      end    end  else    DisplayUtil.removeGray(node)  end  node.__isGray__ = vend--取消灰化function DisplayUtil.removeGray(node)  if type(node) ~= "userdata" then    printError("node must be a userdata")    return  end  if not node.__isGray__ then    return  end  if DisplayUtil.canGray(node) then    local glProgram = cc.GLProgramCache:getInstance():getGLProgram(      "ShaderPositionTextureColor_noMVP")    node:setGLProgram(glProgram)    -- glProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_POSITION,cc.VERTEX_ATTRIB_POSITION)    -- glProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_COLOR,cc.VERTEX_ATTRIB_COLOR)    -- glProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_TEX_COORD,cc.VERTEX_ATTRIB_TEX_COORDS)    --不知道为什么下面2行不能写，写了会出问题    -- glProgram:link()    -- glProgram:updateUniforms()  end  --children  local children = node:getChildren()  if children and table.nums(children) > 0 then    --遍历子对象设置    for i,v in ipairs(children) do      if DisplayUtil.canGray(v) then        DisplayUtil.removeGray(v)      end    end  end  node.__isGray__ = falseend
 
怎么使用不用我多说了吧。
 
来源网址：http://evamango-blog.logdown.com/posts/243059-quick-cocos-32-methods-to-make-object-gray
          总结       
以上是内存溢出为你收集整理的【quick-cocos2d-x】灰化效果全部内容，希望文章能够帮你解决【quick-cocos2d-x】灰化效果所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。
					
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: http://outofmemory.cn/web/1017827.html