image-processing - 如何在图像卷积过程中使用预乘来解决 alpha bleed 问题？

Question

我正在尝试将框模糊应用于透明图像，并且边缘周围出现“暗光晕”。

Jerry Huxtable has a short mention of the problem ，以及一个很好的演示，显示了问题的发生:



但是，对于我的一生，我无法理解“预乘 alpha”如何解决问题。现在举一个非常简单的例子。我有一个 3x3 图像，包含一个红色和一个绿色像素:



实际上，剩余的像素是透明的:



现在我们将对图像应用 3x3 框模糊。为简单起见，我们将只计算中心像素的新值。框模糊的工作方式是，由于我们有一个 9 位置的正方形(3x3，称为内核)，我们取内核中每个像素的 1/9，并将其相加:



所以

finalRed =   1/9 * red1 + 1/9 * red2 + 1/9 * red3+ ... + 1/9 * red9
finalGreen = 1/9*green1 + 1/9*green2 + 1/9*green3+ ... + 1/9*green9
finalBlue =  1/9* blue1 + 1/9* blue2 + 1/9* blue3+ ... + 1/9* blue9
finalAlpha = 1/9*alpha1 + 1/9*alpha2 + 1/9*alpha3+ ... + 1/9*alpha9

在这个非常简单的例子中，计算变得非常简单:

finalRed =   1/9 * 255
finalGreen = 1/9 * 255
finalBlue =  0
finalAlpha = 1/9*255 + 1/9*255

这给了我一个最终的颜色值:

finalRed =   28
finalGreen = 28
finalBlue =  0
finalAlpha = 56 (22.2%)

这个颜色太深了。当我在 Photoshop 中对同一个 3x3 像素图像执行 3px 框模糊时，我得到了我所期望的:



白色显示时更清晰:



实际上，我在包含透明文本的位图上执行框模糊，并且文本在边缘周围获得了明显的黑暗:



我从 PixelFormat32bppARGB 中的 GDI+ 位图开始格式

应用 3x3 卷积核时如何使用“预乘 alpha”？

任何答案都必须包括新的论坛，因为:

final = 1/9*(pixel1+pixel2+pixel3...+pixel9)

让我得到错误的答案。

编辑:一个更简单的例子是:

我将使用 0..1 范围内的颜色和 alpha 值执行此数学运算:



我要将框模糊卷积过滤器应用于中间像素:

ARGB'
      = 1/9 * (0,1,0,1) + 1/9 * (0,0,0,0) + 1/9 * (0,0,0,0) + 
        1/9 * (0,1,0,1) + 1/9 * (0,0,0,0) + 1/9 * (0,0,0,0) + 
        1/9 * (0,1,0,1) + 1/9 * (0,0,0,0) + 1/9 * (0,0,0,0);

      = (0, 0.11, 0, 0.11) + (0,0,0,0) + (0,0,0,0) +
        (0, 0.11, 0, 0.11) + (0,0,0,0) + (0,0,0,0) +
        (0, 0.11, 0, 0.11) + (0,0,0,0) + (0,0,0,0)

      = (0, 0.33, 0, 0.33)

这给出了相当透明的深绿色。



这不是我期望看到的。相比之下，Photoshop 的 Box Blur 是:



如果我假设 (0, 0.33, 0, 0.33)是预先乘以 alpha，然后将它相乘，我得到:

(0, 1, 0, 0.33)

这看起来适合我的全不透明示例；但是当我开始涉及部分透明像素时，我不知道该怎么办。

另见

Texture filtering: Alpha cutouts

Premultiplied alpha

Answer 1

tkerwin 有 already provided the correct answer ，但似乎还需要进一步解释。

您在问题中显示的数学是绝对正确的，直到最后。正是在那里，您错过了一个步骤 - 结果仍处于预乘 alpha 模式，并且必须“未乘”回 PixelFormat32bppARGB 格式。乘法的反面是除法，因此:

finalRed = finalRed * 255 / finalAlpha;
finalGreen = finalGreen * 255 / finalAlpha;
finalBlue = finalBlue * 255 / finalAlpha;

你已经表达了一个担忧，即鸿沟可能会产生一个严重超出范围的结果，但这不会发生。如果您跟踪数学，您会注意到由于预乘步骤，红色、绿色和蓝色值不能大于 alpha 值。如果您使用的是比简单框模糊更复杂的过滤器，那可能是一种可能性，但即使您没有使用 alpha，情况也是如此!正确的 react 是限制结果，将负数变为 0，将大于 255 的任何值变为 255。