Erase an image using your mouse in AS3
I recently had to create a simple Flash application that allowed the user to ‘erase’ an image using their mouse. I couldn’t find any examples of the exact effect I wanted, so I cobbled together my own. The effect I came up with is similar to using the eraser tool in Photoshop.
Demo
Click and drag your mouse on the image below to erase it. Press the reset button to start over.
Download
Download FLA (includes code comments explaining how everything works)
Credits
My effect is based on the masking techniques shared by surferboy in an Ultrashock forum discussion and a Flash & Math tutorial explaining how to use Flash’s drawing API to draw using the mouse.
The gorgeous photographs used in this demo are by wabberjocky and ex.libris and are available under a Creative Commons license.
Tweet
Good one. congrats!
So so cool!! Really love it!!!
Thanks for sharing.
How to mask a bee picture in masked image? help me please
how can i use separate erase tool, i can use mouse for drawing but i can’t use erase tool
Very simple and elegant solution. I know this may be a shot in the dark but how can I detect when the Unmask is complete? I want to make a graphic appear when the user finish erasing the image on top. I declare the image invisible at the top of the script and I have a function to make it visible but I just don’t know what method to use to detect that the image below shows completely.
@Edu Sorry, I haven’t worked with Flash for a couple of years.
Me neither! lol Thanks anyways.