rgba 取值指北

这是一个比较奇葩的需求，但我确实遇到了。

直接取最终显色, 因为有透明度属性和背景色叠加，获取的rgb并不是原来的rgb，a的值更是无从确定。

如果是参照网页，最推荐的方法当然是开发者工具，直接找它到相关属性就 ok

但也有参照对象非网页的情况，这篇文章主要解决这个问题。

首先要知道透明的颜色下，我们看到的最终颜色，由什么决定

经过测试

rgba，一个像素点最终的 rgb 值，由透明层 rgb 参数和其下方的背景色 rgb 按 a : 1-a 的比例叠加形成

比如：假设背景色参数为( r1, g1, b1), 透明层取色为 ( r2, g2, b2, a)，那么

最终显色按如下公式计算

r = r1 * (1 - a) + r2 * a
g = g1 * (1 - a) + g2 * a
b = b1 * (1 - a) + b2 * a

我们先来看一下为了知道 rgba，我们都需要什么信息

首先， rgb 三通道等价互不影响，这意味着只要求一个通道 r 的参数，g 跟 b 同理可得，因此问题可简化为：

假设背景色 r1，透明参数 ( r2，a)，显色为 r，f 为以上公式

首先明确一点，整个透明层的颜色必须是一致的（也就是：非渐变）。在此假设下，才有以下方法

如果你可以改变背景

这意味着 r1 可控，那么改变背景，在一个点上取两次值，根据

r = f(r1, r2, a)

r 和 r1 总是知道，两个方程，两个未知数，可以简单反推 r2 和 a

如果你可以改变透明度

跟方法一类似，只要在一个点上取两次透明度，根据

r = f(r1, r2, a)

r 和 a 总是知道，两个方程，两个未知数，可以算出 r1 和 r2

如果你知道这个背景加透明层和不加透明层分别是什么样

取两个点，以点 A 加透明层的颜色为 r，不加透明层的颜色为 r1 代入

r = f(r1, r2, a)

形成式1，点 B 同理形成式2

联立两者，我们得到了跟方法一一样的方程组，解之即可

注：有时候我们无法简单添加或去除透明层，但背景总是一样的。这时可以灵活变通，取透明层外，与透明层内相同背景的点

Galaxy Expedition - 我的博客