【Cocos2d-x】图片描边的一种比较好的shader实现方法

图片描边需求如下：

1. 可指定描边宽度 2. 可指定描边颜色3. 可用于字体

图片描边我所知道的方式有以下几种：

1. Cocos2d-x 3.x中，字体用FreeType库，字体描边可以用FreeType自带的描边功能，实际效果没测过，但只能用于字体。

2. 用RenderTexture，方法大概是把原图做一圈的偏移，渲染到同一张纹理上，他们相隔中心点的距离都是r，最后再把自己渲染到中间，核心代码大概这样：

 rt->begin();
 for(int i = 0; i < 360; i += 15)
 {
    float rad = CC_DEGREES_TO_RADIANS(i);
    m_label->setPosition(ccp(
    textureSize.width * 0.5f + sin(rad) * r,
    textureSize.height * 0.5f + cos(rad) * r));
    m_label->visit();
 }
 m_label->setColor(col);
 m_label->setBlendFunc(originalBlend);
 m_label->setPosition(ccp(textureSize.width * 0.5f, textureSize.height * 0.5f));
 m_label->visit();
 rt->end();

这种方法可以作为一个比较好的解决方案，但是我认为这种方式在生成描边图片时，需要绘制多个图片，效率不是很好。

3. Cocos2d-x 3.x的ShaderTest有个描边的例子，是用shader实现的，不过那个程序有些不友好：描边宽度不是传像素进去，而是一个0~1的数字，是一个比例，就是说大的图片描边大，小的图片描边小，而且同一个图片不同位置的描边也宽窄不一（这在长比宽大很多的图片尤其明显），而且描边的颜色也深浅不一。

以下我分享一种我认为比较好的描边算法：

在片段着色器里面，对于每个像素：1. 如果它是不透明的像素，则不管，维持原本颜色；2. 如果透明，是360度判断它四周有没有不透明的像素，如果有，则把它设成描边颜色，否则保持透明。

我为代码加了比较详细的注释，希望大家能理解