标签：style blog http color com width
一直想要一个Flash 那种形状渐变效果，这两天苦思冥想了一番实现了，先看效果。
一开始是往把贴图alpha通道识别成路径，建模想办法拉顶点的方向去，想来想去不是个好办法，后来还是决定直接基于位图实现，尽量采用gpu可以处理的方式。
然后往这边思考后，脑子里就浮现出了ditance field 这个概念，alpha表达的还是颜色，直接插值alpha会呈现出颜色渐变的结果。
而distance field 反映的是离边的远近，插值他就会呈现出每个像素离边的距离的变化。
确定方案后就是实现了。
我采用的方案是把原图的alpha通道替换掉，存成距离。这个过程比较慢，要提前进行。
这个步骤的代码如下：
主要是将每个alpha值替换为离边的距离，在形状内>128,离边越远越大，在形状外<128,离边越远越小
然后在使用的时候就完全可以gpu来解决了，对unity来说，写个shader就可以了
普通的diffuseshader，在输出alpha值的地方改一下就可以了，每个alpha的值设计是>128 就是不透明，否则就是透明。
shader代码就这么一句
c.a =step(stepvalue,c.a);
我们设置的是128，对shader来说 就是 stepvalue 取0.5;
stepvalue 也是可以修改的，stepvalue变小就会呈现出膨胀的效果，如上面的效果。
渐变什么的就是插值，那就没啥要讲的了
任意两张带透明图像的一种形状过渡效果,布布扣,bubuko.com
标签：style blog http color com width
原文地址：http://www.cnblogs.com/crazylights/p/3782565.html
