我写过一个类似的，cocos2dx的，你可以参考下改改，
function TestMenuShaderLayer:on2dBallPercent(parent)
local sp = cc.Sprite:create(“Images/page_01.png”)
parent:addChild(sp)
sp:setScale(2)
sp:setPosition(cc.p(display.cx,display.cy))
local width = 800
local height = 800
local renderTexture = cc.RenderTexture:create(width, height,cc.TEXTURE2_D_PIXEL_FORMAT_RGB_A8888,gl.DEPTH24_STENCIL8_OES)
renderTexture:clear(0,0,0,0);
renderTexture:setClearColor(cc.c4f(0, 0, 0, 0))
renderTexture:setClearFlags(GL_COLOR_BUFFER_BIT)
renderTexture:setPosition(cc.p(display.cx,display.cy))
parent:addChild(renderTexture,1)
local sp = renderTexture:getSprite()
sp:setBlendFunc(cc.blendFunc(gl.ONE,gl.ONE_MINUS_SRC_ALPHA))
local vertDefaultSource = [[
attribute vec4 a_position;
attribute vec2 a_texCoord;
attribute vec4 a_color;
#ifdef GL_ES
varying lowp vec4 v_fragmentColor;
varying mediump vec2 v_texCoord;
#else
varying vec4 v_fragmentColor;
varying vec2 v_texCoord;
#endif
void main()
{
gl_Position = CC_PMatrix * a_position;
v_fragmentColor = a_color;
v_texCoord = a_texCoord;
}
]]
local pszFragSource = [[
#ifdef GL_ES
precision mediump float;
#endif
varying vec4 v_fragmentColor;
varying vec2 v_texCoord;
uniform vec2 resolution;
uniform float percent;
#define PI 3.14
#define step(b, a) smoothstep(a, a - (fwidth(b) * 2.0), b)
void main()
{
//修正x方向坐标位置
float factor = resolution.x/resolution.y;
vec2 uv = (2.0 * v_texCoord - vec2(1.0)) * 1.5;
uv.x *= factor;
float
sdf=length(uv),c=step(sdf,.85),
vB=smoothstep(.1,.9,sin(uv.x+(PI*.5))-.3),
vBA=vB*sin(CC_Time[1]*4.)*.1,
fW=(sin(((CC_Time[1]*2.)+uv.x)*2.)*.05)+vBA,
bW=(sin(((CC_Time[1]*-2.)+uv.x)*2.+PI)*.05)-vBA,
fA=(sin(CC_Time[1]*4.)*.05)*vB,
fV=mix(-.2,((percent)-.5)*2.,1.0),
fP=fV+(sin((CC_Time[1])*PI)*.1),
fF=step(uv.y,(fA+fW)+fP)*c,
bF=step(uv.y,(-fA+bW)+fP)*c;
vec4 color = vec4((step(sdf,1.)-step(sdf,.9))+
(fF+(clamp(bF-fF,0.,1.)*.8))+
clamp(pow((sdf+.01)*
((1.-(fF+bF))*c),5.),0.,1.));
color *= vec4(0.0,0.0,1.0,1.0);
gl_FragColor = color;
}
]]
local pProgram = cc.GLProgram:createWithByteArrays(vertDefaultSource,pszFragSource)
pProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_POSITION,cc.VERTEX_ATTRIB_POSITION)
pProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_COLOR,cc.VERTEX_ATTRIB_COLOR)
pProgram:bindAttribLocation(cc.ATTRIBUTE_NAME_TEX_COORD,cc.VERTEX_ATTRIB_FLAG_TEX_COORDS)
pProgram:link()
pProgram:updateUniforms()
local programState = cc.GLProgramState:create(pProgram)
programState:setUniformVec2("resolution",cc.p(width,height))
programState:setUniformFloat("percent",0.5)
sp:setGLProgramState(programState)
local sliderEvent = function(sender, eventType)
if eventType == ccui.SliderEventType.percentChanged then
local percent = sender:getPercent()
percent = percent / 100
print("percent----",percent)
programState:setUniformFloat("percent",percent)
end
end
local slider = ccui.Slider:create()
slider:setTag(1)
slider:setTouchEnabled(true)
slider:loadBarTexture("Images/sliderTrack.png")
slider:loadSlidBallTextures("Images/sliderThumb.png", "Images/sliderThumb.png", "")
slider:loadProgressBarTexture("Images/sliderProgress.png")
slider:setPosition(cc.p(display.cx,100))
slider:setPercent(0)
slider:addEventListenerSlider(sliderEvent)
parent:addChild(slider)
slider:setScale(5)
end
shader 写个弧度 然后弄个椭圆盖在上面 设置对应颜色高亮
，我2.x也遇到这种问题了,怎么解决啊
不如来学 shader 自己画一个：
好巧 刚实现这个