AS3: MovieClips zufällig abspielen lassen

In Vorschau-Fenstern oder MP3-Playern sieht/hört man zufällig abgespielte MovieClips. Dieses Howto erklärt euch, wie ihr eine zufällige Wiedergabe in Actionscript 3 realisiert. Dabei werden verschiedene Varianten erklärt mit unterschiedlichen Ansätzen. Folgende MovieClip-Klassen(mit Animation) sind vorhanden:

  • blau_mc
  • rot_mc
  • gelb_mc
  • gruen_mc

 

Array mit Klassennamen erstellen

Zunächst packen wir die Namen der Klassen in ein Array hinein:

var myArray:Array = ["gelb_mc","rot_mc","gruen_mc","blau_mc"];

Dieses Array ist der Dreh- und Angelpunkt der zufälligen Vorschau und definiert die wiederzugebenden MovieClips. Man sollte unbedingt darauf achten, dass die MovieClips ungefähr die gleiche Größe haben, da sonst Verzerrungen entstehen könnten!

 

Rahmenbedingungen festlegen

Nun definieren wir die Rahmenbedingungen der Vorschau. Dazu gehören zum Beispiel:

// Wiederholung am Ende
var repeat:Boolean = true;

// Position
var xKoord:int = 45;
var yKoord:int = 45;

// Dimension
var width:int = 100;
var height:int = 100;

 

Array zufällig sortieren und wiedergeben

Dieser Part ist etwas kompliziert. Als Erstes wird das Array zufällig sortiert. Hierzu wird eine eigene Methode namens „getRandomPos“ und die Methode „sort“ des Arrays verwendet.

// Zufällig sortieren
myArray.sort(getRandomPos);

function getRandomPos(e:Object, e1:Object):int
{
	return Math.floor(Math.random() * myArray.length - 1);			
}

Das Ergebnis ist das gleiche Array mit einer zufälligen Sortierung. Nun werden dynamisch die einzelnen Objekte erzeugt, ausgerichtet, skaliert und angezeigt:

function showArray():void
{
	if(count < myArray.length){
		//Objekt erzeugen
		var myClass:Class = getDefinitionByName(myArray[count]) as Class;
		var myMc:MovieClip = new myClass() as MovieClip;
		
		//Objekt ausrichten & skalieren
		myMc.x = xKoord;
		myMc.y = yKoord;
		myMc.width = myWidth;
		myMc.height = myHeight;
		
		// Objekt anzeigen
		addChild(myMc);		
			
		// EventListener adden
		myMc.addEventListener(Event.ENTER_FRAME, endeMc);
		
	}else{
		// Zurücksetzen falls erwünscht und erneut abspielen
		if(repeat){
			count = 0;
			showArray();
		}				
	}
			
}

Zusätzlich wird ein Eventlistener erzeugt, der am Ende des MovieClips sich selbst und den MovieClip entfernt, den Counter hochzählt und die Methode neuaufruft.

function endeMc(e:Event):void
{
	// Wenn Mc zu ende -->Eventlistener und Mc löschen  
	// Funktion neustarten
	if(e.currentTarget.currentFrame >= e.currentTarget.totalFrames){
		e.currentTarget.removeEventListener(Event.ENTER_FRAME, endeMc);
		removeChild((e.currentTarget) as MovieClip);
		count++;
		showArray();								
	}
}

 

Das gesamte Skript

var myArray:Array = ["gelb_mc","rot_mc","gruen_mc","blau_mc"];
			
// Wiederholung am Ende
var repeat:Boolean = true;
// Position
var xKoord:int = 45;
var yKoord:int = 45;
// Dimension
var myWidth:int = 100;
var myHeight:int = 100;
		
// Zufällig sortieren
myArray.sort(getRandomPos);
		
// Counter Variable
var count:int = 0;
			
//starten
showArray();
			
			
		
function endeMc(e:Event):void
{
	// Wenn Mc zu ende -->Eventlistener und Mc löschen  
	// Funktion neustarten
	if(e.currentTarget.currentFrame >= e.currentTarget.totalFrames){
		e.currentTarget.removeEventListener(Event.ENTER_FRAME, endeMc);
		removeChild((e.currentTarget) as MovieClip);
		count++;
		showArray();								
	}
}
		
		
function showArray():void
{
	if(count < myArray.length){
		//Objekt erzeugen
		var myClass:Class = getDefinitionByName(myArray[count]) as Class;
		var myMc:MovieClip = new myClass() as MovieClip;
		
		//Objekt ausrichten & skalieren
		myMc.x = xKoord;
		myMc.y = yKoord;
		myMc.width = myWidth;
		myMc.height = myHeight;
		
		// Objekt anzeigen
		addChild(myMc);		
			
		// EventListener adden
		myMc.addEventListener(Event.ENTER_FRAME, endeMc);
		
	}else{
		// Zurücksetzen falls erwünscht und erneut abspielen
		if(repeat){
			count = 0;
			showArray();
		}				
	}
			
}
		
		
function getRandomPos(e:Object, e1:Object):int
{
	return Math.floor(Math.random() * myArray.length - 1);			
}



Kommentar verfassen