//self defined effect author:ljw
CCEffect %{
techniques:
- name: stroke
passes:
- vert: 2dvs:vert # builtin header
frag: 2dfs:frag
blendState:
targets:
- blend: true
blendSrc: src_alpha
blendDst: one_minus_src_alpha
blendDstAlpha: one_minus_src_alpha
properties: &props
mainColor: { value: [1, 1, 1, 1], editor: { type: color } }
strokeColor: {value: [1, 1, 1, 1] , editor: { type: color }}
fillColor: {value: [1, 0, 0, 1], editor: { type: color }}
strokeWidth: { value: 0.01}
- name: stroke-drawShadow
passes:
- vert: 2dvs:vert # builtin header
frag: 2dfs-shadow:frag
blendState:
targets:
- blend: true
blendSrc: src_alpha
blendDst: one_minus_src_alpha
blendDstAlpha: one_minus_src_alpha
properties: &props
mainColor: { value: [1, 1, 1, 1], editor: { type: color } }
strokeColor: {value: [1, 1, 1, 1] , editor: { type: color }}
fillColor: {value: [1, 0, 0, 1], editor: { type: color }}
shaowColor: { value: [0,0,1,1], editor: { type: color }}
strokeWidth: { value: 0.01}
shadowWidth: {value: 0.02}
}%
CCProgram 2dvs {
precision highp float;
#include <cc-global>
#if USE_LOCAL
#include <cc-local>
#endif
#if SAMPLE_FROM_RT
#include <common>
#endif
in vec3 a_position;
in vec2 a_texCoord;
in vec4 a_color;
out vec4 color;
out vec2 uv0;
vec4 vert () {
vec4 pos = vec4(a_position, 1);
#if USE_LOCAL
pos = cc_matWorld * pos;
#endif
#if USE_PIXEL_ALIGNMENT
pos = cc_matView * pos;
pos.xyz = floor(pos.xyz);
pos = cc_matProj * pos;
#else
pos = cc_matViewProj * pos;
#endif
uv0 = a_texCoord;
#if SAMPLE_FROM_RT
CC_HANDLE_RT_SAMPLE_FLIP(uv0);
#endif
color = a_color;
return pos;
}
}
CCProgram 2dfs %{
precision highp float;
#include
#include
in vec2 uv0;
uniform Constant {
vec4 mainColor;
vec4 strokeColor;
vec4 fillColor;
float strokeWidth;
};
vec4 drawEdgeStroke(){
float alphaThreshold = 0.3;
vec4 col1 = texture(cc_spriteTexture, uv0);
if(col1.a>alphaThreshold) return fillColor;
else {
vec4 col2 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,0.));
vec4 col3 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,0.));
vec4 col4 = texture(cc_spriteTexture, uv0+vec2(0.,strokeWidth));
vec4 col5 = texture(cc_spriteTexture, uv0+vec2(0.,-strokeWidth));
vec4 col6 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,strokeWidth));
vec4 col7 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,-strokeWidth));
vec4 col8 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,strokeWidth));
vec4 col9 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,-strokeWidth));
if(col2.a>alphaThreshold||col3.a>alphaThreshold||col4.a>alphaThreshold||col5.a>alphaThreshold
||col6.a>alphaThreshold||col7.a>alphaThreshold||col8.a>alphaThreshold||col9.a>alphaThreshold) return strokeColor;
else discard;
}
}
vec4 frag () {
vec4 col = drawEdgeStroke();
return CCFragOutput(col);
}
}%
CCProgram 2dfs-shadow %{
precision highp float;
#include
#include
in vec2 uv0;
uniform Constant {
vec4 mainColor;
vec4 strokeColor;
vec4 fillColor;
vec4 shaowColor;
float strokeWidth;
float shadowWidth;
};
vec4 drawEdgeStroke(){
float alphaThreshold = 0.3;
vec4 col1 = texture(cc_spriteTexture, uv0);
if(col1.a>alphaThreshold) return fillColor;//文字 正常渲染
else {
//上下左右偏移 strokeWidth个长度后的坐标
vec4 col2 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,0.));
vec4 col3 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,0.));
vec4 col4 = texture(cc_spriteTexture, uv0+vec2(0.,strokeWidth));
vec4 col5 = texture(cc_spriteTexture, uv0+vec2(0.,-strokeWidth));
vec4 col6 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,strokeWidth));
vec4 col7 = texture(cc_spriteTexture, uv0+vec2(strokeWidth,-strokeWidth));
vec4 col8 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,strokeWidth));
vec4 col9 = texture(cc_spriteTexture, uv0+vec2(-strokeWidth,-strokeWidth));
// 下右偏移
vec4 col10 = texture(cc_spriteTexture,uv0+vec2(-shadowWidth));
if(col2.a>alphaThreshold||col3.a>alphaThreshold||col4.a>alphaThreshold||col5.a>alphaThreshold
||col6.a>alphaThreshold||col7.a>alphaThreshold||col8.a>alphaThreshold||col9.a>alphaThreshold) return strokeColor;
else if(col10.a>alphaThreshold){
return shaowColor;
}else discard;
}
}
vec4 frag () {
vec4 col = drawEdgeStroke();
return CCFragOutput(col);
}
}%
看这个效果用shader写了个脚本,感觉比插件可能方便点。版本是3.5