26 Streaming. ActionScript lässt ihre Daten fließen

Transkript

1 ActionScript lässt ihre Daten fließen Sie werden lernen: Wie realisieren Sie Streaming? Welche Steuerungsmöglichkeiten bietet ActionScript?

2 Wer mit dem Strom schwimmt, erreicht die Quelle nie. Peter Tille Wahl der Waffen Ein Media-/Streaming-Server ist unerlässlich, wenn Sie Livebilder oder Videokonferenzen realisieren und im Netz verbreiten möchten. Für die Webpräsenz mit fertigem Content ist ein solcher Server im Allgemeinen nicht erforderlich. Streaming klingt verlockend: Der Nutzer lädt die Flash-Datei und die Sound- oder Videoübertragung beginnt sofort und reißt nicht ab. Allerdings erfordert das in der Praxis eine schnelle und stabile Internetverbindung für Server und Nutzer. In Flash gibt es Streaming im weiteren Sinn in zwei Varianten: Streaming als Laden und gleichzeitiges Abspielen eines Sounds oder Videos (Flash bietet das für beide). Streaming eines gerade entstehenden Datenstroms. Da hierfür ein Media-oder Streaming-Server erforderlich ist, hat Macromedia den Flash Media Server (vormals Flash Communication Server) als eigenständiges Produkt auf den Markt gebracht. Wir beschränken uns hier auf die Möglichkeiten, die ohne Communication Server auskommen Streaming für Sounds _soundbuftime Die globale Eigenschaft _soundbuftime steuert, mit wie viel Sekunden Verspätung ein gestreamter Sound startet. Sie haben die Eigenschaft schon in Kapitel 16,»Sound«, kennen gelernt. Für Sound gibt es in Flash eine Form von Streaming: Sie können externe MP3-Dateien laden und als zweiten Parameter bei loadsound (Datei, Streaming) den Wert true angeben, um Sound per Streaming aufzurufen. Und so gehen Sie vor: 1. Zuerst instanziieren Sie ein Sound-Objekt: musik_sound = new Sound(); 2. Dann laden Sie den Sound mit der Option true für Streaming: musik_sound.loadsound("musik.mp3", true); 26.2 Streaming für Videos Ein eingebettetes Video muss in Flash komplett geladen werden, bevor es abgespielt wird. Das heißt, in Flash MX ist mit Flash und ohne Streaming-Server kein Streaming möglich. Flash 8 und MX 2004 unterstützt dagegen das FLV-Format (Flash Video Format). Dieses Videoformat erlaubt echtes Streaming mit dem Flash Communication Server, aber auch progressives Laden ei- 2

3 26.2 Streaming für Videos ner Videodatei. Progressives Laden bedeutet, ein Video kann bereits abgespielt werden, während es geladen wird. Das FLV-Format ist einen näheren Blick wert. FLV Das Flash Video Format ist im Prinzip ein Videoformat mit den Komprimierungs-Einstellungen, die der Sorenson Sparc-Codec bietet. Die erste Frage ist, wie Sie dieses Format produzieren. Dafür benötigen Sie Flash MX 2004 Pro. Bei der Professional-Version wird ein Plug-In für die wichtigsten Videoprogramme zur Verfügung gestellt, das nach seiner Installation aus diesen Programmen FLV exportiert. Alternativ importieren Sie ein beliebiges Video in Flash MX 2004 Pro und exportieren es dann als FLV. In Flash 8 haben Sie in der Professional-Variante noch mehr Möglichkeiten. Sie können direkt beim Import das Streaming aktivieren (siehe Kapitel 17,»Video«, im Buch). Einbinden können Sie FLV-Dateien auch in der Basic-Version von Flash 8 bzw. der Standard-Version von Flash MX Und sogar Flash MX kommt mit FLV zurecht, wenn der Flash-Player 7 installiert ist. Letzteres ist aber eher unsinnig, da MX ja für den Flash- Player 6 veröffentlicht. Prinzipiell gibt es drei Varianten, FLV mit ActionScript einzusetzen: Sie verwenden FLV-Dateien in MovieClips wie beliebige andere importierte Videos. Hierzu finden Sie ein Beispiel im Kapitel 17,»Video«, im Abschnitt»Videos dynamisch verändern«. In diesem Fall wird das FLV-Video nicht als Streaming-Video eingesetzt. Sie laden die FLV-Datei als progressives Streaming direkt beim Import in Flash und verwenden dann die FLVPlayback-Komponente. Dies geht nur in Flash 8 Professional mehr dazu in Kapitel 17,»Video«. Die Komponente gibt es ohne die umfangreichen ActionScript-Steuerungsmöglichkeiten und auch ansonsten in abgespeckter Form auch in Flash MX 2004 mehr dazu weiter unten. Sie laden die FLV-Datei dynamisch hinein und erzeugen damit progressives Streaming (wie das in Flash 8 und MX 2004 geht, zeigen wir Ihnen hier). Die Vorteile sind offensichtlich: Der übrige Flash-Film läuft weiter, während das Video geladen wird. Außerdem kann das Video eine andere Abspielrate haben als der Flash-Film. Der Nachteil ist allerdings: Für das externe Laden von FLV-Dateien benötigt der Nutzer den Flash-Player 7. Camera und Microphone Das Camera - und das Microphone -Objekt kommen meistens mit dem Flash Communication Server zum Einsatz und dienen dazu, eine Kamera oder ein Mikrofon an Flash per Streaming anzuschließen. Sie können damit aber beispielsweise auch einen MovieClip über die Lautstärke oder die Bewegung vor einer Kamera steuern. 3

4 Abbildung 26.1 Die drei Klassen, um Videos zu streamen Für dynamisch geladene FLV-Dateien gibt es drei Klassen: die Net- Connection -Klasse für die Verbindung zum Server oder zu einer lokalen Datei (Letzteres benötigen wir hier). Die zweite Klasse Net- Stream dient zum Erstellen des Streams. Um das Video zu laden, benötigen Sie vorher ein Video-Objekt; seine Methoden und Eigenschaften finden Sie in der dritten Klasse, der Video -Klasse. Alle drei Klassen stehen im Aktionen-Bedienfeld unter Action- Script 2.0-Klassen Medien (Flash MX 2004: Integrierte Klassen Medien). Den Einsatz von dynamisch geladenen FLV-Dateien zeigen wir Ihnen an einem Beispiel. Ausgangspunkt ist die Datei streaming.fla auf der CD-ROM. Schritt für Schritt: FLV-Datei hereinladen Zuerst müssen Sie ein paar Vorbereitungen in Flash treffen, dann geht es in das erste Schlüsselbild des Hauptfilms. 1. Neues Video erstellen Bibliothek: (F11) In der Bibliothek erstellen Sie ein neues Video. Öffnen Sie dazu das Palettenmenü rechts oben und wählen Sie dort Neues Video. Abbildung 26.2 Das eingebettete Video in der Bibliothek 2. Instanz erzeugen Ziehen Sie das Video aus der Bibliothek auf die Bühne in die Ebene Video. Positionieren Sie es auf die Koordinaten 18 Pixel für die x- und y-achse. Vergeben Sie den Instanznamen video. 4

5 26.2 Streaming für Videos Abbildung 26.3 Das neue Video-Objekt erscheint auf der Bühne. Noch ein Tipp: Mit der Variablennamenendung _video erhalten Sie Codehinweise für ein Video. Wechseln Sie nun in das erste Schlüsselbild des Hauptfilms in die Ebene ActionScript. Erstellen Sie zuerst eine Verbindung: var verbindung:netconnection = new NetConnection(); verbindung.connect(null) ; Der Wert null hinter der Methode connect() steht für eine lokale Verbindung, also eine Verbindung ohne Flash Communication Server. Instanziieren Sie jetzt ein neues NetStream-Objekt mit der Verbindung und fügen Sie diesen Stream beim vorher erstellten Video ein: var stream:netstream = new NetStream(verbindung); video.attachvideo(stream); Anschließend legen Sie die Zeitverzögerung für den Stream fest, laden die flv-datei und ändern die Größen des Videos: stream.setbuffertime(3); stream.play("berge2.flv"); video._width = 320; video._height = 240; 3. FLV-Datei laden 5

6 4. Abspielen und anhalten Ende Nun benötigen Sie noch den Code für die Abspiel-Schaltfläche: var zustand = true; schalt_btn.onrelease = function() { stream.pause(); if (zustand) { _root.abspielen_licht_mc._visible = false; zustand = false; } else { _root.abspielen_licht_mc._visible = true; zustand = true; } }; Um den Stream anzuhalten und wieder zu starten, brauchen Sie nur eine einzige Methode: stream(). Ob die Abspiel-Schaltfläche grün, also aktiviert erscheint, bestimmt eine einfache Fallunterscheidung, die den Zustand überprüft. Abbildung 26.4 Das Video wird automatisch abgespielt, lässt sich dann aber anhalten. Sie finden die fertige Datei unter dem Namen streaming_as2.fla auf der CD-ROM. Eine Version für Flash MX gibt es natürlich nicht. Medien-Komponenten Da der Umgang mit FLV-Dateien einige Handgriffe erfordert, bietet die Professional-Version eigene Medien-Komponenten (Media- Components), die Ihnen Arbeit abnehmen sollen. Diese Komponenten dienen ausschließlich dazu, FLV- und MP3-Dateien in Flash zu integrieren. Insgesamt gibt es drei Media-Components: Die MediaPlayBack -Komponente stellt ein Video dar und bietet gleichzeitig eine Abspielleiste. 6

7 26.2 Streaming für Videos Die MediaDisplay -Komponente zeigt ein beliebiges Video, allerdings ohne Abspielleiste. Die MediaController -Komponente bietet einen Controller, jedoch ohne Abspielmöglichkeit. Alle drei Komponenten setzen Sie ein, indem Sie sie aus dem Komponenten-Inspektor auf die Bühne ziehen. Im Eigenschafteninspektor können Sie Instanznamen vergeben; weitere Einstellungen nehmen Sie im Komponenten-Inspektor vor. Für die MediaDisplay- und die MediaPlayback-Komponente geben Sie jeweils die URL des FLV-Films beziehungsweise der MP3- Datei an. Das Hereinladen übernimmt die Komponente. Bei der MediaPlayback-Komponente erscheint die Steuerungsleiste an einer der vier Seiten des Videos wo, das können Sie unter Control Placement wählen. Flexibler sind Sie, wenn Sie die MediaDisplay-Komponente mit der MediaController-Komponente verbinden. In diesem Fall können Sie an beliebiger Stelle steuern und das Video frei platzieren. Komponenten: (Strg) + (F7) Komponenten-Inspektor: (Alt) + (F7) Abbildung 26.5 Im Komponenten-Inspektor wählen Sie die URL der Mediendatei (FLV oder MP3). Abbildung 26.6 Die Steuerung erscheint unter dem Video. Für diese Verbindung ist allerdings ActionScript erforderlich. Den notwendigen Code finden Sie auch als Verhalten: 1. Aktivieren Sie die MediaDisplay-Komponente und vergeben Sie ihr sowie der MediaController-Komponente einen Instanznamen. 2. Rufen Sie im Verhalten-Bedienfeld den Befehl Medien Controller verknüpfen auf. 3. Wählen Sie aus der Liste Ihren Controller. 7

8 Abbildung 26.7 Wählen Sie einen Controller. Nun ist Ihre Steuerung fertig. Ein Blick in den Code, der zur Aktion der MediaDisplay-Komponente hinzugefügt wurde, offenbart, dass beim Laden der Komponente einfach die Methode associatecont roller(controller) des MediaDisplay-Objekts ausgeführt wird: this.associatecontroller(this._parent.controller); Als Parameter erscheint die Adresse des Controllers. Die Lehre aus dieser Erkenntnis: Die drei Medien-Komponenten sind vollständig mit ActionScript steuerbar. Die zugehörigen Klassen mit allen Eigenschaften und Methoden finden Sie im Aktionen-Bedienfeld unter Komponenten. Um auf eine Komponente zuzugreifen, verwenden Sie ihren Instanznamen, beispielsweise so: Instanzname.pause(); Befindet sich die Komponente in einer anderen Zeitleiste, müssen Sie natürlich korrekt adressieren. Sie finden für alle drei Komponenten jeweils ein kleines Beispiel auf der CD-ROM. Die Dateien heißen medienkomponenten_ mediaplayback.fla, medienkomponenten_mediadisplay.fla und medienkomponenten_mediacontroller.fla. 8