I kind of gave up with the color picker component for the time being and decided to work on a more simple change; to change the line style and filter which is activated by a 'hot' movieclip.
I went back to the work done by Dan Zen, because he has an example of a static button that is changed by touching it. see the link below for a demonstration, I have not included the video here because I already posted it on an earlier entry.
http://ostrichflash.wordpress.com/video/
Through Dan Zen's work, I gained 'proof of concept', but I was fairly sure that instead of using his classes which replace usual mouse events such as mouseOver, mouseOut etc, I can use hitTest, since I no longer have a 'mouse'. My reasoning here is that since I am only starting to learn AS3 it is easier to use a function that I am already familiar with and the code is basically the same for AS2 and AS3.
As I mentioned before, I have attached the drawing api (graphics.lineTo and moveTo) to a movie clip called myDrawing.
I therefore built another movie clip called myButton and did a hitTest between the two. Since I want the hitTest to remain 'true' I did not include an 'else' statement. I then made another movie clip called redDrawing and assigned a different filter and line style to it. The function that calls the hitTest then attaches the child of redDrawing if the hitTest is true.
Also just a quick note to say that I put a round white circle on the cursor to make it easier to see where it is, it will be removed in the final application
The code follows:
myDrawing.addEventListener(Event.ENTER_FRAME, changeStroke);
function changeStroke(e:Event):void{
if (myDrawing.hitTestObject(myButton)){
trace("hit");
var redDrawing:MovieClip = new MovieClip();
redDrawing.graphics.lineStyle(30, 0xff6347, 50);
redDrawing.graphics.moveTo(myFairy.x+2, myFairy.y+2);
redDrawing.graphics.lineTo(myFairy.x, myFairy.y);
var dropShadow:DropShadowFilter = new DropShadowFilter();
dropShadow.color = 0x000000;
dropShadow.blurX = 10;
dropShadow.blurY = 10;
dropShadow.angle = 0;
dropShadow.alpha = 0.5;
dropShadow.distance = 10;
var filtersArray:Array = new Array(dropShadow);
redDrawing.filters = filtersArray;
addChild(redDrawing);
And here is the result:
As you can see the hitTest works, but there are a few problems still to resolve. Firstly it seems like the myDrawing movie clip is still there even though it is barely visible. Secondly and more frighteningly it is now clear that the movie clip that holds the api is creating a new api every time it enters a frame, so that the drawing is contained only within the movie clip. Since I need the drawing to be a continuous line this will not suffice. I am going to look back thru my previous api files and see what i can come up with. I am however happy with the strange effects that are produced with this current method, and am wondering if there is a way of increasing and decreasing the size of the blobs as the go away or get nearer to the center of the drawing environment so that they will become like 3d objects. Given that there is now a z co-ordinate available in flash it might be worth a little time experimenting....
Subscribe to:
Post Comments (Atom)
Tina I can't get this swf to work, just doesn't do anything, could be a problem my end??? Philippa
ReplyDeletehi Phillipa.
ReplyDeletedo you have a web cam on your laptop? if you do you need to make sure that it being found by the browser. it should be somewhere in the settings of the camera.
hope this helps. t
Have got it to work, trick is not to tick allow on the dialog box but to control-click on it then go to settings and tick allow and remember then pick USB video from the webcam options (in case anyone else has trouble). I really really really like the strange effects, I think serendipity is cool in work like this sometimes the unexpected is more interesting... brava Tina! I also had trouble getting rid of an initial movieclip in my seasons swf, dunno the answer but it may be something to do with depths.
ReplyDelete