兩個RGB的顏色半透明混色演算法
阿新 • • 發佈:2019-01-04
各點畫素的RGB值是按一定比例混合而成的,這個比例由Alpha值決定,具體算式見下:
Alpha = 0 ~ 100
R = ( R1 * (100 - Alpha) + R2 * Alpha ) / 100
G = ( G1 * (100 - Alpha) + G2 * Alpha ) / 100
B = ( B1 * (100 - Alpha) + B2 * Alpha ) / 100
示例:
RGB1 ( 232, 54, 13 )
RGB2 ( 94, 186, 233 )
Alpha = 30
R = ( 232 * 70 + 94 * 30 ) / 100 = 190.6 -> 190
G = ( 54 * 70 + 186 * 30 ) / 100 = 93.6 -> 93
B = ( 13 * 70 + 233 * 30 ) / 100 = 79
Alpha = 50
R = ( 232 * 50 + 94 * 50 ) / 100 = 163
G = ( 54 * 50 + 186 * 50 ) / 100 = 120
B = ( 13 * 50 + 233 * 50 ) / 100 = 123
這樣在Java中可以對以上計算方法封裝成函式或類,以方便程式碼複用,對應的Java程式碼如下:
32位色下的顏色混合
R = R1 * Alpha1 + R2 * Alpha2 * (1-Alpha1)
G = G1 * Alpha1 + G2 * Alpha2 * (1-Alpha1)
B = B1 * Alpha1 + B2 * Alpha2 * (1-Alpha1)
Alpha = 1 - (1 - Alpha1) * ( 1 - Alpha2)
R = R / Alpha
G = G / Alpha
B = B / Alpha
R1、G1、B1、Alpha1指上層的顏色值
R2、G2、B2、Alpha2指下層的顏色值
R、G、B、Alpha指合併後的顏色
Alpha = 0 ~ 100
R = ( R1 * (100 - Alpha) + R2 * Alpha ) / 100
G = ( G1 * (100 - Alpha) + G2 * Alpha ) / 100
B = ( B1 * (100 - Alpha) + B2 * Alpha ) / 100
示例:
RGB1 ( 232, 54, 13 )
RGB2 ( 94, 186, 233 )
Alpha = 30
R = ( 232 * 70 + 94 * 30 ) / 100 = 190.6 -> 190
G = ( 54 * 70 + 186 * 30 ) / 100 = 93.6 -> 93
B = ( 13 * 70 + 233 * 30 ) / 100 = 79
Alpha = 50
R = ( 232 * 50 + 94 * 50 ) / 100 = 163
G = ( 54 * 50 + 186 * 50 ) / 100 = 120
B = ( 13 * 50 + 233 * 50 ) / 100 = 123
這樣在Java中可以對以上計算方法封裝成函式或類,以方便程式碼複用,對應的Java程式碼如下:
- protected
- {
- if (alpha < MIN_ALPHA)
- alpha = MIN_ALPHA;
- else if (alpha > MAX_ALPHA)
- alpha = MAX_ALPHA;
- int R = (c1.getRed() * (MAX_ALPHA - alpha) + c2.getRed() * alpha) / MAX_ALPHA;
- int G = (c1.getGreen() * (MAX_ALPHA - alpha) + c2.getGreen() * alpha) / MAX_ALPHA;
- int B = (c1.getBlue() * (MAX_ALPHA - alpha) + c2.getBlue() * alpha) / MAX_ALPHA;
- return new Color(R, G, B);
- }
32位色下的顏色混合
R = R1 * Alpha1 + R2 * Alpha2 * (1-Alpha1)
G = G1 * Alpha1 + G2 * Alpha2 * (1-Alpha1)
B = B1 * Alpha1 + B2 * Alpha2 * (1-Alpha1)
Alpha = 1 - (1 - Alpha1) * ( 1 - Alpha2)
R = R / Alpha
G = G / Alpha
B = B / Alpha
R1、G1、B1、Alpha1指上層的顏色值
R2、G2、B2、Alpha2指下層的顏色值
R、G、B、Alpha指合併後的顏色