传统的后乘alpha算法在shader或者混合配置中的代码如下:
blend(source, dest) = (source.rgb * source.a) + (dest.rgb * (1 – source.a))
经过预乘后的图片在shader或者混合配置中的代码如下:
blend(source, dest) = (source.rgb * 1) + (dest.rgb * (1 – source.a))
相当于预乘后的图片在进行混合渲染时就不需要再乘以图片的alpha值了,少了一层计算,可以略微提高渲染效率。
上述代码可以source就是当前要渲染的图片颜色,dest是目标图片颜色,也就是当前已经渲染在该位置的图片颜色,可以理解为是背景图的颜色。就相当于两个图片在同一个位置都有自己的颜色,如果两个图片都不透明,那么肯定是只显示上面的图片颜色,下面的被覆盖,如果图片未透明或者半透明,就需要有一个算法可以根据两个图片对应颜色的具体色值,来计算出混合后的最终颜色,也就是blend算法。传统算法是blend(source, dest) = (source.rgb * source.a) + (dest.rgb * (1 – source.a))
当前要渲染的颜色*当前颜色alpha值(alpha为0就是全透明,为1是完全不透明) + 背景颜色 * (1 - 当前颜色alpha值)。这是一种根据当前要渲染的颜色alpha值来线性的让两个颜色混合累加,当前颜色透明度越高,那么当前颜色对最终颜色的影响就越小。
cocos creator中sprite组件可以调整混合模式,如下图: