像素叠加实现图片的半透明混合

　2010-10-15 09:07:51　来源：Web开发网　闂傚倷绶氬ḿ褍螞閹绢喖绠柨鐕傛嫹

闂傚倷绀侀幉锟犲垂閻㈠灚宕查柟鎵閸庡秵銇勯幒鎴濃偓鐢稿磻閹炬枼妲堟繛鍡楃С濞岊亞绱撻崒姘扁枌闁瑰嚖鎷�

婵犵數濮幏鍐川椤撴繄鎹曢梻渚€娼уú銈吤洪妸鈺佺劦妞ゆ帊鑳堕埊鏇㈡煏閸モ晛浠х紒杈╁仱閺佹捇鏁撻敓锟�闂傚倷绶氬ḿ褍螞閹绢喖绠柨鐕傛嫹　　闂傚倷鑳舵灙缂佺粯顨呴埢宥夊即閵忕姵鐎梺缁樺姈椤愮厧鈽夊Ο閿嬬€婚梺褰掑亰閸撴稑鈻斿鑸碘拺闁告稑饪村▓鏃€绻涚仦鍌氬闁崇粯鎹囬獮瀣攽閹邦剚顔傛俊鐐€栧濠氬储瑜忛幉鎾晸閿燂拷

核心提示：半透明的混合效果经常在游戏里看到，效果那叫一个好，像素叠加实现图片的半透明混合，有天好奇心起，想琢磨一下这种效果是怎么实现的，未作优化：/**//** alpha mix demo*/inline COLORREF AlphaPixel(UINT alpha, COLORREF clr1, COLORREF clr2)

半透明的混合效果经常在游戏里看到，效果那叫一个好。有天好奇心起，想琢磨一下这种效果是怎么实现的。可是自己没学过数字图像处理和图形学，于是只好凭直觉猜测了。

按照生活经验，将两个胶片叠在一起时会有半透明效果，于是设想：从位图A和B中对应位置各取一点Pa、Pb，分别求取Pa和Pb的RGB三个分量，并将对应分量求均值后拼装成一个新的颜色，这样就是透明度为一半的混合效果了。按这个思路试了试，发现运气真好。

实现RGB拼装的函数很简单，此处仅说明原理，未作优化：

/**//* 　* alpha mix demo */ inline COLORREF AlphaPixel(UINT alpha, COLORREF clr1, COLORREF clr2) { 　　　 double k = (double)alpha / 256.0; 　　　 double reverse_k = 1.0 - k; 　　　 BYTE r = BYTE( GetRValue(clr2) * k + GetRValue(clr1) * reverse_k ); 　　　 BYTE g = BYTE( GetGValue(clr2) * k + GetGValue(clr1) * reverse_k ); 　　　 BYTE b = BYTE( GetBValue(clr2) * k + GetBValue(clr1) * reverse_k ); 　　　 return RGB(r, g, b); }

细心的读者从上面代码可以发现，随着alpha参数由0-255的变化，混合效果可以实现全透明--不透明的渐变。依据上述函数实现的半透明混合效果截图：