图片和spine很容易黑边,1像素线条很容易断断续续。
解决方案:
1、图片和spine的图集不进行压缩
2、网络图片和网络spine的图集手动开启预乘
let texture = new Texture2D();
// 手动开启预乘 线性模式
texture.setFilters(Texture2D.Filter.LINEAR, Texture2D.Filter.LINEAR);
以上两个方案能解决80%黑边问题;
下面这个就是解决99%黑边问题,但是会有代价:半透明图片不适用、部分spine可能存在透明度过曝问题。原理就是通过【透明度累乘】降低边缘黑色至几乎不可见。
3、复制sprite和spine的默认shader,并添加一行代码
// Sprite的shader
vec4 frag () {
vec4 o = vec4(1, 1, 1, 1);
#if USE_TEXTURE
o *= CCSampleWithAlphaSeparated(cc_spriteTexture, uv0);
// 改动代码
o.a = o.a * o.a * o.a * o.a;
#if IS_GRAY
float gray = 0.2126 * o.r + 0.7152 * o.g + 0.0722 * o.b;
o.r = o.g = o.b = gray;
#endif
#endif
o *= color;
ALPHA_TEST(o);
return o;
}
// Spine的shader
vec4 frag () {
vec4 o = vec4(1, 1, 1, 1);
#if TWO_COLORED
vec4 texColor = vec4(1, 1, 1, 1);
texColor *= texture(cc_spriteTexture, uv0);
o.a = texColor.a * v_light.a;
o.rgb = ((texColor.a - 1.0) * v_dark.a + 1.0 - texColor.rgb) * v_dark.rgb + texColor.rgb * v_light.rgb;
#else
o *= texture(cc_spriteTexture, uv0);
o *= v_light;
#endif
// 改动代码
o.a = o.a * o.a * o.a * o.a;
ALPHA_TEST(o);
return o;
}
电脑、安卓手机、安卓平板、iOS手机、iOS平板上,相同的图片有的设备有黑边,有的设备没黑边。
到此为止,解决方案说完了,亲身经历被黑边折磨得体无完肤。
还是希望官方能出一个解决黑边毒瘤的方案,我这个太山寨了。。。