Hola!
Otro MicroArtículo. Esta vez vamos a ver cómo manipular los colores de una imagen utilizando la clase ColorMatrix. En concreto, el ejemplo que voy a mostrar es cómo pintar imágenes semitransparentes utilizando esta clase.
La clase ColorMatrix representa una matriz de transformación de colores. Los colores se representan mediante un vector (B,G,R,A,w) en su forma homogénea, en la que w siempre es igual a 1. (El resto del mundo lo representa como A,R,G,B,w). Por lo tanto, para transformar un color en otro, lo podemos multiplicar por una matriz 5×5.
Esta matriz contiene una serie de coeficientes que definen la transformación propiamente dicha. Si utilizamos la matriz identidad (una en la que todos los valores son 0 salvo la diagonal, cuyos valores son 1), modificando el valor que representa la opacidad – el canal alpha, o A en el vector) podremos dibujar una imagen semitransparente:
float[][] matrix = new float[][] { //B G R A w
new float[] {1.0f, 0.0f, 0.0f, 0.0f, 0.0f}, // B
new float[] {0.0f, 1.0f, 0.0f, 0.0f, 0.0f}, // G
new float[] {0.0f, 0.0f, 1.0f, 0.0f, 0.0f}, // R
new float[] {0.0f, 0.0f, 0.0f, opacidad, 0.0f}, // A
new float[] {0.0f, 0.0f, 0.0f, 0.0f, 1.0f} // w
};
En el caso en el que queramos aplicar una transformación a los colores, como puede ser por ejemplo el paso a escala de grises, donde el tono de gris viene dado por lo siguiente:
R' = G' = B' = 0.3 * R + 0.59 * G + 0.11 * B
A = 1
La matriz de transformación será la siguiente:
float[][] matrix = new float[][] { // B G R A w
new float[] {0.11f, 0.11f, 0.11f, 0.0f, 0.0f}, // B
new float[] {0.59f, 0.59f, 0.59f, 0.0f, 0.0f}, // G
new float[] { 0.3f, 0.3f, 0.3f, 0.0f, 0.0f}, // R
new float[] { 0.0f, 0.0f, 0.0f, 1.0f, 0.0f}, // A
new float[] { 0.0f, 0.0f, 0.0f, 0.0f, 1.0f} // w
};
Bueno… Pues nada más por hoy. Tenéis en el código adjunto un control que hace estas dos transformaciones, para que jugar un poco con ellas. Una aclaración: En el formulario del proyecto de prueba he puesto el color de fondo del control a Rojo, para que se vea más claramente que se está pintando semitransparente, ok? No es que esté dejando el canal rojo a 1 😉
Muyyy buen articulo amigo… al principio no entendi bien como funcionaba, pero ya con el codigo de ejemplo todo fue mas claro
Me parece excelente esta manera de trasnformar una imagen a escala de grices, pero luego que esta transformada como se puede obtener esta imagen en escala de grices para trabajarla? Me explico, como la almaceno en otra variable del tipo Bitmap o Image. Gracias de antemano. Saludos