This content has been marked as final. Show 4 replies
By this I mean, changing the image colors so that it looks like a semi-transparent canvas with a blue background has been placed on top.
So then how about placing a semi-transparent canvas with a blue background on top of the image? ;-)
Literally, that's what you can do. Create a Canvas, give a a blue background colour, make it semi-transparent, and then position over the image. Something like:
var blue: Canvas = new Canvas();
blue.setStyle("backgroundColor", 0x0000ff); //Make it blue
blue.alpha = 0.5; //Make it 50% transparent
myapp.addChild(blue); //Add it to the same container holding your image
//Position and size the canvas as needed
You can also get low-level and play with the colour data of the image, but it's not really worth the hassle.
Yeah, I tried that and got it to work but I want to be able to click on the image and so when the canvas is on top, it stops the events firing for the image. Any sample code for modifing an image?
You can still use the Canvas solution if you set Canvas.mouseEnabled = false. This allows all mouse events to pass through the Canvas.
Otherwise, take a look at the "filters" property. All DisplayObjects support it, including the loader. I haven't used it myself, but the ColorMatrixFilter should be useful. Check the help.
Nice one, that works perfectly thanks. I missed the mouseEnabled property.