Filtro de convolução

Flash Player 9 e posterior, Adobe AIR 1.0 e posterior

A classe ConvolutionFilter pode ser usada para aplicar diversas transformações de imagem em objetos BitmapData e objetos de exibição, como desfoque, detecção de borda, nitidez, entalhe e bisel.

Conceitualmente, o filtro de convolução percorre cada pixel da imagem de origem e determina a cor final desse pixel usando o valor do pixel e dos pixels ao redor. Uma matriz, especificada como uma matriz de valores numéricos, indica até que ponto o valor de cada pixel ao redor afeta o valor resultante final.

Considere o tipo de matriz utilizado com mais frequência, que é uma matriz 3 x 3. A matriz inclui nove valores:

N    N    N 
N    P    N 
N    N    N

Quando o filtro de convolução é aplicado a um certo pixel, é considerado o valor de cor do pixel propriamente dito (“P” no exemplo), bem como os valores dos pixels ao redor (“N” no exemplo). No entanto, definindo valores na matriz, você especifica a prioridade de determinados pixels na imagem resultante.

Por exemplo, a matriz a seguir, que tem um filtro de convolução aplicado, deixará uma imagem exatamente como era:

0    0    0 
0    1    0 
0    0    0

A imagem não é alterada porque o valor do pixel original tem uma intensidade relativa igual a 1 para determinar a cor final do pixel, enquanto os valores dos pixels ao redor têm a intensidade relativa igual a 0 - suas cores não afetam a imagem final.

Similarmente, essa matriz fará com que os pixels de uma imagem mudem um pixel para a esquerda:

0    0    0 
0    0    1 
0    0    0

Observe que, nesse caso, o pixel propriamente dito não afeta o valor final do pixel exibido nesse local na imagem final; apenas o valor do pixel à direita é usado para determinar o valor resultante do pixel.

No ActionScript, você cria a matriz como uma combinação de uma ocorrência de Array que contém os valores e as duas propriedades que especificam o número de linhas e colunas da matriz. O exemplo a seguir carrega uma imagem e, quando o carregamento termina, aplica um filtro de convolução na imagem usando a matriz da listagem anterior:

// Load an image onto the Stage. 
var loader:Loader = new Loader(); 
var url:URLRequest = new URLRequest("http://www.helpexamples.com/flash/images/image1.jpg"); 
loader.load(url); 
this.addChild(loader); 
 
function applyFilter(event:MouseEvent):void 
{ 
    // Create the convolution matrix. 
    var matrix:Array = [0, 0, 0, 
                                     0, 0, 1, 
                                     0, 0, 0]; 
     
    var convolution:ConvolutionFilter = new ConvolutionFilter(); 
    convolution.matrixX = 3; 
    convolution.matrixY = 3; 
    convolution.matrix = matrix; 
    convolution.divisor = 1; 
     
    loader.filters = [convolution]; 
} 
 
loader.addEventListener(MouseEvent.CLICK, applyFilter);

O que não fica óbvio nesse código é o efeito do uso de valores diferentes de 1 ou 0 na matriz. Por exemplo, a mesma matriz, com o número 8 em vez de 1 na posição direita, executa a mesma ação (movimentando os pixels para a esquerda). Além disso, ela afeta as cores da imagem, deixando-as oito vezes mais brilhantes. Isso ocorre porque os valores finais de cor do pixel são calculados pela multiplicação dos valores da matriz pelas cores do pixel original, pela soma dos valores e pela divisão pelo valor da propriedade divisor do filtro. Observe que, no código de exemplo, a propriedade divisor é definida como 1. Como regra geral, se desejar que o brilho das cores permaneça quase igual ao brilho da imagem original, o divisor deve ser igual à soma dos valores da matriz. Desse modo, se uma matriz tiver a soma de seus valores igual a 8 e o divisor igual a 1, a imagem resultante será aproximadamente 8 vezes mais brilhante do que a imagem original.

Embora o efeito nessa matriz não seja muito notável, outros valores de matriz podem ser usados para criar diversos efeitos. Veja alguns conjuntos padrão de valores de matriz para diferentes efeitos usando uma matriz 3 x 3:

  • Desfoque básico (divisor 5):

         0 1 0 
         1 1 1 
         0 1 0
  • Nitidez (divisor 1):

         0, -1, 0 
        -1, 5, -1 
         0, -1, 0
  • Detecção de borda (divisor 1):

         0, -1, 0 
        -1, 4, -1 
         0, -1, 0
  • Efeito de entalhe (divisor 1):

        -2, -1, 0 
        -1, 1, 1 
         0, 1, 2

    Observe que na maioria desses efeitos o divisor é igual a 1. Isso ocorre porque a adição de valores de matriz negativos a valores de matriz positivos resulta em 1 (ou 0 no caso da detecção de borda, mas o valor da propriedade divisor não pode ser 0).