Die neue FLV Playback Komponente in Flash CS3 wird Untertitel im Timed Text Format, einem W3C-Standard, unterstützen. Die Untertitel-Informationen werden einfach in einem externen XML-File abgelegt. Den Rest erledigt die Komponente, es werden keine ActionScript-Kenntnisse benötigt.

Zahlreiche Formatierungsmöglichkeiten werden von der FLV Playback Komponente unterstützt:

  • rechtsbündige, linksbündige und zentrierte Textabschnitte
  • Textgröße (absolut und relativ)
  • Textfarbe und Schriftart
  • fett und kursiv
  • Hintergrundfarbe des Textfelds

Im Folgenden ein Überblick und einige Beispiele zum neuen Untertitelformat in Flash CS3.

1. Das XML-Grundgerüst

Der erste Beispielcode ist das Grundgerüst der XML-Datei:

PLAIN TEXT
Actionscript:
  1. <?xml version="1.0" encoding="UTF-8"?>
  2.  <tt xml:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1"  xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling">
  3.   <head>
  4.    <styling>
  5.  
  6.        
  7.        
  8.    </styling>
  9.   </head>
  10.  
  11.   <body>
  12.    <div xml:lang="en">
  13.    
  14.  
  15.    
  16.    </div>
  17.   </body>
  18. </tt>

Im leeren Bereich zwischen dem styling-Tags können Formatierungsstile definiert werden.

Im unteren leeren div werden die Untertitelinformationen eingepflegt. Werfen wir zunächst einen Blick hierauf.

2. Untertitel/Texte

Für jede Text-/Untertitelzeile muss ein p-Tag definiert werden, der im folgenden Beispiel aufgebaut ist. Der notwendige Parameter begin legt den Timecode fest, wann der Untertitel erscheinen soll. Hier im Beispiel bei Sekunde 1 des Videos.

PLAIN TEXT
Actionscript:
  1. <p begin="00:00:01.00">Dies ist ein Untertitel</p>

Außerdem lässt sich die Dauer eines Untertitels mit dem Parameter dur festlegen. Ist die Dauer (wie im vorigen Beispiel) nicht festgelegt, bleibt der Text solange stehen, bis er von einem anderen Untertitel abgelöst wird.

PLAIN TEXT
Actionscript:
  1. <p begin="00:00:01.00" dur="00:00:05.00">Dies ist ein Untertitel</p>

3. Styles anwenden

Um beispielweise einen rechtsbündigen Text zu realisieren, muss man einen eigenen Style definieren. Der Style wird im Header angelegt und braucht eine eindeutige ID:

PLAIN TEXT
Actionscript:
  1. <style id="rechtsbuendig" tts:textAlign="right"/>

Nun kann man den Style auf eine Textzeile anwenden, indem man auf die ID verweist:

PLAIN TEXT
Actionscript:
  1. <p begin="00:00:01.00" dur="00:00:05.00" style="rechtsbuendig">Dies ist ein Untertitel</p>

Style "schachteln"

Nun ein weiteres Beispiel, das mehrere Styledefinitionen verwendet. Die dritte Zeile zeigt, dass man Style auch "schachteln" kann. Der Style "hinweis" nimmt den Style "rechtsbuendig" als Grundlage, wodurch man einen roten Hintergrund und einen rechtsbuendigen Text gleichzeitig erhält.

PLAIN TEXT
Actionscript:
  1. <style id="rechtsbuendig" tts:textAlign="right"/>
  2. <style id="schwarzerText" tts:color="black"/>
  3. <style id="hinweis" style="rechtsbuendig" tts:backgroundColor="red"/>

Die dazu passenden Aufrufe wären z.B.:

PLAIN TEXT
Actionscript:
  1. <p begin="00:00:01.00" style="rechtsbuendig">Dies ist ein Untertitel</p>
  2. <p begin="00:00:04.00" style="schwarzerText">Dies ist ein zweiter Text</p>
  3. <p begin="00:00:07.00" style="hinweis">Achtung: wichtiger Hinweis</p>

4. Hervorheben einzelner Wörter

Des Weiteren sind noch Auszeichnung von einzelnen Worten möglich:

PLAIN TEXT
Actionscript:
  1. <p begin="00:00:01.00">Dies ist ein <span tts:color="red">Untertitel</span></p>

5. Komplettes Beispiel

Als Abschluss eine komplette XML-Datei im Timed Text Format:

PLAIN TEXT
Actionscript:
  1. <?xml version="1.0" encoding="UTF-8"?>
  2.  <tt xml:lang="en" xmlns="http://www.w3.org/2006/04/ttaf1"  xmlns:tts="http://www.w3.org/2006/04/ttaf1#styling">
  3.   <head>
  4.    <styling>
  5.       <style id="rechtsbuendig" tts:textAlign="right"/>
  6.       <style id="schwarzerText" tts:color="black"/>
  7.       <style id="hinweis" style="rechtsbuendig" tts:backgroundColor="red"/>
  8.    </styling>
  9.  
  10.   </head>
  11.   <body>
  12.    <div xml:lang="en">
  13.     <p begin="00:00:01.00" style="rechtsbuendig">Dies ist ein <span tts:color="red">Untertitel</span></p>
  14.     <p begin="00:00:04.00" style="schwarzerText">Dies ist ein zweiter Text</p>
  15.     <p begin="00:00:07.00" style="hinweis">Achtung: wichtiger Hinweis</p>
  16.     </div>
  17.   </body>
  18. </tt>

Link: Beispiel der neuen Flash CS3 Komponente aus dem Artikel Closed Captions with Flash CS3's New FLV Captioning Component (flashcomguru.com)

Link: Using Timed Text captions (Flash CS3 Documentation)
Link: Timed Text Tags (alle unterstützten Tags der FLV Playback Komponente)
Link: Timed Text (TT) Authoring Format (W3C)