ConvolutionFilter 類別可應用在廣泛的 BitmapData 物件或顯示物件的影像變形作業中,例如模糊化、邊緣偵測、銳利化、浮雕與斜角處理等。
在概念上,迴旋濾鏡會依序檢查來源影像中的每個像素,並依據該像素及其周圍像素的值,來決定該像素的最後顏色。被指定為數值陣列的矩陣,將指出每個特定的相鄰像素值影響最後結果值的程度。
以最常見的 3 x 3 矩陣類型做為考量範例。此矩陣包含 9 個數值:
N N N
N P N
N N N
將迴旋濾鏡套用至特定像素時,它會檢查像素本身的顏色值 (在此範例中為「P」),以及周圍像素的值 (在此範例中標示為「N」)。然而,當您在矩陣中設定這些值之後,等於指定了特定像素在影響結果影像上的優先順序。
例如,當您使用迴旋濾鏡來套用下列矩陣時,所產生的影像將與之前的影像一模一樣:
0 0 0
0 1 0
0 0 0
影像沒有出現任何變化的原因在於,原始像素值在決定最後像素顏色上具有 1 的相對強度,而周圍的像素值則具有 0 的相對強度,代表後者的顏色無法影響最後的影像。
同理,這個矩陣也會導致影像的像素向左偏移一個像素:
0 0 0
0 0 1
0 0 0
請注意,在此情況中,像素本身對該位置上所顯示的最後像素值沒有任何影響,而且只有用到右邊的像素值來決定像素的結果值。
在 ActionScript 中,您可以將矩陣建立為 Array 實體組合,內含一些用來指定矩陣列數與欄數的值與兩個屬性。下列範例將載入影像,並在影像完成載入時,使用先前列出的程式碼中的矩陣將迴旋濾鏡套用至影像中:
// 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);
如果在此程式碼中有些東西看不清楚,那是因為在矩陣中使用了 1 或 0 以外的值所產生的效果。例如,在相同的矩陣中,右邊位置上的 1 如果以 8 取代,還是會執行相同的動作 (但是會將像素向左偏移)。此外,這個數值還會影響影像的顏色,讓顏色增亮 8 倍。這是因為最終的像素顏色值是由矩陣值乘以原始像素顏色,然後將所有數值加總之後,再除以濾鏡的
divisor
屬性值而產生。請注意,在範例程式碼中,
divisor
屬性已設為 1。按常理來說,如果您想讓顏色亮度與原始影像的亮度保持一樣,應該將除數設為等於矩陣數值的總和。這樣一來,如果矩陣數值總和為 8,而除數為 1 的話,得出的影像亮度大約會比原始影像高出 8 倍之多。
雖然這個矩陣的效果並不明顯,還是可以使用其它的矩陣數值來建立不同的效果。下列是一些透過 3 x 3 矩陣來產生不同效果的標準矩陣數值組合:
-
基本模糊 (除數為 5):
0 1 0
1 1 1
0 1 0
-
銳利化 (除數為 1):
0, -1, 0
-1, 5, -1
0, -1, 0
-
邊緣偵測 (除數為 1):
0, -1, 0
-1, 4, -1
0, -1, 0
-
浮雕效果 (除數為 1):
-2, -1, 0
-1, 1, 1
0, 1, 2
請注意,在這些效果當中,大部分的除數都是 1。這是因為將負的矩陣值加入正的矩陣值會變成 1 (如果是邊緣偵測,則為 0,但其
divisor
屬性值不得為 0)。