版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/lxt610/article/details/83505640
1、引言
在实际的开发过程中,我们有时可以看到同样的按钮,按钮图片在不同状态表现也不一样!我们需要考虑优化这种问题。就是相同的图片只做一张图就可以了,没有必要多做很多灰度图片。我们该怎么做呢?先卖一个关子,嘻嘻(#.#)
2、思路
上面我们已经发现问题了,猜想一下呗?好的,你没猜错。就是shader,通过一段代码,来改变图片的色值。班门弄斧了,废话少说我们直接上代码:
function setSpriteGray(sp,flag)
-- 默认vert
local vertShaderByteArray = "\n"..
"attribute vec4 a_position; \n" ..
"attribute vec2 a_texCoord; \n" ..
"attribute vec4 a_color; \n"..
"#ifdef GL_ES \n"..
"varying lowp vec4 v_fragmentColor;\n"..
"varying mediump vec2 v_texCoord;\n"..
"#else \n" ..
"varying vec4 v_fragmentColor; \n" ..
"varying vec2 v_texCoord; \n"..
"#endif \n"..
"void main() \n"..
"{\n" ..
"gl_Position = CC_PMatrix * a_position; \n"..
"v_fragmentColor = a_color;\n"..
"v_texCoord = a_texCoord;\n"..
"}"
-- 置灰frag
local flagShaderByteArray = "#ifdef GL_ES \n" ..
"precision mediump float; \n" ..
"#endif \n" ..
"varying vec4 v_fragmentColor; \n" ..
"varying vec2 v_texCoord; \n" ..
"void main(void) \n" ..
"{ \n" ..
"vec4 c = texture2D(CC_Texture0, v_texCoord); \n" ..
"gl_FragColor.xyz = vec3(0.4*c.r + 0.4*c.g +0.4*c.b); \n"..
"gl_FragColor.w = c.w; \n"..
"}"
-- 移除置灰frag
local pszRemoveGrayShader = "#ifdef GL_ES \n" ..
"precision mediump float; \n" ..
"#endif \n" ..
"varying vec4 v_fragmentColor; \n" ..
"varying vec2 v_texCoord; \n" ..
"void main(void) \n" ..
"{ \n" ..
"gl_FragColor = texture2D(CC_Texture0, v_texCoord); \n" ..
"}"
if flag then
local glProgram = cc.GLProgram:createWithByteArrays(vertShaderByteArray,flagShaderByteArray)
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_FLAG_TEX_COORDS)
glProgram:link()
glProgram:updateUniforms()
sp:getVirtualRenderer():getSprite():setGLProgram(glProgram)
else
local glProgram = cc.GLProgram:createWithByteArrays(vertShaderByteArray,pszRemoveGrayShader)
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_FLAG_TEX_COORDS)
glProgram:link()
glProgram:updateUniforms()
sp:getVirtualRenderer():getSprite():setGLProgram(glProgram)
end
end
3、使用
使用就很简单了,直接传入按钮或者图片纹理和是否置灰就可以了!
setSpriteGray(self.btnGoldReLive,not result.Data.Gold.Enable)
4、结束语
The End
好了,今天的分享就到这里,如有不足之处,还望大家及时指正,随时欢迎探讨交流!!!
喜欢的朋友们,请帮顶、点赞、评论!您的肯定是我写作的不竭动力!