Charcoal and crayon drawing effect.

[evan]

check this link:
http://www.asmakta.com/eraseme2/charc/charcproto3.html

The reason for "var val" is in order to implement this tool into the greater project.

"Val" is set to 5 -hiiting a button sets the val to 15 -conditions for the tool to work are: the button needs to be pushed to activate it and the cursor needs to be over "pad".

That being said, I also need to dissable the tool when I click another -such as an eraser, clicking and eraser button sets "val" to 5 again -it dissables this drawing tool, and sets a new value for "val" which is a new condition for the eraser to work -ie: if(val==5)eraser=true ---then eraser is active and at the same time dissabling the other too.


Regarding your suggestion:
I read up on turning off event listeners but I ran into the same problem last time I experemented that is:

function stopDrawing(e:MouseEvent):void {
trace("END DRAWING");
pad.removeEventListener(MouseEvent.MOUSE_MOVE, Draw);
}

it didn't really stop drawing on on MOUSE_UP and although your code is set up more efficiently, I don't know why it didn't actually turn off the event listener, which is why it just keeps drawing with MOUSE_MOVE

It does it's job of activating with the button, and working with mouse move, but it does not stop on mouse up and enabe the user to start and stop drawing on MOUSE_DOWN.

Mine does that -but as you look at it -the bug is it in that it stops after a short interval in the MOUSE_DOWN position -But it does
1)limit use until activated 2) start only on MOUSE_DOWN 3) stop when the mouse is of the pad 4) resume again on the pad on mouse down 5) allow the whole process to be dissabled when I add another button later.

I'm trying to see the limitations in creating a draw tool like this -if in fact I have exceeded the limitations in what I can do with Flash in this area -unless there is another way to attack this problem.

separate bug:
I tried different frame-rate settings to ensure that rather than a "staggered" pattern I get a steady "stream" -as it does when you move the mouse slowly.

I saw some examples in using math functions to control the interval something happens, like maybe the rate new instances of "grain" are redrawn in order to make work faster when the user moves the mouse faster.

[Medyman]

I saw some examples in using math functions to control the interval something happens, like maybe the rate new instances of "grain" are redrawn in order to make work faster when the user moves the mouse faster.

Take a look at the AS3 Timer class. It's much more robust that using some Math hacks.

Have a look at blog posts from Lee Brimelow and Peter deHann for some more insight.

[evan]

check this link: BEFORE
http://www.asmakta.com/eraseme2/charc/charcproto3.html
my code


AFTER -see this
http://www.asmakta.com/eraseme2/charc/charcproto5.html
your code with some ajdustments -start and stop buttons and I had to add an event listener

var val:Number=5
end_btn.addEventListener(MouseEvent.CLICK, end);//added
do_btn.addEventListener(MouseEvent.CLICK, begin);//added
pad.addEventListener(MouseEvent.MOUSE_DOWN, startDrawing);/*added before it was continuing MOSE_MOVE when the mouse re-enterred the pad.*/

function begin(e:MouseEvent):void { (val=15);}

function end(e:MouseEvent):void { (val=5);}

function startDrawing(e:MouseEvent):void {
if (val>10){//added

trace("START DRAWING");
pad.addEventListener(MouseEvent.MOUSE_MOVE,Draw);
pad.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);//added
}
}

function Draw(e:MouseEvent):void {
trace("DRAWING");
var grain:MovieClip = new Grain();
addChild(grain);
grain.x = mouseX;
grain.y = mouseY;
grain.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);
pad.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);
}

function stopDrawing(e:MouseEvent):void {
trace("END DRAWING");
pad.removeEventListener(MouseEvent.MOUSE_MOVE, Draw);

}

working on math now thanks

[Medyman]

Hmm...I see what you mean. I don't really see a way around that happening. The most you'll be able to do is to attach one MC to the stage per millisecond.

With a brush that's so small, it's going to be hard to get a steady stream. And really, it's intuitive, I think. Even if you look at something like MS Paint's spray paint tool, it does the same thing. If you move the mouse really fast, you get the same effect.

The only thing that you could do would be to increase the size of the brush.

[evan]

If I make the grain mc larger and apply a blur filter it helps,
how about changing the color? I tried to apply a color property to it
-no errors but no activity

function Draw(e:MouseEvent):void {
trace("DRAWING");
var grain:MovieClip = new Grain();
addChild(grain);
//grain.filters = [ new BlurFilter() ];//good for brush

//grain.alpha=.5

grain.color=0xFF00FF;
grain.x = mouseX;
grain.y = mouseY;
grain.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);
pad.addEventListener(MouseEvent.MOUSE_UP, stopDrawing);
}

[Medyman]

You can't just declare the color like that. MovieClips don't have a color property. Instead, you can use a tweening engine like Tweener or Flash's native ColorTransform Class.