Mouse Follow Effekt | Flash CS3 (ActionScript 3.0)

Für alle die schon länger mit Flash arbeiten, komplexere Tutorials.
Antworten
Benutzeravatar
Danjo
Beiträge:18
Registriert:Mi 9. Jan 2008, 19:52
Kontaktdaten:
Mouse Follow Effekt | Flash CS3 (ActionScript 3.0)

Beitrag von Danjo » Do 10. Jan 2008, 00:42

Dieses Tutorial soll verdeutlichen, wie man einen Mouse Follow Effekt erstellt.
Wir verwenden hierfür Actionscript 3, die Datei muss also für ActionScript 3.0 ausgelegt sein
(Datei > Neu > Flash-Datei (ActionScript 3.0) auswählen).
Zunächst die Bühne entsprechend an die gewünschte Größe anpassen.
Danach die bereits vorhandene Ebene in der Zeitleiste benennen. Wir geben ihr den Namen "Objekt".

Nun das erste Schlüsselbild markieren und ein Objekt über Datei > Importieren > In Bühne importieren auf der Bühne platzieren.
mouse_follow-1.gif
mouse_follow-1.gif (10.18KiB)25436 mal betrachtet
Danach das Objekt markieren und über Modifizieren > In Symbol konvertieren den Typ "Movieclip" auswählen, benennen und mit "OK" bestätigen. Das Objekt ist jetzt ein Movieclip.
mouse_follow-2.gif
mouse_follow-2.gif (10.31KiB)25436 mal betrachtet
Außerdem geben wir dem Movieclip im Eigenschaftenfeld den Instanznamen "Movie".
mouse_follow-4.gif
mouse_follow-4.gif (6.99KiB)25434 mal betrachtet
Im Anschluss erstellen wir eine weitere Ebene für das ActionScript und bennen diese entsprechend mit "AS".
mouse_follow-3.gif
mouse_follow-3.gif (4.41KiB)25434 mal betrachtet
Wir markieren das erste Bild der Ebene "AS" und tragen über Fenster > Aktionen folgendes ActionScript ein:

Code: Alles auswählen


addChild(movie);

movie.stage.addEventListener(MouseEvent.MOUSE_MOVE,mouseMoveHandler);

function mouseMoveHandler(event:MouseEvent):void{
	if(distance(movie.x,movie.y,movie.stage.mouseX,movie.stage.mouseY)>1){
		if(!movie.hasEventListener(Event.ENTER_FRAME)){
			movie.addEventListener(Event.ENTER_FRAME,enterFrameHandler);
		}
	}
}

function enterFrameHandler(event:Event):void{
	trace(distance(movie.x,movie.y,movie.stage.mouseX,movie.stage.mouseY));
	if(distance(movie.x,movie.y,movie.stage.mouseX,movie.stage.mouseY)<1){
		movie.removeEventListener(Event.ENTER_FRAME,enterFrameHandler);
	}else{
		movie.x+=(movie.stage.mouseX-movie.x)/2;
		movie.y+=(movie.stage.mouseY-movie.y)/2;
	}
}

function distance(x1:Number,y1:Number,x2:Number,y2:Number):Number{
	var dist:Number=Math.sqrt((x2-x1)*(x2-x1)+(y2-y1)*(y2-y1));
	return dist;
}
Danach können wir unseren Film testen:

Mouse Follow Effekt.swf [1.3KiB |25242 mal betrachtet ]

Dateidownload:
Mouse Follow Effekt.fla
(208KiB)1766-mal heruntergeladen

Antworten