annotate DOCS/xml/de/skin.xml @ 32872:e91f07a9d5cd

Improve skin documentation.

<?xml version="1.0" encoding="utf-8"?>
<!-- in sync with r21612 -->
<!-- missing cosmetic commit 21537 -->
<appendix id="skin">
  <title><application>MPlayer</application>s Skinformat</title>

  <sect1 id="skin-overview">
    <title>Überblick</title>
    <para>
      Es hat nicht wirklich etwas mit dem Skinformat zu tun, aber du solltest
      wissen, dass <application>MPlayer</application> <emphasis role="bold">kein</emphasis>
      eingebautes Skin besitzt, also <emphasis role="bold">muss zumindest ein Skin
        installiert sein, damit das GUI verwendet werden kann.</emphasis>
    </para>

    <sect2 id="skin-overview-directories">
      <title>Verzeichnisse</title>
      <para>
        Die nach Skins durchsuchten Verzeichnisse sind (der Reihe nach):
        <orderedlist>
          <listitem>
            <para>
              <filename class="directory">$(DATADIR)/skins/</filename>
            </para>
          </listitem>
          <listitem>
            <para>
              <filename class="directory">$(PREFIX)/share/mplayer/skins/</filename>
            </para>
          </listitem>
          <listitem>
            <para>
              <filename class="directory">~/.mplayer/skins/</filename>
            </para>
          </listitem>
        </orderedlist>
      </para>

      <para>
        Beachte, dass der erste Pfad je nach Art der
        <application>MPlayer</application>-Konfiguration variieren kann
        (siehe Argumente <option>--prefix</option> und <option>--datadir</option>
        des <command>configure</command>-Scripts).
      </para>

      <para>
        Jedes Skin wird in sein eigenes Verzeichnis unterhalb einem der oben
        aufgeführten Verzeichnisse installiert, zum Beispiel:
        <screen>$(PREFIX)/share/mplayer/skins/default/</screen>
      </para>
    </sect2>

    <sect2 id="skin-overview-formats">
      <title>Bildformate</title>
      <para>
        Die Bilder müssen Truecolor-PNGs sein (24 oder 32 bpp).
      </para>

      <para>
        Im Hauptfenster und in der Abspielleiste (siehe unten) kannst du Bilder
        mit 'Transparenz' verwenden: Mit der Farbe #FF00FF (Magenta) gefüllte Bereiche
        sind beim Betrachten mit <application>MPlayer</application> voll transparent.
        Dies bedeutet, dass du sogar Formfenster haben kannst, wenn dein X-Server die
        XShape-Extension besitzt.
      </para>
    </sect2>

    <sect2 id="skin-overview-components">
      <title>Skin-Komponenten</title>
      <para>
        Skins sind ziemlich frei im Format (im Unterschied zu den Skins mit festem
        Format von <application>Winamp</application>/<application>XMMS</application>
        zum Beispiel), somit liegt es an dir, einen tollen zu kreieren.
      </para>

      <para>
        Zur Zeit sind vier Fenster zu dekorieren: das
        <link linkend="skin-file-main">Hauptfenster</link>, das
        <link linkend="skin-file-subwindow">Unterfenster</link>, die
        <link linkend="skin-file-main">Abspielleiste</link> und das
        <link linkend="skin-file-menu">Skin-Menü</link>.

        <itemizedlist>
          <listitem>
            <para>
              Mit dem <emphasis role="bold">Hauptfenster</emphasis> kontrolliert
              man den <application>MPlayer</application>.
              Die <emphasis role="bold">Abspielleiste</emphasis> erscheint im
              Vollbild-Modus, sobald man die Maus unten an den Bildschirm bewegt.
              Der Hintergrund der Fenster ist eine Grafik.
              Ins Fenster können (und müssen) diverse Elemente platziert werden:
              <emphasis>Buttons</emphasis>, <emphasis>Potentiometer</emphasis> (Schieberegler)
              und <emphasis>Labels</emphasis>.
              Für jedes Element musst du dessen Position und Größe angeben.
            </para>
            <para>
              Ein <emphasis role="bold">Button</emphasis> besitzt drei Zustände (gedrückt,
              losgelassen, deaktiviert), deshalb muss seine Grafik vertikal in drei Teile
              getrennt werden. Siehe Eintrag <link linkend="skin-button">Button</link>
              für mehr Details.
            </para>
            <para>
              Ein <emphasis role="bold">Potentiometer</emphasis> (hauptsächlich für
              die Suchleiste und die Lautstärke-/Balance-Regler) kann durch die Aufteilung
              der Grafik in verschiedene untereinander liegende Teile
              eine beliebige Anzahl von Phasen haben. Siehe
              <link linkend="skin-hpotmeter">hpotmeter</link> und
              <link linkend="skin-potmeter">potmeter</link> für Details.
            </para>
            <para>
              <emphasis role="bold">Labels</emphasis> sind ein wenig speziell: Die Zeichen,
              die man zu ihrer Darstellung benötigt, werden von einer Grafikdatei und
              die Zeichen in der Grafik durch eine
              <link linkend="skin-fonts">Schrift-Beschreibungsdatei</link> festgelegt.
              Letztere ist eine Volltextdatei, welche die x-,y-Position und Größe jedes
              Zeichens in der Grafik beschreibt (die Grafikdatei und ihre
              Schrift-Beschreibungsdatei bilden <emphasis>zusammen</emphasis> eine Schrift).
              Siehe
              <link linkend="skin-dlabel">dlabel</link>
              und
              <link linkend="skin-slabel">slabel</link> für Details.
            </para>
            <note>
              <para>
                Alle Grafiken können wie im Abschnitt über die
                <link linkend="skin-overview-formats">Grafikformate</link> erklärt
                volle Transparenz besitzen. Wenn der X-Server keine XShape-Extension
                unterstützt, werden die als transparent markierten Teile schwarz.
                Wenn du dieses Feature gerne nutzen möchtest, muss die Breite der
                Hintergrundgrafik des Hauptfensters durch 8 teilbar sein.
              </para>
            </note>
          </listitem>

          <listitem>
            <para>
              Das <emphasis role="bold">Unterfenster</emphasis> ist dort, wo der Film
              erscheint. Es kann eine festgelegte Grafik anzeigen, wenn kein Film geladen
              ist (es ist ziemlich langweilig, ein leeres Fenster vor sich zu haben :-))
              <emphasis role="bold">Beachte:</emphasis> Transparenz ist hier
              <emphasis role="bold">nicht erlaubt</emphasis>.
            </para>
          </listitem>

          <listitem>
            <para>
              Das <emphasis role="bold">Skin-Menü</emphasis> ist ganz einfach ein
              Weg, <application>MPlayer</application> mittels Menüeinträgen zu
              kontrollieren. Es wird durch die mittlere Maustaste aktiviert.
              Zwei Grafiken sind für das Menü erforderlich:
              eine davon ist die Basisgrafik, die den Normalzustand des Menüs darstellt,
              die andere wird zur Anzeige der gewählten Einträge verwendet.
              Wenn du das Menü aufklappst, wird die erste Grafik angezeigt. Bewegst du
              die Maus über die Menüeinträge, wird der aktuell gewählte Eintrag aus der
              zweiten Grafik über den Menüeintrag unterhalb des Mauszeigers kopiert
              (die zweite Grafik wird nie als ganzes angezeigt).
            </para>
            <para>
              Ein Menüeintrag wird definiert durch seine Position und Größe innerhalb
              der Grafik (sieh nach mehr Details im Abschnitt über das
              <link linkend="skin-file-menu">Skin-Menü</link>).
            </para>
          </listitem>
        </itemizedlist>
      </para>

      <para>
        Eine wichtige Sache wurde noch nicht aufgeführt: Damit Buttons, Potentiometer und
        Menüeinträge funktionieren, muss <application>MPlayer</application> wissen, was
        er machen soll, wenn sie angeklickt werden.
        Dies geschieht mittels <link linkend="skin-gui">Meldungen</link> (Ereignisse).
        Für diese Elemente musst du die beim Klick auf sie zu generierenden Meldungen
        definieren.
      </para>
    </sect2>

    <sect2 id="skin-files">
      <title>Dateien</title>
      <para>
        Du benötigst folgende Dateien, um ein Skin zu bauen:
        <itemizedlist>
          <listitem>
            <para>
              Die Konfigurationsdatei genannt <link linkend="skin-file">skin</link> erzählt
              <application>MPlayer</application>, wie unterschiedliche Teile des Skins
              zusammengefügt werden und was er tun soll, wenn du irgendwo innerhalb des Fenster
              hinklickst.
            </para>
          </listitem>
          <listitem>
            <para>
              Die Hintergrundgrafik fürs Hauptfenster.
            </para>
          </listitem>
          <listitem>
            <para>
              Grafiken für die Elemente im Hauptfenster (einschließlich einer oder mehrerer
              Schrift-Beschreibungsdateien zum Zeichnen der Labels).
            </para></listitem>
          <listitem>
            <para>
              Die Grafik, die im Unterfenster angezeigt werden soll (optional).
            </para>
          </listitem>
          <listitem>
            <para>
              Zwei Grafiken für das Skin-Menü (sie werden nur gebraucht, wenn du
              ein Menü erzeugen möchtest).
            </para>
          </listitem>
        </itemizedlist>
        Mit Ausnahme der skin-Konfigurationsdatei kannst du die anderen Dateien
        benennen, wie es dir beliebt (beachte aber, dass Schrift-Beschreibungsdateien
        eine <filename>.fnt</filename>-Erweiterung besitzen müssen).
      </para>
    </sect2>
  </sect1>

  <sect1 id="skin-file">
    <title>Die skin-Datei</title>
    <para>
      Wie oben erwähnt, ist dies die skin-Konfigurationsdatei. Sie ist
      Zeilen-orientiert;
      Kommentarzeilen beginnen mit einem '<literal>;</literal>' Semikolon
      am Zeilenanfang (es sind nur Leer- und Tabulator-Zeichen vor dem
      '<literal>;</literal>' erlaubt).
    </para>

    <para>
      Die Datei ist in Abschnitte unterteilt. Jeder Abschnitt beschreibt den Skin
      für eine Anwendung und besitzt folgende Form:
<programlisting><!--
-->section = <replaceable>Abschnittsname</replaceable>
.
.
.
end
</programlisting>
    </para>

    <para>
      Zur Zeit gibt es nur eine Anwendung, somit brauchst du nur einen Abschnitt:
      Sein Name ist <emphasis role="bold">movieplayer</emphasis>.
    </para>

    <para>
      Innerhalb dieses Abschnitts wird jedes Fenster durch einen Block folgender
      Form beschrieben:
<programlisting><!--
-->window = <replaceable>Fenstername</replaceable>
.
.
.
end
</programlisting>
    </para>

    <para>
      wobei <replaceable>Fenstername</replaceable> einer dieser Zeichenketten sein kann:
      <itemizedlist>
        <listitem><para><emphasis role="bold">main</emphasis> - für das Hauptfenster</para></listitem>
        <listitem><para><emphasis role="bold">sub</emphasis> - für das Unterfenster</para></listitem>
        <listitem><para><emphasis role="bold">playbar</emphasis> - für die Abspielleiste</para></listitem>
        <listitem><para><emphasis role="bold">menu</emphasis> - für das Skin-Menü</para></listitem>
      </itemizedlist>
    </para>

    <para>
      (Die sub-, playbar- und menu-Blöcke sind optional - es ist nicht
      nötig, das Unterfenster zu dekorieren, eine Abspielleiste zu haben
      oder ein Menü zu erzeugen. Ein Standard-Menü steht immer über die
      rechte Maustaste zur Verfügung.)
    </para>

    <para>
      Innerhalb des Fensterblocks kannst du jedes Element für das Fenster durch eine
      Zeile dieser Form definieren:
      <programlisting>Element = Parameter</programlisting>
      Wobei <literal>Element</literal> eine Zeichenkette ist, die den Typ des GUI-Elements
      identifiziert, <literal>Parameter</literal> ist ein numerischer oder textueller
      Wert (oder eine Liste Komma-getrennter Werte).
    </para>

    <para>
      Fügt man nun das oben genannte zusammen, sieht die komplette Datei etwa so aus:
<programlisting><!--
-->section = movieplayer
window = main
; ... Elemente für das Hauptfenster ...
end

window = sub
; ... Elemente für das Unterfenster ...
end

window = menu
; ... Elemente für das Menü ...
end

window = playbar
; ... Elemente für die Abspielleiste ...
end
end
</programlisting>
    </para>

    <para>
      Der Name einer Grafikdatei muss ohne führende Pfadangaben angegeben werden -
      Grafiken werden im Verzeichnis <filename class="directory">skins</filename>
      gesucht.
      Du kannst (musst aber nicht) die Erweiterung der Datei spezifizieren.
      Existiert die Datei nicht, versucht <application>MPlayer</application> die Datei
      <filename>&lt;Dateiname&gt;.&lt;ext&gt;</filename> zu laden, wobei
      <literal>png</literal> und <literal>PNG</literal> als
      <filename>&lt;ext&gt;</filename> (Erweiterung) probiert werden
      (in dieser Reihenfolge). Die erste zutreffende Datei wird verwendet.
    </para>

    <para>
      Zum Schluss einige Worte zur Positionierung.
      Hauptfenster und Unterfenster können in verschiedenen Ecken des Bilschirms
      über die <literal>X</literal>- und <literal>Y</literal>-Koordinaten
      platziert werden. <literal>0</literal> ist oben oder links,
      <literal>-1</literal> bedeutet zentriert und <literal>-2</literal> ist
      rechts oder unten, wie in dieser Illustration gezeigt:
    </para>
    <informalfigure>
      <screen><!--
-->(0, 0)----(-1, 0)----(-2, 0)
|          |          |
|          |          |
(0,-1)----(-1,-1)----(-2,-1)
|          |          |
|          |          |
(0,-2)----(-1,-2)----(-2,-2)<!--
-->      </screen>
    </informalfigure>

    <para>
      Hier ein Beispiel, um es zu verdeutlichen. Angenommen, du hast eine Grafik
      mit Namen <filename>main.png</filename>, die du für das Hauptfenster nutzt:
      <programlisting>base = main, -1, -1</programlisting>
      <application>MPlayer</application> versucht, die Dateien
      <filename>main</filename>,
      <filename>main.png</filename>,
      <filename>main.PNG</filename>
      zu laden.
    </para>


    <sect2 id="skin-file-main">
      <title>Hauptfenster und Abspielleiste</title>
      <para>
        Unten steht eine Liste von Einträgen, die in den Blöcken
        '<literal>window = main</literal>' ... '<literal>end</literal>',
        und '<literal>window = playbar</literal>' ... '<literal>end</literal>'
        genutzt werden können.
      </para>

      <variablelist>
        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-main-base"/>base = image, X, Y
            </literal>
          </term>
          <listitem>
            <para>
              Lässt dich die Hintergrundgrafik fürs Hauptfenster spezifizieren.
              Das Fenster wird an der angegebenen Position <literal>X,Y</literal> auf
              dem Bildschirm erscheinen. Es wird die Größe der Grafik besitzen.
            </para>
            <note>
              <para>
                Diese Koordinaten funktionieren im Moment nicht beim Anzeigefenster.
              </para>
            </note>
            <warning>
              <para>
                Transparente Bereiche innerhalb der Grafik (mit der Farbe #FF00FF) erscheinen
                auf X-Servern ohne die XShape-Extension schwarz. Die Breite der Grafik muss
                durch 8 teilbar sein.
              </para>
            </warning>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-button"/>button = image, X, Y, width, height, message
            </literal>
          </term>
          <listitem>
            <para>
              Platziere einen Button mit der Größe <literal>width</literal> * <literal>height</literal>
              an Position <literal>X,Y</literal>. Die angegebene <literal>message</literal> wird
              erzeugt, wenn der Button angeklickt wird. Die mittels <literal>image</literal>
              festgelegte Grafik muss drei untereinander liegende Teile aufweisen (entsprechend
              der möglichen Zustände des Buttons), etwa so:
            </para>
            <informalfigure>
              <screen>
+---------------+
|    gedrückt   |
+---------------+
|  losgelassen  |
+---------------+
|  deaktiviert  |
+---------------+<!--
              --></screen>
            </informalfigure>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-decoration"/>decoration = enable|disable
            </literal>
          </term>
          <listitem>
            <para>
              Aktiviere oder deaktiviere die Fenstermanager-Dekoration des Hauptfensters.
              Standard ist <emphasis role="bold">disable</emphasis>.
            </para>
            <note>
              <para>
                Dies funktioniert nicht beim Anzeigefenster, dort braucht man es nicht.
              </para>
            </note>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-hpotmeter"/>hpotmeter = button, bwidth, bheight, phases, numphases, default, X, Y, width, height, message
            </literal>
          </term>
          <listitem>
            <para></para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-vpotmeter"/>vpotmeter = button, bwidth, bheight, phases, numphases, default, X, Y, width, height, message
            </literal>
          </term>
          <listitem>
            <para>
              Platziere einen horizontal (hpotmeter) oder vertikal (vpotmeter) Potentiometer mit
              der Größe <literal>width</literal> * <literal>height</literal> an Position
              <literal>X,Y</literal>. Die Grafik kann in unterschiedliche Teile für die
              verschiedenen Phasen des Potentiometers aufgeteilt werden (du kannst zum Beispiel
              eines für die Lautstärkeregelung haben, das von rot nach grün wechselt, während sich
              sein Wert vom Minimum zum Maximum ändert.).
              <literal>hpotmeter</literal> kann einen Button besitzen, der horizontal gezogen
              werden kann. Die Parameter sind:
            </para>
            <itemizedlist>
              <listitem>
                <para>
                  <literal>button</literal> - die für den Button zu verwendende
                  Grafik (muss drei untereinander liegende Teile aufweisen, wie im Fall des
                  <link linkend="skin-button">Buttons</link>)
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>bwidth</literal>, <literal>bheight</literal> - Größe des Buttons
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>phases</literal> - die für die verschiedenen Phasen
                  zu verwendende Grafik des hpotmeter. Ein spezieller Wert von <literal>NULL</literal>
                  kann benutzt werden, wenn du keine solche Grafik anwenden willst. Die Grafik muss
                  vertikal in <literal>numphases</literal> Teile wie folgt aufgeteilt werden:
                </para>
                <informalfigure>
                  <screen>
+------------+
|  phase #1  |
+------------+
|  phase #2  |
+------------+
     ...
+------------+
|  phase #n  |
+------------+<!--
                  --></screen>
                </informalfigure>
              </listitem>
              <listitem>
                <para>
                  <literal>numphases</literal> - Anzahl der Phasen, die in der
                  <literal>phases</literal>-Grafik untergebracht sind
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>default</literal> - Standardwert für hpotmeter
                  (im Bereich <literal>0</literal> bis <literal>100</literal>)
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>X</literal>, <literal>Y</literal> - Position fürs hpotmeter
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>width</literal>, <literal>height</literal> - Breite und Höhe
                  des <literal>hpotmeter</literal>
                </para>
              </listitem>
              <listitem>
                <para>
                  <literal>message</literal> - die Meldung, die erzeugt werden soll,
                  wenn der Wert des <literal>hpotmeter</literal> geändert wird
                </para>
              </listitem>
            </itemizedlist>

          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-potmeter"/>potmeter = phases, numphases, default, X, Y, width, height, message
            </literal>
          </term>
          <listitem>
            <para>
              Ein <literal>hpotmeter</literal> ohne einen Button. (ich schätze, es ist dazu
              bestimmt, herumgedreht zu werden, reagiert aber nur auf horizontales Ziehen.)
              Eine Beschreibung der Parameter findest du unter
              <link linkend="skin-hpotmeter">hpotmeter</link>.
              <literal>phases</literal> können <literal>NULL</literal> sein, dies ist aber ziemlich
              sinnlos, da du nicht sehen kannst, wo das <literal>Potentiometer</literal> hingesetzt
              wurde.
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-font"/>font = fontfile
            </literal>
          </term>
          <listitem>
            <para>
              Definiert eine Schrift. <literal>fontfile</literal> ist der Name der
              Schrift-Beschreibungsdatei mit der Erweiterung <filename>.fnt</filename>
              (gib hier keine Erweiterung an) und
              wird verwendet, um auf die Schrift zu verweisen
              (siehe <link linkend="skin-dlabel">dlabel</link>
              und <link linkend="skin-slabel">slabel</link>). Bis zu 25 Schriften können
              definiert werden.
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-slabel"/>slabel = X, Y, fontfile, "text"
            </literal>
          </term>
          <listitem>
            <para>
              Platziere ein statisches Label an Position <literal>X,Y</literal>.
              <literal>text</literal> wird mittels der identifizierten
              <literal>fontfile</literal> angezeigt. Der Text ist einfach ein
              eine Ausgangszeichenkette (<literal>$x</literal>-Variablen funktionieren nicht),
              eingeschlossen von doppelten Anführungszeichen (das "-Zeichen kann jedoch
              nicht Teil des Textes sein).
              Das Label wird mittels der über die <literal>fontfile</literal> identifizierten
              Schrift angezeigt.
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-dlabel"/>dlabel = X, Y, length, align, fontfile, "text"
            </literal>
          </term>
          <listitem>
            <para>
              Platziere ein dynamisches Label an Position <literal>X,Y</literal>.
              Das Label wird als dynamisch bezeichnet, weil sein Text periodisch
              aktualisiert wird. Die Maximallänge des Labels wird mit dem
              Wert <literal>length</literal> vorgegeben (seine Höhe ist die der
              Zeichen).
              Wird der anzuzeigende Text breiter als dieser Wert, wird er gescrollt,
              andernfalls wird er innerhalb des Mittels des Wertes des vom
              <literal>align</literal>-Parameter festgelegten Zwischenraums ausgerichtet:
              <literal>0</literal> steht für rechts,
              <literal>1</literal> steht für zentriert,
              <literal>2</literal> steht für links.
            </para>
            <para>
              Der anzuzeigende Text wird mit <literal>text</literal> festgelegt:
              Er muss zwischen doppelten Anführungszeichen stehen (das "-Zeichen kann jedoch
              nicht Teil des Textes sein).
              Das Label wird mittels der über die <literal>fontfile</literal> identifizierten
              Schrift angezeigt.
              Du kannst folgende Variablen im Text verwenden:
            </para>

            <informaltable>
              <tgroup cols="2">
                <thead>
                  <row><entry>Variable</entry><entry>Bedeutung</entry></row>
                </thead>
                <tbody>
                  <row>
                    <entry>$1</entry>
                    <entry>Abspieldauer im <emphasis>hh:mm:ss</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$2</entry>
                    <entry>Abspieldauer im <emphasis>mmmm:ss</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$3</entry>
                    <entry>Abspieldauer im <emphasis>hh</emphasis>-Format (Stunden)</entry>
                  </row>
                  <row>
                    <entry>$4</entry>
                    <entry>Abspieldauer im <emphasis>mm</emphasis>-Format (Minuten)</entry>
                  </row>
                  <row>
                    <entry>$5</entry>
                    <entry>Abspieldauer im <emphasis>ss</emphasis>-Format (Sekunden)</entry>
                  </row>
                  <row>
                    <entry>$6</entry>
                    <entry>Filmlänge im <emphasis>hh:mm:ss</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$7</entry>
                    <entry>Filmlänge im <emphasis>mmmm:ss</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$8</entry>
                    <entry>Abspieldauer im <emphasis>h:mm:ss</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$v</entry>
                    <entry>Lautstärke im <emphasis>xxx.xx</emphasis>%-Format</entry>
                  </row>
                  <row>
                    <entry>$V</entry>
                    <entry>Lautstärke im <emphasis>xxx.xx</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$b</entry>
                    <entry>Balance im <emphasis>xxx.xx</emphasis>%-Format</entry>
                  </row>
                  <row>
                    <entry>$B</entry>
                    <entry>Balance in <emphasis>xxx.xx</emphasis>-Format</entry>
                  </row>
                  <row>
                    <entry>$$</entry>
                    <entry>das $-Zeichen</entry>
                  </row>
                  <row>
                    <entry>$a</entry>
                    <entry>
                      ein dem Audio-Typ entsprechendes Zeichen (Nichts: <literal>n</literal>,
                      Mono: <literal>m</literal>, Stereo: <literal>t</literal>)
                    </entry>
                  </row>
                  <row>
                    <entry>$t</entry>
                    <entry>Track-Nummer (in der Playliste)</entry>
                  </row>
                  <row>
                    <entry>$o</entry>
                    <entry>Dateiname</entry>
                  </row>
                  <row>
                    <entry>$f</entry>
                    <entry>Dateiname in kleinbuchstaben</entry>
                  </row>
                  <row>
                    <entry>$F</entry>
                    <entry>Dateiname in GROSSBUCHSTABEN</entry>
                  </row>
                  <row>
                    <entry>$T</entry>
                    <entry>
                      Ein dem Streamtyp entsprechendes Zeichen (Datei: <literal>f</literal>,
                      Video-CD: <literal>v</literal>, DVD: <literal>d</literal>, URL: <literal>u</literal>)
                    </entry>
                  </row>
                  <row>
                    <entry>$p</entry>
                    <entry>
                      Das <keycap>p</keycap>-Zeichen (wenn ein Film abgespielt wird und die Schrift
                      das Zeichen <keycap>p</keycap> enthält)
                    </entry>
                  </row>
                  <row>
                    <entry>$s</entry>
                    <entry>
                      Das <keycap>s</keycap>-Zeichen (wenn ein Film angehalten wird und die Schrift
                      das Zeichen <keycap>s</keycap> enthält)
                    </entry>
                  </row>
                  <row>
                    <entry>$e</entry>
                    <entry>
                      Das <keycap>e</keycap>-Zeichen (wenn ein Film pausiert wird und die Schrift
                      das Zeichen <keycap>e</keycap> enthält)
                    </entry>
                  </row>
                  <row>
                    <entry>$x</entry>
                    <entry>Filmbreite</entry>
                  </row>
                  <row>
                    <entry>$y</entry>
                    <entry>Filmhöhe</entry>
                  </row>
                  <row>
                    <entry>$C</entry>
                    <entry>Name des verwendeten Codecs</entry>
                  </row>

                </tbody>
              </tgroup>
            </informaltable>
          </listitem>

        </varlistentry>
      </variablelist>

      <note>
        <para>
          Die Variablen <literal>$a, $T, $p, $s</literal> und <literal>$e</literal>
          geben alle Zeichen zurück, die als spezielle Symbole angezeigt werden sollen
          (zum Beispiel steht <keycap>e</keycap> für das Pause-Symbol, welches gewöhnlich
          etwa so || aussieht).
          Du solltest eine Schrift für normale Zeichen und eine weitere Schrift für
          Symbole haben. Schau in den Abschnitt über
          <link linkend="skin-fonts-symbols">Symbole</link>
          für mehr Informationen.
        </para>
      </note>
    </sect2>

    <sect2 id="skin-file-subwindow">
      <title>Unterfenster</title>
      <para>
        Die folgenden Einträge können in diesem Block verwendet werden
        '<literal>window = sub</literal>' . . . '<literal>end</literal>'.
      </para>

      <variablelist>
        <varlistentry>
          <term>
            <literal><anchor id="skin-sub-base"/>base = image, X, Y, Breite, Hoehe</literal>
          </term>
          <listitem>
            <para>
              Die im Fenster anzuzeigende Grafik. Das Fenster wird an der angegebenen
              Position <literal>X,Y</literal> auf dem Bildschirm erscheinen
              (<literal>0,0</literal> ist die obere linke Ecke).
              Du kannst <literal>-1</literal> für zentriert und <literal>-2</literal>
              für rechts (<literal>X</literal>) und unten (<literal>Y</literal>) festlegen.
              Das Fenster wird so groß sein wie die Grafik.
              <literal>Breite</literal> und <literal>Höhe</literal>
              kennzeichnen die Größe des Fensters; sie sind optional (wenn sie fehlen, hat
              das Fenster dieselbe Größe wie die Grafik).
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal><anchor id="skin-background"/>background = R, G, B</literal>
          </term>
          <listitem>
            <para>
              Lässt dich die Hintergrundfarbe setzen. Dies ist von Nutzen, wenn die Grafik
              kleiner ist als das Fenster.
              <literal>R</literal>, <literal>G</literal> und <literal>B</literal>
              spezifizieren die Rot-, Grün- und Blau-Komponenten der Farbe (jede davon ist
              eine Dezimalzahl von 0 bis 255).
            </para>
          </listitem>
        </varlistentry>
      </variablelist>
    </sect2>

    <sect2 id="skin-file-menu">
      <title>Skin-Menü</title>
      <para>
        Wie bereits zuvor erwähnt, wird das Menü mittels zweier Grafiken dargestellt.
        Normale Menüeinträge werden aus der Grafik entnommen, die durch das Element
        <literal>base</literal> festgelegt sind, während der aktuell gewählte Eintrag
        aus der Grafik entnommen wird, die durch das Element <literal>selected</literal>
        spezifiziert wurde. Du musst Position und Größe jedes Menüeintrags mittels des
        Elements <literal>menu</literal> definieren.
      </para>

      <para>
        Die folgenden Einträge können im Block
        '<literal>window = menu</literal>'. . .'<literal>end</literal>' genutzt werden.
      </para>

      <variablelist>
        <varlistentry>
          <term>
            <literal><anchor id="skin-menu-base"/>base = image</literal>
          </term>
          <listitem>
            <para>
              Die Grafik für normale Menüeinträge.
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-selected"/>selected = image
            </literal>
          </term>
          <listitem>
            <para>
              Die Grafik, die das Menü mit allen gewählten Einträgen anzeigt.
            </para>
          </listitem>
        </varlistentry>

        <varlistentry>
          <term>
            <literal>
              <anchor id="skin-menu"/>menu = X, Y, Breite, Höhe, Nachricht
            </literal>
          </term>
          <listitem>
            <para>
              Definiert die Position <literal>X,Y</literal> und die Größe eines Menüeintrags
              innerhalb der Grafik. <literal>Nachricht</literal> ist die Meldung, die erzeugt
              werden soll, wenn die Maustaste über dem Eintrag losgelassen wird.
            </para>
          </listitem>
        </varlistentry>
      </variablelist>
    </sect2>
  </sect1>

  <sect1 id="skin-fonts">
    <title>Schriften</title>
    <para>
      Wie im Abschnitt über die Skin-Teile beschrieben, wird eine Schrift durch eine
      Grafik und eine Beschreibungsdatei definiert. Du kannst die Zeichen irgendwo
      innerhalb der Grafik platzieren, aber stell sicher, dass Position und Größe
      der Zeichen in der Beschreibungsdatei exakt angegeben sind.
    </para>

    <para>
      Die Schrift-Beschreibungsdatei (mit Erweiterung <filename>.fnt</filename>)
      kann mit '<literal>;</literal>' beginnende Kommentarzeilen enthalten.
      Die Datei muss eine Zeile in der Form enthalten
      <anchor id="skin-font-image"/>
      <programlisting>image = <replaceable>image</replaceable></programlisting>
      Wobei <literal><replaceable>image</replaceable></literal> der Name der für
      die Schrift anzuwendenden Grafikdatei ist (du musst keine Erweiterung angeben).
      <anchor id="skin-font-char"/>
      <programlisting>"char" = X, Y, width, hight</programlisting>
      Hier legen <literal>X</literal> und <literal>Y</literal> die Position des
      <literal>char</literal>-Zeichens innerhalb der Grafik fest
      (<literal>0,0</literal> steht für die obere linke Ecke).
      <literal>width</literal> und <literal>height</literal> sind die Maße der
      Zeichen in Pixel. Das Zeichen kann in UTF-8-Kodierung angegeben werden.
    </para>

    <para>
      Dieses Beispiel definiert die Zeichen A, B, C unter Anwendung von
      <filename>font.png</filename>.
      <programlisting>
; Kann eine "Schrift" anstatt "font.png" sein.
image = font.png

; Drei Zeichen reichen zu Demonstrationszwecken :-)
"A" =  0,0, 7,13
"B" =  7,0, 7,13
"C" = 14,0, 7,13<!--
      --></programlisting>
    </para>

    <sect2 id="skin-fonts-symbols">
      <title>Symbole</title>
      <para>
        Einige Zeichen haben spezielle Bedeutungen, wenn sie von bestimmten
        Variablen in <link linkend="skin-dlabel">dlabel</link> zurückgegeben
        werden. Diese Zeichen sind dazu gedacht, als Symbole angezeigt zu werden,
        so dass Dinge wie ein hübsches DVD-Logo an Stelle des Zeichens
        '<literal>d</literal>' für einen DVD-Stream angezeigt werden können.
      </para>
      <para>
        Die folgende Tabelle listet alle Zeichen auf, die zum Anzeigen von
        Symbolen genutzt werden können (und daher eine andere Schrift benötigen).
      </para>

      <informaltable>
        <tgroup cols="2">
          <thead>
            <row><entry>Zeichen</entry><entry>Symbol</entry></row>
          </thead>
          <tbody>
            <row><entry><keycap>p</keycap></entry><entry>Play</entry></row>
            <row><entry><keycap>s</keycap></entry><entry>Stop</entry></row>
            <row><entry><keycap>e</keycap></entry><entry>Pause</entry></row>
            <row><entry><keycap>n</keycap></entry><entry>Kein Sound</entry></row>
            <row><entry><keycap>m</keycap></entry><entry>Mono-Sound</entry></row>
            <row><entry><keycap>t</keycap></entry><entry>Stereo-Sound</entry></row>
            <row><entry><keycap>f</keycap></entry><entry>Stream ist eine Datei</entry></row>
            <row><entry><keycap>v</keycap></entry><entry>Stream ist eine Video-CD</entry></row>
            <row><entry><keycap>d</keycap></entry><entry>Stream ist eine DVD</entry></row>
            <row><entry><keycap>u</keycap></entry><entry>Stream ist eine URL</entry></row>
          </tbody>
        </tgroup>
      </informaltable>
    </sect2>
  </sect1>

  <sect1 id="skin-gui">
    <title>GUI-Meldungen</title>
    <para>
      Dies sind die Meldungen, die von Buttons, Potentiometern und
      Menüeinträgen generiert werden können.
    </para>

    <variablelist>
      <title>Playback-Kontrolle:</title>
      <varlistentry>
        <term><emphasis role="bold">evNext</emphasis></term>
        <listitem>
          <para>Springe zum nächsten Track in der Playliste.</para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPause</emphasis></term>
        <listitem><para>
            Formt einen Schalter zusammen mit <literal>evPlaySwitchToPause</literal>.
            Sie können dazu benutzt werden, einen gebräuchlichen Play/Pause-Button
            zu bekommen. Beide Meldungen sollten den Buttons zugewiesen werden, die
            an genau derselben Position innerhalb des Fensters dargestellt werden.
            Diese Meldung pausiert das Abspielen und die Grafik für den
            <literal>evPlaySwitchToPause</literal>-Button wird gezeigt
            (um anzudeuten, dass der Button zum Fortsetzen des Abspielens gedrückt
            werden kann).
          </para></listitem>
      </varlistentry>

      <varlistentry>
        <term>
          <emphasis role="bold">evPlay</emphasis>
        </term>
        <listitem>
          <para>
            Starte das Abspielen.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPlaySwitchToPause</emphasis></term>
        <listitem>
          <para>
            Das Gegenteil von <literal>evPauseSwitchToPlay</literal>. Diese Meldung
            startet das Abspielen und die Grafik für den
            <literal>evPauseSwitchToPlay</literal>-Button wird angezeigt
            (um anzudeuten, dass der Button zum Pausieren des Abspielvorgangs gedrückt
            werden kann).
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPrev</emphasis></term>
        <listitem>
          <para>
            Springe zum vorherigen Track in der Playliste.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evStop</emphasis></term>
        <listitem>
          <para>Stoppe das Abspielen.</para>
        </listitem>
      </varlistentry>
    </variablelist>

    <variablelist>
      <title>Springen:</title>
      <varlistentry>
        <term><emphasis role="bold">evBackward10sec</emphasis></term>
        <listitem>
          <para>
            Springe 10 Sekunden rückwärts.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evBackward1min</emphasis></term>
        <listitem>
          <para>
            Springe 1 Minute rückwärts.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evBackward10min</emphasis></term>
        <listitem><para>
            Springe 10 Minuten rückwärts.
          </para></listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evForward10sec</emphasis></term>
        <listitem>
          <para>
            Springe 10 Sekunden vorwärts.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evForward1min</emphasis></term>
        <listitem>
          <para>
            Springe 1 Minute vorwärts.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evForward10min</emphasis></term>
        <listitem>
          <para>
            Springe 10 Minuten vorwärts.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSetMoviePosition</emphasis></term>
        <listitem>
          <para>
            Springe zu Position (kann von einem Potentiometer genutzt werden;
            mit dem relativen Wert (0-100%) des Potentiometers).
          </para>
        </listitem>
      </varlistentry>
    </variablelist>

    <variablelist>
      <title>Video-Kontrolle:</title>
      <varlistentry>
        <term><emphasis role="bold">evHalfSize</emphasis></term>
        <listitem>
          <para>
            Setze das Filmfenster auf halbe Größe.
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term><emphasis role="bold">evDoubleSize</emphasis></term>
        <listitem>
          <para>
            Setze das Filmfenster auf doppelte Größe.
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term><emphasis role="bold">evFullScreen</emphasis></term>
        <listitem>
          <para>
            Schalte Vollbildmodus an/aus.
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term><emphasis role="bold">evNormalSize</emphasis></term>
        <listitem>
          <para>
            Setze das Filmfenster auf normale Größe.
          </para>
        </listitem>
      </varlistentry>
    </variablelist>

    <variablelist>
      <title>Audio-Kontrolle:</title>
      <varlistentry>
        <term><emphasis role="bold">evDecAudioBufDelay</emphasis></term>
        <listitem>
          <para>
            Verringere die Verzögerung des Audiopuffers.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evDecBalance</emphasis></term>
        <listitem>
          <para>
            Verringere die Balance.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evDecVolume</emphasis></term>
        <listitem><para>
            Verringere die Lautstärke.
          </para></listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evIncAudioBufDelay</emphasis></term>
        <listitem>
          <para>
            Erhöhe die Verzögerung des Audiopuffers.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evIncBalance</emphasis></term>
        <listitem>
          <para>
            Erhöhe die Balance.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evIncVolume</emphasis></term>
        <listitem>
          <para>
            Erhöhe die Lautstärke.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evMute</emphasis></term>
        <listitem>
          <para>
            Schalte den Ton an/aus.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSetBalance</emphasis></term>
        <listitem>
          <para>
            Setze die Balance (kann von einem Potentiometer genutzt werden;
            mit dem relativen Wert (0-100%) des Potentiometers).
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSetVolume</emphasis></term>
        <listitem>
          <para>
            Setze die Lautstärke(kann von einem Potentiometer genutzt werden;
            mit dem relativen Wert (0-100%) des Potentiometers).
          </para>
        </listitem>
      </varlistentry>
    </variablelist>

    <variablelist>
      <title>Verschiedenes:</title>
      <varlistentry>
        <term><emphasis role="bold">evAbout</emphasis></term>
        <listitem>
          <para>
            Öffne das About-Fenster.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evDropSubtitle</emphasis></term>
        <listitem>
          <para>
            Deaktiviert den aktuell verwendeten Untertitel.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evEqualizer</emphasis></term>
        <listitem>
          <para>
            Schaltet den Equalizer an/aus.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evExit</emphasis></term>
        <listitem>
          <para>
            Schließe das Programm.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evIconify</emphasis></term>
        <listitem>
          <para>
            Minimiere das Fenster zu einem Symbol.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evLoad</emphasis></term>
        <listitem>
          <para>
            Lade eine Datei (durch Öffnen des Datei-Browser-Fensters,
            in dem du die Datei wählen kannst).
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evLoadPlay</emphasis></term>
        <listitem>
          <para>
            Macht dasselbe wie <literal>evLoad</literal>, es startet jedoch
            das Abspielen nach dem Laden der Datei automatisch.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evLoadSubtitle</emphasis></term>
        <listitem>
          <para>
            Lädt eine Untertiteldatei (mit dem Dateiwähler)
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evLoadAudioFile</emphasis></term>
        <listitem>
          <para>
            Lädt eine Audio-Datei (mit dem Dateiwähler)
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evNone</emphasis></term>
        <listitem>
          <para>
            Leere Meldung, besitzt keinen Effekt (außer vielleicht in Subversion-Versionen :-)).
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPlaylist</emphasis></term>
        <listitem>
          <para>
            Öffne/schließe das Playlisten-Fenster.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPlayDVD</emphasis></term>
        <listitem>
          <para>
            Versucht die DVD im angegebenen DVD-ROM-Laufwerk zu öffnen.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPlayVCD</emphasis></term>
        <listitem>
          <para>
            Versucht die VCD im angegebenen CD-ROM-Laufwerk zu öffnen.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evPreferences</emphasis></term>
        <listitem>
          <para>
            Öffne das Einstellungsfenster.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSetAspect</emphasis></term>
        <listitem>
          <para>
            Setzt das angezeigte Grafikseitenverhältnis.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSetURL</emphasis></term>
        <listitem>
          <para>
            Zeigt das URL-Dialog-Fenster.
          </para>
        </listitem>
      </varlistentry>

      <varlistentry>
        <term><emphasis role="bold">evSkinBrowser</emphasis></term>
        <listitem>
          <para>
            Öffne das Skin-Browser-Fenster.
          </para>
        </listitem>
      </varlistentry>
    </variablelist>

  </sect1>

  <sect1 id="skin-quality">
    <title>Erstellen von qualitativen Skins</title>

    <para>
      Jetzt hast du dich über das Herstellen eines Skins für das
      <application>MPlayer</application>-GUI informiert, in
      <application>Gimp</application> dein bestes gegeben und willst
      deinen Skin an uns schicken?
      Lies weiter, dann findest du einige Vorgaben dafür, wie häufige Irrtümer
      vermieden und hochqualitative Skins erstellt werden können.
    </para>

    <para>
      Wir wollen, dass Skins, die wir in unser Repository einfügen,
      bestimmten Qualitätsstandards entsprechen. Du kannst auch vieles
      dazutun, uns das Leben leichter zu machen.
    </para>

    <para>
      Als ein Beispiel kannst du dir den <systemitem>Blue</systemitem>-Skin
      ansehen. Er genügt seit Version 1.5 allen unten aufgelisteten Kriterien.
    </para>

    <itemizedlist>
      <listitem>
        <para>
          Jeder Skin sollte mit einer
          <filename>README</filename>-Datei kommen, die Informationen über
          dich, den Autor, Copyright- und Lizenzanmerkungen und alles, was du
          sonst noch anfügen willst, enthält.
          Willst du ein Changelog, ist diese Datei ein geeigneter Ort dafür.
        </para>
      </listitem>

      <listitem>
        <para>
          Es sollte eine Datei namens <filename>VERSION</filename>
          mit nicht mehr als der Versionsnummer des Skins in einer einzigen
          Zeile geben (z.B. 1.0).
        </para>
      </listitem>

      <listitem>
        <para>
          Horizontale und vertikale Regler (wie die für Lautstärke
          oder Position) sollten die Mitte des Knaufs sauber in der Mitte
          des Reglers zentriert haben. Es sollte möglich sein, den Knauf
          an beide Enden des Reglers zu bewegen, jedoch nicht darüber hinaus.
        </para>
      </listitem>

      <listitem>
        <para>
          Für Skin-Elemente sollten die richtigen Größen in der skin-Datei
          deklariert sein. Ist dies nicht der Fall, kannst du außerhalb
          z.B. eines Buttons klicken und trotzdem einen Klick innerhalb
          seiner Fläche auslösen und diesen dennoch nicht auslösen.
        </para>
      </listitem>

      <listitem>
        <para>
          Die <filename>skin</filename>-Datei sollte sauber
          aussehen und keine Tabs enthalten. Mit sauber aussehen ist
          gemeint, dass die Zahlen ordentlich in Reihe stehen.
        </para>
      </listitem>
    </itemizedlist>

  </sect1>

</appendix>