Einleitung

Jeder, der schon mal auf einem der großen Videoportale (YouTube, MyVideo etc.) unterwegs war, kennt sie: Die Videoplayer, welche zur Wiedergabe von Videos im FLV-Format (Flash-Video) dienen. Dieses Tutorial richtet sich an alle, die schon immer mal einen solchen FLV-Playermit Flash selbst realisieren, bzw. programmieren wollten. Wir beschränken uns hierbei jedoch auf die Grundfunktionen, die für den normalen Videoalltag aber völlig ausreichend sind. Wenn Sie dieses Tutorial durchgearbeitet haben, ist Ihr FLV-Player mit folgenden Funktionen ausgestattet:

• Starten und Stoppen des Videos

• Pausefunktion / Standbild

• Zu einer bestimmten Position im Video „draggen“

• Statusbalken für den Ladevorgang und die Wiedergabe

• Anzeige von Zeit / Gesamtspieldauer

• Soundsteuerung

• Umschalten zwischen Fullscreen und Normalansicht

• Das Layout der Bedienelemente kann ohne Eingriff in die .fla-Datei geändert werden

Welche Vorkenntnisse sind erforderlich?

Für den Umgang mit MovieClips, Instanznamen, der Bibliothek und Variablen sollte schon ein wenig Erfahrung mit Flash vorhanden sein. Grundkenntnisse in (X)HTML und Wissen über die Verwendung des DIV-Tags sind ebenfalls von Vorteil. Sie müssen nicht unbedingt JavaScript beherrschen, um Ihre fertige SWF-Datei in Ihre Website zu integrieren, obwohl wir es hier verwenden werden. Das wesentliche bekommen Sie aber erklärt.

Was benötige ich?

Sie benötigen Adobe Flash ab Version MX04. Wenn Sie Flash CS3 verwenden, so achten Sie bitte darauf, dass Sie ein ActionScript 2Projekt geöffnet haben. Ferner genügt ein einfacher Texteditor zur Erstellung ihrer Website. Ach ja, ein Video im FLV-Format wäre nicht schlecht.

Was benötigt der Websitebesucher?

Ihr Besucher braucht eigentlich nicht mehr, als einen installierten Flash-Player ab der Version 9 und aktiviertes JavaScript. Warum, dass erfahren Sie im Laufe dieser Dokumentation. In Zeiten des „Web 2.0“ können Sie beruhigt davon ausgehen, dass nahezu jeder Ihrer Besucher über diese Voraussetzungen verfügt.

Aufbau des Tutorials

Am Anfang war das Layout

Hier werde ich Ihnen kurz den Aufbau der einzelnen MovieClips, deren Anordnung auf der Bühne und die Verwendung der Bibliothekselemente erläutern. Auch verliere ich ein paar Worte zur Verwendung der Zeitleiste, was sich aber kurz hält, da wir nur in einem Frame aktiv sind.

Das ActionScript

Dies ist der Hauptteil dieser Dokumentation. Hier erkläre ich Ihnen ausführlich sämtliche Aktionen und Funktionen, die unseren FLV-Player zum Leben erwecken und wie Sie auf die Aktionen des Benutzers reagieren und vorbereitet sind. Durch die Verwendung von Zeilennummern in den ActionScript-Codezeilen dieses Tutorials, finden Sie sich in der .fla-Datei schnell zurecht, um evt. eigene Änderungen vorzunehmen.

Einbau in ein HTML-Dokument und Hinweise

Im abschließenden dritten Teil lesen Sie, wie Sie Ihren FLV-Player in Ihre Webseite integrieren. Auch gebe ich Ihnen Tipps und Anregungen wie sich Ihr FLV-Player einfach an das eigene Layout anpassen lässt und was vielleicht noch sinnvolle Features wären, mit denen Sie Ihren FLV-Player erweitern und aufpeppen könnten.

Was hier nicht erklärt und beschrieben wird

Bitte haben Sie Verständnis dafür, dass hier nicht im Urschleim gewühlt wird. Hinweise zum Umgang mit den Zeichenwerkzeugen, der Zeitleiste usw. werden Sie genauso vermissen wie Erläuterungen zu Fragen wie - Was ist eine Variable, eine Funktion oder ein Array? - und dergleichen. Ich bin mir auch ziemlich sicher, Sie wollen das hier auch gar nicht lesen, schließlich gibt’s ja hier für unzählige Fachliteratur.

Den FLV-Player in Action gibt es hier zusehen. In diesem Sinne wünsche Ich nun viel Spaß auf den folgenden Seiten

Ihr / Euer Stephan Funke

Let’s Rock...

Weiter mit: Am Anfang war das Layout