AS3 photoshop brushes

Question

Hi,

I'm searching for a way to build a photoshop like drawing tool in ActionScript 3. Especially I want to build something like the brushes in photoshop. So that you can use different PNG's as a brush.

I tried it with saving a brush in photoshop as a transparent png, import it into my AS3 project and with a mouse move event, draw the png everytime you move the mouse into a bitmapdata object. But that doesn't look like photoshop. Here's a example, first the photoshop drawing, then the as3 drawing:

In photoshop it looks very smooth, but in as3 you have that ugly corners and color shifts. Does anyone know a solution?

thx, tux

Answer 1

This is because Photshop "walks" the distance between the mouse coordinates and paints that too. So even if you're moving your mouse very fast between two points you will get a coherent line.

You're only drawing once per mouse update, so if the mouse is moving very fast you will get spots instead of lines.

You can solve this by keeping track of the position of the last mouse update, and if it's too far between paint in the extra steps.

Answer 2

To be more specific: You should make a temporary bitmap each time a mouseDown is fired. On this the brushes will be drawn in black and white - this will produce smoother results for example when you make the drawn brush not full in alpha. Also - here you will have to use the "walking" technique, as said by grapefrukt.

Finally, once the mouseUp event is fired, you have to recolor the bitmap (for brush color), possibly add some filters if you want and draw it on the main bitmap.