SWISHmax - Workshop SWISHmax Movie Player

  • In diesen Workshop wird Ihnen gezeigt, wie einfach man mit externen MovieClips arbeiteten und diese steuern kann. Der Movie Player hat neben den Standardtasten (Play, Pause und Stop) auch Tasten für den schnellen Vor- und Rücklauf sowie eine Removetaste und eine Soundsteuerung. Zwei Preloader sind zuständig für die Anzeige von Frames und Bytes. Den Download des fertigen Beispiels finden Sie am Ende dieses Workshops. So soll der fertige Movie Player aussehen. Im Zentrum steht der geladene externe MovieClip, unten die Bedienender mit Frameloader und rechts der Preloader für die Ladeanzeige. Als erstes erstellen wir einen neuen Film mit den Abmessungen 550 x 400 px. Die Scripte für die Steuerung werden der Übersicht wegen alle in den ersten Frame von scene_1 geschrieben. Als erstes erstellen wir eine neue Filmsequenz-Instanz (Sprite), die uns als Platzhalter für die Externen Flash Filme dienen wird.

    1.) Menü/Insert/Sprite...

    2.) Den Mittelpunkt des Sprites so positionieren, dass der externe Film an der gewünschten Stelle sitzt. Da die externen Filme in die Filmequenz-Instanz geladen werden, können wir diese bei Bedarf durch verschieben des Sprites auf der Leinwand genau positionieren. Das macht vor allem Sinn, wenn die externen Filme kleiner als der Hauptfilm sind. Würde man die externen Filme einfach in den Hauptfilm laden, so würden diese immer oben links positioniert sein.

    3.) Dem Sprite einen Instanzennamen "mc" geben. Als nächstes fügen wir die Grafiken für die Steuerung ein und wandeln diese in Buttons um. Menü/Modify/ButtonAlle Buttons erhalten im Eigenschaftsfeld einen Namen. >Button< >Video1< >Video2< >Sound< >Rewind< >Play< >Pause< >Rück< >Vor< >Name< >butVid2< >butSound< >butRewind< >butPlay< >butPause< >butRuck< >butVor< - Jetzt fehlen noch die Grafiken für die Preloader. Hierfür einfache Balken zeichnen und diese in einen Sprite umwandeln. Menü/Modify/SpriteDie Sprites erhalten nun im Eigenschaftsfeld die Namen mc_Balken für den Frameloader und mc_loader für den Preloader.Jetzt machen wir uns an das Script. Klicken Sie im Outlinefenster auf scene_1 und im Layoutfenster auf Script.


    1.) onLoad () {}In diese Anweisung packe ich alles hinein, was der Hauptfilm schon bei dem Öffnen wissen muss. Ich will, dass beim öffnen bereits ein Video geladen wird und zwar in der Filmequenz-Instanz "mc", unseren Platzhalter für die externen Filme.mc.loadMovie("video.swf");Die Anweisung für das Pausesignal möchte ich global vergeben.// Pause (Signal) //psig = 0;psig ist eine Variable für den Pausebutton und sagt psig = false (Flasch oder nein).Also der erste ScriptabschnittonLoad() {mc.loadMovie("video.swf");// Pause (Signal) //psig = 0;}

    2.) Nun kommen wir zu den Anweisungen, die bei bestimmten Aktionen ausgeführt werden sollen.onEnterFrame() {Ab hier setze ich die Variablen für die Buttonbefehle.// Vorlauf (Signal)if (_root.vsig) {mc.gotoAndPlay(mc._currentframe + 3);}mit _root und mc, unseren Filmplatzhalter, gebe ich den Pfad an, wo die Aktion gotoAndPlay ausgeführt werden soll. mc._currentframe sagt mir den aktuellen Frame, der gerade in der Filmsequenz-Instanz mc gespielt wird. Da ich einen schnellen Vorlauf wünsche, addiere ich 3 Frames dazu, so dass bei vsig = 1 der Film immer um 3 Frames vorspringt und dadurch schneller vorläuft. // Rücklauf (Signal) //if (_root.rsig) {mc.gotoAndPlay(mc._currentframe - 3);}Das gleiche passiert auch im Rücklauf, nur dass mc.curentframe -3 ist und bei rsig = 1 immer um 3 Frames zurückspringt.// Rewind (Signal) //if (_root.rewind) {mc.prevFrame();}Bei mc.prevFrame wird der Film bei rewind = 1 kontinuirlich um einen Frame zurückgesetzt und stoppt am 1. Frame. Den gleichen Effekt würde man mit mc._currentframe -1 auch erzielen, aber am 1. Frame angelangt würde der Film immer vor- und zurückspringen.}

    3.) Nun gebe ich dem Button die Anweisungen, die bei den Buttonaktionen ausgeführt werden sollen. Neben unseren definierten Signalen bestimmen wir, ob der Film spielen (mc.play();) oder halten ( mc.stop();) soll. Stellen Sie sich die Signale wie eine Verkehrsampel vor die angibt wann gefahren werden darf.OnEnterFrame(){// SpielenbutPlay.onPress = function() {psig = 1;rewind = 0;mc.play();};butPlay ist unser Button, den wir bereits vorher eingebaut und den Namen gegeben haben. Das gleiche gilt auch für die folgenden Buttons.// PausebutPause.onPress = function() { (!psig) ? mc.stop() : mc.play();psig = !psig;rewind = 0;};// VorwärtsbutVor.onPress = function() {vsig = 1;rsig = 0;};butVor.onRelease = function() {rewind = 0;vsig = 0;psig = 0;mc.play();};butVor.onReleaseOutside = function() {rewind = 0;vsig = 0;psig = 0;mc.play();};//RewindbutRewind.onRelease = function() {psig = 0;rewind = 1;};// RückwärtsbutRuck.onPress = function() {vsig = 0;psig = 0;rsig = 1;};butRuck.onRelease = function() {rsig = 0;psig = 0;mc.play();};butRuck.onReleaseOutside = function() {rsig = 0;psig = 0;mc.play();};4.)Für die Soundsteuerung ist folgendes Script verantwortlich. Die Aktionen Sound An/Aus werden auf den Button butSound gelegt. Bei anklicken des Buttons werden die Zustände musik = 0 (Volume 0) und musik = 1 (Volume 100) abwechselnd eingestellt. // SoundAn/AusbutSound.onRelease = function() {musik = new Sound(_root.mc);if (musik.getVolume(100)) {musik.setVolume(0);} else {musik.setVolume(100);}};5.)Das Laden der externen Filme geschieht wie schon am Anfang beschrieben, nur werden die Aktionen jetzt auf die Buttons gelegt. Im Prinzip kann man so viele Filme laden wie man Buttons zur Verfügung hat.// Video EinsbutVid1.onRelease = function() {mc.loadMovie("video.swf");};// Video ZweibutVid2.onRelease = function() {mc.loadMovie("video2.swf");};}6.)Für den Frameloader, der anzeigt wie viele Frames bereits geladen sind, muss man zwei Sachen wissen: Wie viele Frames hat der gesamte Film und wo befindet sich gerade der aktuelle Frame? Die Anweisungen mc._totalframe (gesamte Anzahl der Frames) und mc._currentframe (die aktuelle Position) liefern die benötigten Werte über den Film, der sich gerade im Filmplatzhalter mc. befindet. onEnterFrame(){total = mc._totalframes;aktPos = mc._currentframe;Die Länge des Ladebalkens ist 300 (100%). Um 1/100 von der gesamten Filmlänge zu bekommen muss ich die Balkenlänge durch gesamten Frames teilen.gesamt = 300/mc._totalframes;// =100%Die Länge das Balkens soll sich an den aktuellen Frames ausrichten. Also muss ich den aktuellen Frame mit 1/100 der gesamten Frames multiplizieren. Hierfür habe ich bereits die Variablen gesamt und aktPos definiert.mc_Balken._width = aktPos * gesamt; Die Breite des mc_Blakens._width ist immer nur so lang wie die Summe aus aktPos * gesamt.}7.)Für den Preloader müssen wir wissen, wie groß der gesamte Film ist und wie viel bereits geladen wurde. Hier liefern uns die Anweisungen mc.getBytesTotal (Gesamtgröße) und mc.getBytesLoaded (bereits geladen) die Werte über den Film, der in den Filmplatzhalter mc. geladen wurde.Die Berechnung des Balken erfolgt wie bei dem Frameloader, nur dass sich die Höhe des Balkens beim laden anpasst.onEnterFrame() {ganz = mc.getBytesTotal();geladen = mc.getBytesLoaded();Prozent = 200 / mc.getBytesTotal();mc_loader._height = geladen * Prozent;}Die Variablen, die im Frameloader und Preloader definiert wurden, kann man auch für die Anzeige in dynamischen Textfeldern verwenden. Zeichnen Sie in den Hauptfilm die Textfelder und geben Sie diesen die jeweiligen Variablennamen und fertig sind die Anzeigen für Bytes, Frames und Prozent.Nun ist der SWISHmax Movieplayer einsatzbereit. http://www.die-grafik-ecke.de/…le=SWISHmax%20VideoPlayer - Downloadseite des Videoplayer Workshop Schreibers Flashbanane (kostenlose Anmeldung erforderlich) Dieser Workshop und das Demo Beispiel wurden erstellt von: Flashbanane - dem Macher von http://www.die-grafik-ecke.de - Vielen Dank dafür!