Tuesday, July 19, 2011

Create an Object to Follow Cursor

Today I wanna share about how to make an object to follow your cursor. This tutorial is using Adobe Flash CS4 (because I wanna get familiar with this software :D) but it is still works if u use Adobe Flash CS3, just make sure u use the AS3 language. Before u move on check out the preview below:


In order to make that happen u can follow my instruction:
1.       Create a new file (Flash file (Actionscript 3.0)).
2.       Set the size of the stage to 500 x 200 (w x h).
3.       Create three layer name it “script”, “ball”, and “cursor”.



4.       Create a new symbol (shortcut Ctrl - F8) name it “cursor_mc”, choose “movie clip” for type and click OK.



5.       Then draw your custom cursor (arrow style is good enough). And arrange the position so the top of cursor is in the registration point. Then get back to the main stage by clicking the “scene 1”. U can see my cursor in the picture below.




6.       In the “cursor” layer drag the movie clip “cursor_mc” into the stage from the library.



7.       With the cursor still selected type the instance name “cursor_mc” in the properties panel.  Then lock the “cursor” layer so it can’t be modified accidentally.



8.       Next we workin’ out with the “ball” layer. Draw a circle with a radial fill from green to black. And give a little yellow mark with brush tool like shown in the picture below.





9.       Then convert the ball into a symbol (shortcut F8) and name it “ball_mc”. With the type is movie clip and the middle registration point.



10.   With the ball selected type the instance name “ball_mc” in the properties panel and lock the “ball” layer so it can’t be modified accidentally.



11.   Select frame 1 in the “script” layer and open the actions panel (shortcut F9) and then type or copy this code into the panel:

stop();

var coorX:int;
var coorY:int;


var updater:Timer = new Timer(33);
updater.addEventListener(TimerEvent.TIMER,on_Update);
updater.start();

function on_Update (event:TimerEvent):void {
            mouseFollower();
}

function mouseFollower ():void {
           
            coorX = mouseX + 28;
            coorY = mouseY + 32;
            ball_mc.x = ball_mc.x+(coorX - ball_mc.x)/10;
            ball_mc.y = ball_mc.y+(coorY - ball_mc.y)/10;
            ball_mc.rotation = ball_mc.rotation+(coorX-ball_mc.x)/2;
            cursor_mc.startDrag(true);
            Mouse.hide();

}

12.   Then try it by press Ctrl-Enter

Script explanation:
you can download the .fla file in here
thx for your attention, come visit my blog again later. :D

0 comments:

Post a Comment