Bewegende Bilder

Teil 3: Video-Tricks mit Flash

15.4.2009 von Redaktion pcmagazin und Frank Puscher

ca. 2:20 Min
Ratgeber
  1. Video-Tricks mit Flash
  2. Teil 2: Video-Tricks mit Flash
  3. Teil 3: Video-Tricks mit Flash
  4. Teil 4: Video-Tricks mit Flash
  5. Teil 5: Video-Tricks mit Flash

Erzeugen Sie also einen neuen Movieclip (Einfügen/Neues Symbol), fügen Sie in Frame 2 ein einfaches Bild ein (F5) und schreiben Sie folgende Programmierung in den ersten Frame:

_root.cursor._x=_root.
_xmouse;
_root.cursor._y=_root.
_ymouse;

So wird der Cursor an den Koordinaten der Maus ausgerichtet

if ((_root._xmouse>0)and(
_root._xmouse<130)){ _root.cursor._rotation=180;
vario=Math.round((144-_root.
_xmouse)/10);
}else if ((_root._xmouse>160)and
(_root._xmouse<290)){
_root.cursor._rotation=0;
vario=Math.round((144-_root.
_xmouse)/10);
} else{
_root.cursor._rotation=90;
if (vario<0){
vario=vario+1;
}else if (vario>0){
vario=vario-1; }
}

Die Bühne wird in drei Segmente auf der X-Achse unterteilt, 0 -130, 160-290 und der Rest, also die Mitte und der Bereich außerhalb des Films (Filmbreite 288 Pixel). In jedem Segment wird der Cursor gedreht und eine Variable namens vario geschrieben, die durch die X-Koordinate der Maus gemessen an der Filmmitte (144) berechnet wird und entweder einen negativen oder positiven Wert annimmt.

Die Rundung macht eine Ganzzahl daraus, der Divisor 10 verringert letztlich die Geschwindigkeit der Drehung. Ist der Cursor im neutralen Bereich zählt vario runter in Richtung 0. Das erzeugt ein sanftes Abbremsen.

_root.video.gotoAndStop(_root.
video._currentframe+vario);

Das ist die eigentliche Steuerung. Der Film wird um den Betrag der Ganzzahl verschoben, immer ausgehend vom aktuellen Frame. Es darf also gar nicht von selbst ablaufen, wie sonst beim Video üblich, sondern reagiert vollständig auf die Aktion des Nutzers.

if(vario>0){
if(_root. video._currentframe>
(_root. video._totalframes-vario)){
_root. video.gotoAndStop(1); }
}else {
if(_root. video._currentframe<=(vario*-1)){
_root. video.gotoAndStop
(_root. video._totalframes); }}

Diese Fallunterscheidung schafft die Verbindung zwischen Anfang und Ende des Videos. Es ist wichtig, die Schrittgröße vario zur Berechnung heranzuziehen, damit kein ungültiger Framewert wie zum Beispiel 0 getroffen werden darf.

Kehren Sie nun zurück zu Szene 1. Ziehen Sie den neuen Steuerungsclip auf die Bühne und erhöhen Sie die Filmgeschwindigkeit auf 25 Frames pro Sekunde. Fertig ist das erste Panorama.

Motivwechsel

Die Einbettung des Videos in diesen Steuerungsfilm macht diesen eventuell sehr groß. Insofern wäre vermutlich eine Überbrückung der Ladezeiten mit einer Preloader-Routine sinnvoll. Das Schöne am gewählten Ansatz ist, dass wir einfach nur prüfen müssen, wann der Container-Clip namens video vollständig geladen wurde.

Flash-Video-Tricks
Die Hyperlinks starten eine Schwarzblende und wenn der Bildschirm dunkel ist, lädt die Bildprogrammierung den neuen Film.
© Archiv

Diese Technik verhilft uns auch dazu, das Video auf sehr einfache Art austauschen zu können. Das gelingt entweder durch eine Steuerungsleiste mit sichtbaren Hyperlinks, wie man sie verwenden würde, wenn man zum Beispiel von einem Produkt unterschiedliche Farbvarianten zeigt.

Oder man erzeugt Hotspots innerhalb der Video-Movieclips. Das sind unsichtbare Buttons, die auf einer eigenen Ebene über dem Video liegen und sich an die Umrisse einer Tür oder eines Fensters anpassen.

Freilich sollten Sie dem Nutzer signalisieren, dass diese Option zum Raumwechsel besteht, vielleicht mit einem roten, glühenden Rand um die entsprechende Tür.

Das impliziert also, dass Sie weitere Videos, die Sie erzeugen, nicht als FLV-Dateien umsetzen, sondern ebenfalls als SWF-Files. Importieren Sie dazu das jeweilige Video in einen neuen Film, wählen Sie eingebettetes Video und verzichten Sie auf eine Steuerkonsole, ein Player Skin.

Mehr lesen

Chronologische Liste und Netflix-Links

Marvel-Filme- und -Serien: Das ist die richtige Reihenfolge

Neuerscheinungen in der Übersicht

Netflix: Neue Filme und Serien

Vorschau auf Film- und Serien-Highlights

Amazon Prime Video: Neuheiten

Weiter zur Startseite  

Mehr zum Thema

internet, webdesign, adobe,  Illustrator, CS6

Webdesign

Webdesign in Adobe Illustrator CS6

Adobe Illustrator wird im Webdesign immer beliebter. Wie Sie das Tool richtig einsetzen, erfahren Sie hier.

Facebook stellte die neue Suche

Facebook

Facebooks Social Graph Search

Was sind die Implikationen für Unternehmen und Endanwender bei Facebooks neuer Suche Graph Search?

Der BGH erklärt das Internet zur Lebensgrundlage.

Online-Recht

Darauf müssen Sie bei den AGB achten

Allgemeine Geschäftsbedingungen liest sich niemand gerne durch. Sie sind jedoch notwendig und äußerst sinnvoll. Worauf sie achten sollten.

Online-Urheberrecht: Unser Ratgeber bietet Tipps für das Cloud-Recht.

Online-Recht in der Cloud

Wie sieht das Urheberrecht in der Wolke aus?

Dateien werden immer häufiger in der Cloud bereitgestellt. Rechtlich ist das jedoch durchaus problematisch. Wir klären über das Urheberrecht in der…

Logistik im E-Commerce: Prozesse rund um die Logistik.

E-Commerce-Logistik

Logistik im E-Commerce

Für den Erfolg eines Online-Shops sind zahlreiche Faktoren verantwortlich. Neben Produktvielfalt und Darstellung der Waren gehört auch die Logistik.