How to allow vector drawing in .swf??

[Deejayo]

I am not sure if my title fits what I am asking about but here it is...

I have seen flash games where the player can actually draw objects.
Meaning they have like a pen cursor in the game, and they can just start creating vector art. I have a game in mind where it might be a cool feature to have the user draw a few things. I bet this is a heavy subject so I am not asking for every bit of code I'd need to create something like this, but I have searched quite a lot for anything remotely brushing on this subject and clearly I have no idea what I should be punching into google. If anyone can point me in the right direction I would appreciate it.

[cultcreative]

on a very basic level, the ability to draw something in flash requires:
an object to draw on.. i usually create a new sprite and add it as a draw layer

next you need a loop to be able to track the mouse for drawing.. i usually use an ENTER_FRAME listener for that.

in the loop, you detect where the mouse is, and potentially where it just was (stored in variables) and use the drawing api to draw a line from the previous point to the new point.

[Deejayo]

ok makes sense, I did a bit more research and found this...
http://active.tutsplus.com/tutorials...tion-in-flash/

Is there anyway to accomplish what you said without the use of packages? I can't have packages for the type of project I am doing. And if it is basic, can you spare some time and give me more of a lead?

Thanks!

[guardiankitty]

See: http://help.adobe.com/en_US/FlashPla.../Graphics.html


In short, in each movieclip or sprite you can access a variable called graphics (ie: myMC.graphics)

To 'Draw', first you need a brush. Here is an example of one:

myMC.graphics.lineStyle(5, 0, 1);// So that is (brush size, color (for instance, 0x000000 is black), alpha (1 is 100% alpha, no transparencies)

Next, you press your brush to the paper at a given point. For this example I will set it to the current location of the mouse:

myMC.graphics.moveTo(stage.mouseX, stage.mouseY);

And lastly, you will want to move the brush to another location, creating a brush stroke (or line). For this example, we will just have it go from its current location to (100x,100y).

myMC.graphics.lineTo(100,100);

And thats about it.


Given that the root of your movie technically IS is movieclip/sprite, you can just copy and paste the following, which creates a brush, places a brush down, then allows you to move your brush creating a line.

(seeing that you dont want these in classes--- which is bad form... tisk tisk), you can just copy and paste the following right into your flash IDE.

//Make sure flash knows that you are doing stuff with the mouse
import flash.events.MouseEvent;

//Create Brush
this.graphics.lineStyle(5,0,1);

//Press Brush to your movieclip
this.graphics.moveTo(stage.mouseX,stage.mouseY);

//Each time that the mouse is moved, run 'OnMouseMove'
stage.addEventListener(MouseEvent.MOUSE_MOVE, OnMouseMove);

function OnMouseMove(e:MouseEvent):void{
    //Drag the brush along your movieclip to the location of the mouse
    this.graphics.lineTo(stage.mouseX, stage.mouseY);
}

So when the above is run, you start drawing everywhere that you move your mouse. However I have gone ahead and given it a little more love, now you can press with the mouse to draw.

import flash.events.MouseEvent;

this.graphics.lineStyle(5,0,1);

stage.addEventListener(MouseEvent.MOUSE_DOWN, OnMouseDown);

function OnMouseMove(e:MouseEvent):void{
    this.graphics.lineTo(stage.mouseX, stage.mouseY);
}

function OnMouseDown(e:MouseEvent):void{
    this.graphics.moveTo(stage.mouseX,stage.mouseY);
    stage.addEventListener(MouseEvent.MOUSE_MOVE, OnMouseMove);
    stage.addEventListener(MouseEvent.MOUSE_UP, OnMouseUp);
    stage.removeEventListener(MouseEvent.MOUSE_DOWN, OnMouseDown);
}

function OnMouseUp(e:MouseEvent):void{
    stage.removeEventListener(MouseEvent.MOUSE_MOVE, OnMouseMove);
    stage.removeEventListener(MouseEvent.MOUSE_UP, OnMouseUp);
    stage.addEventListener(MouseEvent.MOUSE_DOWN, OnMouseDown);
}

Hope that is helpful!


PS. Please please please, use classes and good OOP reguardless of the size of the project, you really will thank yourself later, when trying to update/work with it. If nothing else, do it for me!!

~GK >^.^<