diff options
Diffstat (limited to 'files/de/archive/mozilla/xul/xul_tutorial')
8 files changed, 0 insertions, 1019 deletions
diff --git a/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html b/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html deleted file mode 100644 index e742e6f280..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/die_chrome_url/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: Die Chrome URL -slug: Archive/Mozilla/XUL/XUL_Tutorial/Die_Chrome_URL -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/The_Chrome_URL ---- -<p>{{ PreviousNext("XUL_Tutorial/XUL_Struktur", "XUL_Tutorial/Manifest_Dateien") }}</p> -<p>Der folgende Abschnitt beschreibt wie man Bezug zu weiteren XUL-Dokumenten und Chrome-Dateien herstellen kann.</p> -<h3 id="Die_Chrome-URL">Die Chrome-URL</h3> -<p>XUL-Dateien können über eine reguläre HTTP-URL (oder jeder andere Typ einer URL) genau wie HTML-Dateien aufgerufen werden. Pakete, die jedoch in Mozillas chrome-System gespeichert sind, können mit speziellen chrome-URLs aufgerufen werden. Die Pakete, die in Mozilla vorhanden sind, sind bereits installiert und Sie können zudem Ihre eigenen registrieren.</p> -<p>Installierte Pakete haben den Vorteil, dass sie über keine Sicherheitsbeschränkungen verfügen, welche für viele Anwendungen von Bedeutung sind. Ein weitere Vorteil gegenüber anderen URL-Typen ist, dass sie automatisch mehrere Themes und Orte handhaben. Eine chrome-URL kann sich auf eine Theme-Datei beziehen, ohne zu wissen, welches Theme überhaupt installiert ist. Da die Dateinamen in allen Themes die gleichen sind, können Sie einfach eine Datei beziehen, die über die chrome-URL angegeben wird. Mozilla bestimmt dann wo die Datei zu finden ist und gibt dann die richtige Datei zurück. Das bedeutet auch, dass es egal ist wo das Paket installiert ist. Die chrome-URLs sind unabhängig davon wo die Dateien tatsächlich liegen. Das vereinfacht es ungemein Anwendungen zu schreiben, die eine Vielzahl von Dateien verwendet und Sie sich keine Gedanken machen brauchen, wo Sie die Dateien speichern.</p> -<p>Die grundlegende Schreibweise einer chrome-URL ist die folgende:</p> -<pre class="eval">chrome://<em><package name></em>/<em><part></em>/<em><file.xul></em> -</pre> -<p>Der Platzhalter <em><package name></em> ist der Paketname, wie z.B. messenger oder editor. Alle Paketnamen sind case-insensitiv, aber Kleinbuchstaben werden bevorzugt. <em><part></em> ist entweder 'content', 'skin' oder 'locale', abhängig davon, welchen Teil sie möchten. <em><file.xul></em> ist einfach der Dateiname.</p> -<p><strong>Beispiel</strong>: <a class="external" rel="freelink">chrome://messenger/content/messenger.xul</a></p> -<p>Das Beispiel hier bezieht sich auf das Messenger-Fenster. Sie könnten sich auch auf eine Datei beziehen, die Teil eines Skins ist, indem Sie 'content' durch 'skin' ersetzen und den Dateinamen entsprechend ändern. Genauso könnten Sie 'locale' statt 'content' angeben.</p> -<p>Wenn Sie eine chrome-URL öffnen, schaut Mozilla durch die Liste der installierten Pakete und versucht eine JAR-Datei oder ein Verzeichnis zu finden, das auf den angeben Paketnamen und <part> zutrifft. Die Zuordnung von chrome-URLs und JAR-Dateien sind in den Manifest-Dateien festgelegt, welche sich im chrome-Verzeichnis befinden. Wenn Sie die messenger.jar-Datei verschieben und die Manifest-Datei entsprechend ändern wird Thunderbird weiterhin funktionieren, denn es ist nicht von einem bestimmten Installationsort abhängig. Indem wir chrome-URLs verwenden lassen wir solche Details Mozilla machen. Auch wenn der Benutzer das verwendete Theme ändert, wird der 'skin'-Teil der chrome-URL in ein anderes Verzeichnis übersetzt und XUL-Dateien und Skripte brauchen nicht geändert zu werden.</p> -<p>Hier sind noch ein paar Beispiele. Beachten Sie, dass keine URL ein Theme oder eine Lokalisierung festlegen.</p> -<pre class="eval"><a class="external" rel="freelink">chrome://messenger/content/messenger.xul</a> -<a class="external" rel="freelink">chrome://messenger/content/attach.js</a> -<a class="external" rel="freelink">chrome://messenger/skin/icons/folder-inbox.gif</a> -<a class="external" rel="freelink">chrome://messenger/locale/messenger.dtd</a> -</pre> -<p>Um auf Unterverzeichnisse zuzugreifen, können Sie diese einfach am Ende der chrome-URL hinzufügen. Die folgenden URLs beziehen sich auf das Lesezeichenfenster, für Mozilla-Suite und Firefox, da der Paketname unterschiedlich ist:</p> -<pre class="eval"><a class="external" rel="freelink">chrome://communicator/content/bookma...rksManager.xul</a> (Mozilla) -<a class="external" rel="freelink">chrome://browser/content/bookmarks/b...rksManager.xul</a> (Firefox) -</pre> -<p>Sie können chrome-URLs überall verwenden, wo auch normale URLs verwendet werden können. Sie können sie sogar in die Adresszeile des Mozilla Browsers eingeben. Wenn Sie eine der oben genannten URLs eingeben, sollten Sie sehen, dass ein Fenster wie eine Webseite geöffnet wird und so funktioniert wie ein separates Fenster. Einige Dialogboxen funktionieren vielleicht nicht richtig, weil sie eventuelle Argumente erwarten, die ihnen beim Aufrufen nicht übergeben worden sind.</p> -<p>Es kommen außerdem auch chrome-URLs ohne Dateinamen vor, zum Beispiel:</p> -<pre class="eval"><a class="external" rel="freelink">chrome://browser/content/</a> -</pre> -<p>In diesem Fall wurde nur der Paketname und der Teilabschnitt angegeben. Dieser Referenztyp wird automatisch eine passende Datei aus diesem Verzeichnis auswählen. Für content wird eine Datei mit dem selben Namen des Pakets und XUL-Erweiterung ausgewählt. Im obigen Beispiel wird die Datei browser.xul ausgewählt. Für messenger würde messenger.xul ausgewählt werden. Wenn Sie Ihre eigene Anwendung erstellen, möchten Sie vielleicht eine Datei für Ihr Hauptfenster, mit dem selben Namen wie das Paket, erstellen. Dann kann ein Bezug in dieser verkürzten Form hergestellt werden.</p> -<p>Bei einem Skin wird die Datei <em><package name></em>.css ausgewählt; für eine Lokalisierung wird die Datei <em><package name></em>.dtd ausgewählt.</p> -<p>Denken Sie daran, dass die chrome-URL sich nicht auf den physikalischen Pfad auf der Festplatte bezieht. Die ersten beiden Stücke der chrome-URL sind der Paketname und der Teilabschnitt (entweder content, skin oder locale).</p> -<p>Im nächsten Abschnitt schauen wir uns an, wie wir .manifest-Dateien und Pakete erstellen können.</p> -<p>{{ PreviousNext("XUL_Tutorial/XUL_Struktur", "XUL_Tutorial/Manifest_Dateien") }}</p> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html b/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html deleted file mode 100644 index 54c31683a0..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/ein_fenster_erzeugen/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: Ein Fenster erzeugen -slug: Archive/Mozilla/XUL/XUL_Tutorial/Ein_Fenster_erzeugen -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/Creating_a_Window ---- -<p>{{ PreviousNext("XUL_Tutorial/Manifest_Dateien", "XUL_Tutorial/Buttons_hinzufügen") }}</p> - -<p>Zunächst wollen wir uns mit der Syntax einer XUL-Datei beschäftigen.</p> - -<h3 id="Eine_XUL_Datei_erstellen">Eine XUL Datei erstellen</h3> - -<p>Der Name einer XUL Datei kann frei gewählt werden, es sollte jedoch darauf geachtet werden, dass die Endung .xul verwendet wird. Die einfachste XUL Datei hat folgende Struktur:</p> - -<pre><?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin/" type="text/css"?> - -<window - id="findfile-window" - title="Find Files" - orient="horizontal" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> -<!-- Other elements go here --> -</window> -</pre> - -<p>Dieses Fenster wird keine Funktion haben, da es keine weitere UI-Elemete enthält. Diese werden im nächsten Abschnitt hinzugefügt. Der Code wird im folgenden Zeile für Zeile erklärt:</p> - -<ol> - <li><strong><?xml version="1.0"?></strong><br> - Diese Zeile zeigt, dass dies eine XML Datei ist. Diese Zeile sollte in jeder XUL Datei als erstes stehen.</li> - <li><strong><?xml-stylesheet href="<a class="external" rel="freelink">chrome://global/skin/</a>" type="text/css"?></strong><br> - Diese Zeile wird gebraucht um festzulegen, welches Style Sheet für diese Datei verwendet wird. Dies ist die Syntax wie XML Dateien Style Sheets importieren. In diesem Fall importieren wir ein Style Sheet welches sich im globalen Teil eines Skins befindet. Wir legen keine spezifische Datei fest, so dass Mozilla selbst entscheidet, welche Datei verwendet werden soll. In diesem Fall wird die Datei global.css verwendet. Diese Datei enthält alle Standard-Deklarationen für jedes XUL Element. Weil XML selbst nicht weiß wie die Elemente dargestellt werden sollten, brauch es diese Datei, welche dies festlegt. Normalerweise wird diese Zeile ebenfalls an den Anfang einer jeden XUL Datei geschrieben. Es können auch andere Style Sheets mit der selben Syntax importiert werden. Das globale Style Sheet wird normalerweise aus dem eigenen Style Sheet importiert.</li> - <li><strong><window</strong><br> - Diese Zeile gibt an, dass ein {{ XULElem("window") }} beschrieben wird. Jedes User Interface wird in einer eigenen Datei beschrieben. Dieser Tag ist wie ein HTML Tag welcher ein gesamtes HTML Dokument umfasst, mit dem Unterschied dass hier ein User Interface beschrieben wird. <a href="/De/XUL/Window#Attribute" title="de/XUL/window#Attribute">Einige Attribute</a> können im {{ XULElem("window") }} Tag platziert werden, hier sind es vier. In diesem Beispiel wird jedes Attribut in einer eigenen Zeile beschrieben, dies ist jedoch nicht zwingend.</li> - <li><strong>id="findfile-window"</strong><br> - Das <code>{{ XULAttr("id") }}</code> Attribut wird zur Identifizierung gebraucht, damit später auf das Fenster per Skript zugegriffen werden kann. Im Normalfall sollte ein <code>id</code> Attribut bei allen Elementen vorhanden sein. Der Name kann frei gewählt werden, er sollte jedoch sinnvoll sein.</li> - <li><strong>title="Find Files"</strong><br> - Das <code>{{ XULAttr("title") }}</code> Attribut beschreibt den Text, welcher in der Titelzeile des Fensters erscheinen soll. In unserem Fall wird es 'Find Files' sein.</li> - <li><strong>orient="horizontal"</strong><br> - Das <code>{{ XULAttr("orient") }}</code> Attribut beschreibt die Anordnung der Elemente in diesem Fenster. Der Wert <code>horizontal</code> zeigt, dass die Elemente horizontal über dem Fenster verteilt werden. Es kann auch der Wert <code>vertical</code> verwendet werden, welcher meint, dass die Elemente in einer Spalte verteilt werden. Dies ist der Standardwert, das heißt, dass man dieses Attribut weglassen kann, wenn man eine vertikale Ausrichtung möchte.</li> - <li><strong>xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"></strong> Diese Zeile deklariert den Namensraum für XUL, welcher im Fenster deklariert sein sollte um festzulegen, dass alle Nachfolger XUL sind. Diese URL wird niemals heruntergeladen. Mozilla wird diese URL intern verarbeiten.</li> - <li><strong><span class="nowiki"><!-- Other elements go here --></span></strong><br> - Ersetze diesen Kommentar Block durch andere Elemente (Buttons, Menüs und andere User Interface Komponenten), welche im Fenster angezeigt werden sollten. Wir werden ein paar von ihnen zu einem späteren Zeitpunkt hinzufügen.</li> - <li><strong></window></strong><br> - Zum Schluss brauchen wir das {{ XULElem("window") }} Tag, um das Ende der Datei anzuzeigen.</li> -</ol> - -<h3 id="Ein_Fenster_öffnen">Ein Fenster öffnen</h3> - -<p>Um ein XUL Fenster zu öffnen gibt es verschiedene Methoden. Wenn Sie sich nur in der Entwicklungsphase befinden, können Sie einfach die URL ("chrome:", "file:" oder weitere) in die Adresszeile des Browserfensters eingeben. Sie können auch einfach auf einen Doppelklick auf die Datei ausführen, wenn XUL Dateien mit Mozilla verknüpft sind. Das XUL Fenster erscheint im Browserfenster als neues Fenster, aber das ist meistens ungenügend während der Entwicklung.</p> - -<p>Der korrekte Weg ist natürlich ein Fenster über JavaScript zu öffnen. Es ist kein neuer Syntax dazu notwendig, denn die <code><a href="/de/DOM/window.open" title="de/DOM/window.open">window.open()</a></code> Funktion kann genau wie für <a href="/de/HTML" title="de/HTML">HTML</a> Dokumente dazu verwendet werden. Es ist jedoch ein zusätzlicher Parameter "flag" nötig. In diesem Fall muss 'chrome' angeben werden, damit klar ist, dass ein <a href="/de/DOM/window.open#Window_functionality_features" title="de/DOM/window.open#Window functionality features">chrome</a> Dokument geöffnet werden soll. Dieses Stück Code wird dafür sorgen, dass ein Fenster ohne Toolbars und Menüs geöffnet wird:</p> - -<pre>window.open(url,windowname,flags);</pre> - -<p>wobei "flags" das Schlüsselwort "chrome" wie in diesem Beispiel enthält:</p> - -<pre>window.open("chrome://navigator/content/navigator.xul", "bmarks", "chrome,width=600,height=300"); -</pre> - -<div class="highlight"> -<p><span class="highlightred">Wenn Sie Firefox verwenden:</span></p> - -<pre>window.open("chrome://browser/content/places/places.xul", "bmarks", "chrome,width=600,height=300"); -</pre> - -<p>Diese Zeile kann auch in der Fehlerkonsole getestet werden. Wählen Sie Extras -> Fehlerkonsole, tippen Sie die Zeile JavaScript ein und drücken Sie auf Evaluieren oder benutzen Sie die Enter-Taste.</p> - -<h5 id="Das_findfile.xul_Beispiel">Das findfile.xul Beispiel</h5> - -<p>Fangen wir an die Basisdatei für den Dateisuche-Dialog zu schreiben. Erstellen Sie die Datei findfile.xul und packen Sie diese in das content Verzeichnis, welches von der finndfile.manifest Datei festgelegt wurde (haben wir im vorherigen Abschnitt festgelegt). Fügen Sie die XUL Vorlage von oben zu dieser Datei hinzu und speichern Sie diese ab.</p> -</div> - -<p>Sie können den Kommandozeilenparameter '-chrome' verwenden, um die XUL Datei mit Mozilla zu starten. Wird dies nicht festgelegt, wird das Standardfenster geöffnet (normalerweise das Browserfenster). Wir können zum Beispiel den Dateisuche-Dialog mit einem der folgenden Zeilen öffnen:</p> - -<pre>mozilla -chrome chrome://findfile/content/findfile.xul - -mozilla -chrome resource:/chrome/findfile/content/findfile.xul -</pre> - -<p>Wenn Sie einen dieser Kommandos in einer Eingabeaufforderung (angenommen Sie verfügen übere eine auf Ihrem System) eingeben, wird der Dateisuche-Dialog standardmäßig geöffnet, anstatt des normalen Mozilla Browserfensters. Da wir allerdings noch keine UI-Elemente in das Fenster gepackt haben, sehen Sie zunächst nichts. Im nächsten Abschnitt werden wir Elemente hinzufügen.</p> - -<p>Um den Effekt dennoch zu beobachten, können Sie mit der folgenden Zeile das Lesezeichenfenster öffnen:</p> - -<pre>mozilla -chrome chrome://communicator/content/bookmarks/bookmarksManager.xul</pre> - -<p><span class="highlightred">Wenn Sie Firefox benutzen:</span></p> - -<pre>firefox -chrome <span class="s">chrome://browser/content/places/places.xul</span></pre> - -<p>Das '-chrome' Argument gibt der Datei keine gesonderten Rechte. Stattdessen kann es dadurch als Top-level Fenster in jedem Browser angezeigt werden, ohne Adressleiste oder Menüs. Nur chrome: URLs haben diese zusätzlichen Rechte.</p> - -<div class="note">Die <a class="external" href="http://ted.mielczarek.org/code/mozilla/extensiondev/">Erweiterungsentwickler Erweiterung</a> enthält einen XUL Editor, der den eingegebenen XUL-Code in Echtzeit wiedergibt!</div> - -<h3 id="Problemlösung">Problemlösung</h3> - -<ul> - <li>Wenn das XUL Fenster nicht auf dem Desktop angezeigt wird aber ein Icon auf der Desktop-Toolbar zu sehen ist, überprüfen Sie die xml-stylesheet Deklaration. Stellen Sie sicher, dass das Stylesheet korrekt eingebunden wird:</li> -</ul> - -<pre class="eval"> <?xml-stylesheet href="<a class="external" rel="freelink">chrome://global/skin/</a>" type="text/css"?> -</pre> - -<p>Im nächsten Abschnitt werden wir <a href="/de/XUL_Tutorial/Buttons_hinzufügen" title="de/XUL Tutorial/Buttons hinzufügen">ein paar Buttons zum Fenster hinzufügen</a>.</p> - -<p>{{ PreviousNext("XUL_Tutorial/Manifest_Dateien", "XUL_Tutorial/Buttons_hinzufügen") }}</p> - -<p>{{ languages( { "en": "en/XUL_Tutorial/Creating_a_Window", "fr": "fr/Tutoriel_XUL/Cr\u00e9er_une_fen\u00eatre", "ja": "ja/XUL_Tutorial/Creating_a_Window", "pl": "pl/Kurs_XUL/Tworzenie_okna", "es": "es/Tutorial_de_XUL/Creando_una_ventana" } ) }}</p> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html b/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html deleted file mode 100644 index 93aa98324a..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/einfuehrung/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: Einführung -slug: Archive/Mozilla/XUL/XUL_Tutorial/Einfuehrung -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/Introduction ---- -<p>{{ Next("XUL_Tutorial/XUL_Struktur") }}</p> -<p>Dieses Tutorial ist eine Anleitung für das Erlernen von <abbr title="XML User Interface Language">XUL</abbr> (XML User Interface Language). XUL ist eine plattformübergreifende Sprache, um die Benutzer-Schnittstellen (z.B. GUI) einer Anwendung zu beschreiben.</p> -<p>Dieses Tutorial demonstriert die Erstellung eines einfachen "Datei suchen"-Dialogs, in der Art des "Sherlock" auf dem Macintosh oder des "Suchen"-Dialogs von Windows. Bitte beachten Sie, dass nur das Fenster (GUI) erstellt wird. Dieses beinhaltet sehr eingeschränkte Funktionalität. Das tatsächliche Auffinden von Dateien ist nicht implementiert. An den Stellen, wo der "Datei suchen"-Dialog bearbeitet wird, ist am linken Rand eine blaue Linie gemalt. Sie können der Entwicklung des Dialogs einfach folgen, indem Sie die so markierten Stellen lesen.</p> -<h3 id="Was_ist_XUL_und_warum_wurde_es_entwickelt">Was ist XUL und warum wurde es entwickelt?</h3> -<p>XUL (ausgesprochen "zuul" und reimt sich auf "cool") wurde entwickelt, um die Entwicklung des Mozilla-Browsers zu vereinfachen und zu beschleunigen. Es ist eine <abbr title="Extensible Markup Language">XML</abbr>-Sprache und somit gelten alle Eigenschaften von XML auch für XUL.</p> -<p>Die meisten Anwendungen benötigen bei ihrer Entwicklung plattform-spezifische Abhängigkeiten und Eigenschaften - die Entwicklung von plattform-unabhängiger Software ist zeitraubend und teuer. In den letzten Jahren wurde eine Vielzahl von plattform-übergreifenden Anwendungen entwickelt. Die Programmiersprache Java hat zum Beispiel die Plattformunabhängigkeit als herausragende Eigenschaft. XUL ist eine Sprache, die speziell für plattform-übergreifende Benutzerschnittstellen (GUIs) entwickelt wurde. Es dauert lange, um eine Anwendung zu entwickeln - selbst für eine Plattform. Die Zeit des Kompilierens und Debuggens kann sich sehr strecken. Mit XUL kann die Benutzerschnittstelle schnell und einfach implementiert und geändert werden.</p> -<p>XUL hat alle Vorteile von anderen XML-Sprachen. Es können zum Beispiel XHTML oder andere XML-Sprachen, wie <abbr title="Math Markup Language">MathML</abbr> oder <abbr title="Scalable Vector Graphics">SVG</abbr> eingebunden werden. Zudem ist angezeigter Text in XUL einfach an den Standort des Anwenders anzupassen. Das heißt er kann mit wenig Aufwand in andere Sprachen übersetzt werden.</p> -<h3 id="Welche_Art_von_Benutzerschnittstellen_können_mit_XUL_erstellt_werden">Welche Art von Benutzerschnittstellen können mit XUL erstellt werden?</h3> -<p>XUL bietet die Möglichkeit die meisten Elemente zu erstellen, die in modernen Benutzeroberflächen vorkommen. Einige dieser Elemente sind:</p> -<ul> <li>Eingabefelder, wie Textfelder oder Checkboxen</li> <li>Buttonleisten</li> <li>Menüleisten und Popup-Menüs</li> <li>Karteikarten</li> <li>Bäume für hierarchische oder tabellarische Darstellungen</li> <li>Tastenkürzel</li> -</ul> -<p>Der angezeigte Inhalt kann mit dem Inhalt aus XUL-Dateien oder aus Datenquellen erstellt werden. In Mozilla schließen solche Datenquellen die Mailbox eines Anwenders, seine Lesezeichen und Suchergebnisse ein. Die Inhalte von Menüs, Bäumen und anderen Elementen können mit diesen Daten befüllt werden oder mit Ihren eigenen Daten, die in <abbr title="Resource Description Framework">RDF</abbr>-Dateien bereitgestellt werden.</p> -<p>Es gibt verschieden Arten, um XUL zu nutzen:</p> -<ul> <li>Firefox-Erweiterung: Eine Erweiterung fügt dem Browser Funktionen hinzu, oft in der Form von zusätzlichen Buttons, Kontext-Menüs oder Anpassungen der Browser-Oberfläche. Dies geschieht durch die Verwendung einer XUL-Eigenschaft namens <strong>overlay</strong> (Überlagerung), die es erlaubt, die Oberfläche einer Quelle (in diesem Fall des Browsers) mit der Oberfläche der Erweiterung zu mischen bzw. zu überlagern. Erweiterungen können auch zu anderen Mozilla-Produkten, wie Thunderbird, Sunbird oder Songbird hinzugefügt werden.</li> <li>Standalone XULRunner Anwendung: XULRunner is eine gepackte Version der Mozilla-Plattform, die es erlaubt, <abbr title="Programme, die auf dem lokalen Rechner ohne Netzwerk-Zugriff ausgeführt werden können">Standalone-Anwendungen</abbr> zu erstellen. Für das Starten einer solchen Standalone-Anwendung wird kein Browser benötigt, da sie eine eigene selbstausführbare Datei darstellen.</li> <li>XUL Paket: Zwischen den beiden oben beschriebenen Anwendungsformen steht das XUL Paket. Es wird auf dieselbe Art und Weise wie eine Erweiterung erstellt, wird aber wie eine unabhängige Anwendung in einem anderen Fenster ausgeführt. Ein XUL Paket wird verwendet, wenn Sie nicht die Größe einer kompletten XULRunner-Anwendung in Kauf nehmen wollen und nichts dagegen haben, dass die Anwendung aus einer Mozilla-Anwendung (Firefox, Thunderbird,...) gestartet wird.</li> <li>Entfernte XUL-Anwendung: Sie können ihren Code auch auf einem Webserver hinterlegen und in einem Browser öffnen - so wie sie jede andere Webseite öffnen. Diese Methode ist jedoch eingeschränkt, da Sicherheitseinschränkungen beachtet werden müssen. Zum Beispiel ist der Zugriff auf andere Fenster nicht möglich.</li> -</ul> -<p>Die ersten drei Arten benötigen alle die Ausführung einer Installation auf dem Computer des Anwenders. Diese Arten haben dadurch keine Sicherheitsbeschränkungen, sodass sie, zum Beispiel, das lokale Dateisystem lesen und schreiben können. Für eine Erweiterung werden die XUL-Dateien und zugehörige Skripte und Bilddateien der Anwendung in einer einzigen Datei zusammengepackt, die vom Anwender heruntergeladen und installiert wird. Mozilla-Anwendungen, wie der Firefox, bieten einen Erweiterungsmanager an, der es erlaubt, Installationen zusammenzustellen, ohne viel komplizierten Code schreiben zu müssen.</p> -<p>Es ist auch möglich XUL-Dateien direkt aus dem Dateisystem oder von einer Webseite zu starten. Diese sind aber in ihren Möglichkeiten eingeschränkt und einige Aspekte von XUL können nicht ausgeführt werden. Wenn Sie XUL-Inhalte von einer entfernten Webseite laden möchten, muss der Webserver so eingestellt sein, dass er XUL-Dateien mit dem Content-Type "application/vnd.mozilla.xul+xml" senden kann. XUL-Code wird normalerweise in Dateien mit der Endung ".xul" gespeichert. Sie können XUL-Dateien in Mozilla wie jede andere Datei (z.B. HTML) öffnen, indem Sie die "Öffnen mit..."-Option im Datei-Explorer für eine solche Datei auswählen oder den Ort der Datei direkt in die Adressleiste des Mozilla Browsers eingegeben.</p> -<h3 id="Welches_Vorwissen_brauche_ich_f.C3.BCr_dieses_Tutorial.3F" name="Welches_Vorwissen_brauche_ich_f.C3.BCr_dieses_Tutorial.3F">Welches Vorwissen brauche ich für dieses Tutorial?</h3> -<p>Sie sollten eine Vorstellung von <abbr>HTML</abbr> und zumindest grundsätzliches Verständnis von XML und <abbr title="Cascading Style Sheets">CSS</abbr> haben. Hier sind einige Richtlinien:</p> -<ul> <li>XUL-Elemente sollten alle in Kleinbuchstaben eingegeben werden, da XML auf Groß-Klein-Schreibung achtet (im Gegensatz zu HTML).</li> <li>Attribut-Werte in XUL müssen immer in Anführungsstrichen geschrieben werden, auch wenn es sich um Zahlen handelt.</li> <li>XUL-Dateien sind normalerweise in 4 Dateien aufgeteilt, eine für das Layout und die platzierten Elemente (*.xul), eine für Stil-Definitionen (*.css), eine für Bezeichnungsdeklarationen (*.ent, um auf den Ort des Anwenders zu reagieren) und eine für Scripte (*.script). Zusätzlich können weitere Dateien für Bilder oder plattform-spezifische Dateien verwendet werden.</li> -</ul> -<p>XUL wird in Mozilla-Browsern unterstützt, die auf der Gecko-Engine basieren, z.B. Netscape 6 oder höher und Mozilla Firefox. Trotz diverser Änderungen in der XUL-Syntax, sollten die aktuellen Versionen der Beispiele korrekt ablaufen. Die meisten Beispiele sollten unter Mozilla 1.0 oder höher laufen. XUL ist ziemlich ähnlich in Firefox und anderen Browsern, obwohl es kleine Unterschiede gibt, wie zum Beispiel die Unterstützung für anpassbare Werkzeugleisten.</p> -<p>Dieses Tutorial versucht viel von der XUL-Funktionalität abzudecken, aber es können nicht alle Themen behandelt werden. Wenn Sie einmal vertraut mit XUL sind, können Sie die <a href="/de/XUL_Referenz" title="de/XUL Referenz">XUL-Referenz</a> benutzen, um mehr über Eigenschaften von bestimmten Elementen herauszufinden.</p> -<p>{{ Next("XUL_Tutorial/XUL_Struktur") }}</p> -<p>{{ languages( { "en": "en/XUL_Tutorial/Introduction", "es": "es/Tutorial_de_XUL/Introducci\u00f3n", "fr": "fr/Tutoriel_XUL/Introduction", "ja": "ja/XUL_Tutorial/Introduction", "ko": "ko/XUL_Tutorial/Introduction", "pl": "pl/Kurs_XUL/Wprowadzenie", "zh-cn": "cn/XUL_\u6559\u7a0b/\u5f15\u8a00", "ru": "ru/\u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e_\u043f\u043e_XUL/\u0412\u0432\u0435\u0434\u0435\u043d\u0438\u0435" } ) }}</p> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/index.html b/files/de/archive/mozilla/xul/xul_tutorial/index.html deleted file mode 100644 index 5cf8ecb42d..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: XUL Tutorial -slug: Archive/Mozilla/XUL/XUL_Tutorial -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial ---- -<p>Dieses Tutorial beschreibt XUL, die »XML User-Interface Language«. Diese Sprache wurde für die Anwendung Mozilla entwickelt und wird verwendet, um die Nutzerschnittstelle (GUI) für die Anwendung zu beschreiben.</p> -<h5 id="Einführung">Einführung</h5> -<ul> <li><a href="/de/XUL_Tutorial/Einfuehrung" title="de/XUL_Tutorial/Einfuehrung">Einführung</a></li> <li><a href="/de/XUL_Tutorial/XUL_Struktur" title="de/XUL_Tutorial/XUL_Struktur">XUL Struktur</a></li> <li><a href="/De/XUL_Tutorial/Die_Chrome_URL" title="De/XUL_Tutorial/Die_Chrome_URL">Die Chrome URL</a></li> <li><a href="/de/XUL_Tutorial/Manifest_Dateien" title="de/XUL_Tutorial/Manifest_Dateien">Manifest Dateien</a></li> -</ul> -<h5 id="Einfache_Elemente">Einfache Elemente</h5> -<ul> <li><a href="/de/XUL_Tutorial/Ein_Fenster_erzeugen" title="de/XUL_Tutorial/Ein_Fenster_erzeugen">Ein Fenster erzeugen</a></li> <li><a href="/de/XUL_Tutorial/Buttons_hinzufügen" title="de/XUL_Tutorial/Buttons_hinzufügen">Buttons hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Labels_und_Bilder_hinzufügen" title="de/XUL_Tutorial/Labels_und_Bilder_hinzufügen">Labels und Bilder hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Eingabeelemente" title="de/XUL_Tutorial/Eingabeelemente">Eingabeelemente</a></li> <li><a href="/de/XUL_Tutorial/Numerische_Steuerelemente" title="de/XUL_Tutorial/Numerische_Steuerelemente">Numerische Steuerelemente</a></li> <li><a href="/de/XUL_Tutorial/Listenelemente" title="de/XUL_Tutorial/Listenelemente">Listenelemente</a></li> <li><a href="/de/XUL_Tutorial/Fortschrittsanzeige" title="de/XUL_Tutorial/Fortschrittsanzeige">Fortschrittsanzeige</a></li> <li><a href="/de/XUL_Tutorial/HTML-Elemente_hinzufügen" title="de/XUL_Tutorial/HTML-Elemente_hinzufügen">HTML-Elemente hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Abstandhalter_verwenden" title="de/XUL_Tutorial/Abstandhalter_verwenden">Abstandhalter verwenden</a></li> <li><a href="/de/XUL_Tutorial/Weitere_Button-Features" title="de/XUL_Tutorial/Weitere_Button-Features">Weitere Button-Features</a></li> -</ul> -<h5 id="Das_Box-Modell">Das Box-Modell</h5> -<ul> <li><a href="/de/XUL_Tutorial/Das_Box-Modell" title="de/XUL_Tutorial/Das_Box-Modell">Das Box-Modell </a></li> <li><a href="/de/XUL_Tutorial/Positionierung_von_Elementen" title="de/XUL_Tutorial/Positionierung_von_Elementen">Positionierung von Elementen</a></li> <li><a href="/de/XUL_Tutorial/Details_zum_Box-Modell" title="de/XUL_Tutorial/Details_zum_Box-Modell">Details zum Box-Modell</a></li> <li><a href="/de/XUL_Tutorial/Groupboxes" title="de/XUL_Tutorial/Groupboxes">Groupboxes</a></li> <li><a href="/de/XUL_Tutorial/Weitere_Elemente_hinzufügen" title="de/XUL_Tutorial/Weitere_Elemente_hinzufügen">Weitere Elemente hinzufügen</a></li> -</ul> -<h5 id="Mehr_Layout-Elemente" name="Mehr_Layout-Elemente">Weitere Layout-Elemente</h5> -<ul> <li><a href="/de/XUL_Tutorial/Stacks_und_Decks" title="de/XUL_Tutorial/Stacks_und_Decks">Stacks und Decks</a></li> <li><a href="/de/XUL_Tutorial/Stack-Positionierung" title="de/XUL_Tutorial/Stack-Positionierung">Stack-Positionierung</a></li> <li><a href="/de/XUL_Tutorial/Karteikarten" title="de/XUL_Tutorial/Karteikarten">Karteikarten</a></li> <li><a href="/de/XUL_Tutorial/Grids" title="de/XUL_Tutorial/Grids">Grids</a></li> <li><a href="/de/XUL_Tutorial/Content_Panels" title="de/XUL_Tutorial/Content_Panels">Content Panels</a></li> <li><a href="/de/XUL_Tutorial/Splitters" title="de/XUL_Tutorial/Splitters">Splitters</a></li> <li><a href="/de/XUL_Tutorial/Scroll-Balken" title="de/XUL_Tutorial/Scroll-Balken">Scroll-Balken</a></li> -</ul> -<h5 id="Toolbars_und_Menüs">Toolbars und Menüs</h5> -<ul> <li><a href="/de/XUL_Tutorial/Toolbars" title="de/XUL_Tutorial/Toolbars">Toolbars</a></li> <li><a href="/de/XUL_Tutorial/Einfache_Menüs" title="de/XUL_Tutorial/Einfache_Menüs">Einfache Menüs</a></li> <li><a href="/de/XUL_Tutorial/Weitere_Menü-Eigenschaften" title="de/XUL_Tutorial/Weitere_Menü-Eigenschaften">Weitere Menü-Eigenschaften</a></li> <li><a href="/de/XUL_Tutorial/Popup-Menüs" title="de/XUL_Tutorial/Popup-Menüs">Popup-Menüs</a></li> <li><a href="/de/XUL_Tutorial/Menüs_zum_Scrollen" title="de/XUL_Tutorial/Menüs_zum_Scrollen">Menüs zum Scrollen</a></li> -</ul> -<h5 id="Ereignisse_und_Scripte">Ereignisse und Scripte</h5> -<ul> <li><a href="/de/XUL_Tutorial/Event-Handler_hinzufügen" title="de/XUL_Tutorial/Event-Handler_hinzufügen">Event-Handler hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Weitere_Event-Handler" title="de/XUL_Tutorial/Weitere_Event-Handler">Weitere Event-Handler</a></li> <li><a href="/de/XUL_Tutorial/Tastenkürzel" title="de/XUL_Tutorial/Tastenkürzel">Tastenkürzel</a></li> <li><a href="/de/XUL_Tutorial/Fokus_und_Selektierung" title="de/XUL_Tutorial/Fokus_und_Selektierung">Fokus und Selektierung</a></li> <li><a href="/de/XUL_Tutorial/Befehle" title="de/XUL_Tutorial/Befehle">Befehle</a></li> <li><a href="/de/XUL_Tutorial/Befehle_updaten" title="de/XUL_Tutorial/Befehle_updaten">Befehle updaten</a></li> <li><a href="/de/XUL_Tutorial/Broadcaster_und_Observer" title="de/XUL_Tutorial/Broadcaster_und_Observer">Broadcaster und Observer</a></li> -</ul> -<h5 id="Das_DOM_(Document_Object_Model)">Das DOM (Document Object Model)</h5> -<ul> <li><a href="/de/XUL_Tutorial/Das_Document_Object_Model" title="de/XUL_Tutorial/Das_Document_Object_Model">Das Document Object Model</a></li> <li><a href="/de/XUL_Tutorial/Eine_XUL-Schnittstelle_anpassen" title="de/XUL_Tutorial/Eine_XUL-Schnittstelle_anpassen">Eine XUL-Schnittstelle anpassen</a></li> <li><a href="/de/XUL_Tutorial/Listen_anpassen" title="de/XUL_Tutorial/Listen_anpassen">Listen anpassen</a></li> <li><a href="/de/XUL_Tutorial/Box-Objekte" title="de/XUL_Tutorial/Box-Objekte">Box-Objekte</a></li> <li><a href="/de/XUL_Tutorial/XPCOM-Schnittstellen" title="de/XUL_Tutorial/XPCOM-Schnittstellen">XPCOM-Schnittstellen</a></li> <li><a href="/de/XUL_Tutorial/XPCOM_Beispiele" title="de/XUL_Tutorial/XPCOM_Beispiele">XPCOM Beispiele</a></li> -</ul> -<h5 id="Bäume">Bäume</h5> -<ul> <li><a href="/de/XUL_Tutorial/Bäume" title="de/XUL_Tutorial/Bäume">Bäume </a></li> <li><a href="/de/XUL_Tutorial/Weitere_Baum-Eigenschaften" title="de/XUL_Tutorial/Weitere_Baum-Eigenschaften">Weitere Baum-Eigenschaften</a></li> <li><a href="/de/XUL_Tutorial/Auswahl_in_Bäumen" title="de/XUL_Tutorial/Auswahl_in_Bäumen">Auswahl in Bäumen</a></li> <li><a href="/de/XUL_Tutorial/Selbsterstellte_Baum-Ansichten" title="de/XUL_Tutorial/Selbsterstellte_Baum-Ansichten">Selbsterstellte Baum-Ansichten</a></li> <li><a href="/de/XUL_Tutorial/Details_zu_Baum-Ansichten" title="de/XUL_Tutorial/Details_zu_Baum-Ansichten">Details zu Baum-Ansichten</a></li> <li><a href="/de/XUL_Tutorial/Tree-Box_Objekte" title="de/XUL_Tutorial/Tree-Box_Objekte">Tree-Box Objekte</a></li> -</ul> -<h5 id="RDF_und_Vorlagen">RDF und Vorlagen</h5> -<ul> <li><a href="/de/XUL_Tutorial/Einführung_in_RDF" title="de/XUL_Tutorial/Einführung_in_RDF">Einführung in RDF</a></li> <li><a href="/de/XUL_Tutorial/Vorlagen" title="de/XUL_Tutorial/Vorlagen">Vorlagen</a></li> <li><a href="/de/XUL_Tutorial/Bäume_und_Vorlagen" title="de/XUL_Tutorial/Bäume_und_Vorlagen">Bäume und Vorlagen</a></li> <li><a href="/de/XUL_Tutorial/RDF_Datasources" title="de/XUL_Tutorial/RDF_Datasources">RDF Datasources</a></li> <li><a href="/de/XUL_Tutorial/Kompliziertere_Regeln" title="de/XUL_Tutorial/Kompliziertere_Regeln">Kompliziertere Regeln</a></li> <li><a href="/de/XUL_Tutorial/Datenspeicherung" title="de/XUL_Tutorial/Datenspeicherung">Datenspeicherung</a></li> -</ul> -<h5 id="Skins_und_Locales">Skins und Locales</h5> -<ul> <li><a href="/de/XUL_Tutorial/Style_Sheets_hinzufügen" title="de/XUL_Tutorial/Style_Sheets_hinzufügen">Style Sheets hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Einen_Baum_gestalten" title="de/XUL_Tutorial/Einen_Baum_gestalten">Einen Baum gestalten</a></li> <li><a href="/de/XUL_Tutorial/Die_voreingestellte_Skin_bearbeiten" title="de/XUL_Tutorial/Die_voreingestellte_Skin_bearbeiten">Die voreingestellte Skin bearbeiten</a></li> <li><a href="/de/XUL_Tutorial/Eine_eigene_Skin_erstellen" title="de/XUL_Tutorial/Eine_eigene_Skin_erstellen">Eine eigene Skin erstellen</a></li> <li><a href="/de/XUL_Tutorial/Lokalisierung" title="de/XUL_Tutorial/Lokalisierung">Lokalisierung</a></li> <li><a href="/de/XUL_Tutorial/Property-Dateien" title="de/XUL_Tutorial/Property-Dateien">Property-Dateien</a></li> -</ul> -<h5 id="Bindings">Bindings</h5> -<ul> <li><a href="/de/XUL_Tutorial/Einführung_in_XBL" title="de/XUL_Tutorial/Einführung_in_XBL">Einführung in XBL</a></li> <li><a href="/de/XUL_Tutorial/Anonymer_Inhalt" title="de/XUL_Tutorial/Anonymer_Inhalt">Anonymer Inhalt</a></li> <li><a href="/de/XUL_Tutorial/XBL_Vererbung_von_Attributen" title="de/XUL_Tutorial/XBL_Vererbung_von_Attributen">XBL Vererbung von Attributen</a></li> <li><a href="/de/XUL_Tutorial/Eigenschaften_zu_XBL-definierten_Elementen_hinzufügen" title="de/XUL_Tutorial/Eigenschaften_zu_XBL-definierten_Elementen_hinzufügen">Eigenschaften hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Methodenzu_XBL-definierten_Elementen_hinzufügen" title="de/XUL_Tutorial/Methodenzu_XBL-definierten_Elementen_hinzufügen">Methoden hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/Event_Handler_zu_XBL-definierten_Element_hinzufügen" title="de/XUL_Tutorial/Event_Handler_zu_XBL-definierten_Element_hinzufügen">Event-Handler hinzufügen</a></li> <li><a href="/de/XUL_Tutorial/XBL_Vererbung" title="de/XUL_Tutorial/XBL_Vererbung">XBL Vererbung</a></li> <li><a href="/de/XUL_Tutorial/XBL_Beispiel" title="de/XUL_Tutorial/XBL_Beispiel">XBL Beispiel</a></li> -</ul> -<h5 id="Spezielle_Fenster-Typen">Spezielle Fenster-Typen</h5> -<ul> <li><a href="/de/XUL_Tutorial/Eigenschaften_eines_Fensters" title="de/XUL_Tutorial/Eigenschaften_eines_Fensters">Eigenschaften eines Fensters</a></li> <li><a href="/de/XUL_Tutorial/Erstellen_von_Dialogen" title="de/XUL_Tutorial/Erstellen_von_Dialogen">Erstellen von Dialogen</a></li> <li><a href="/de/XUL_Tutorial/Öffnen_und_Schließen_Dialog" title="de/XUL_Tutorial/Öffnen_und_Schließen_Dialog">"Öffnen" und "Schließen"-Dialoge</a></li> <li><a href="/de/XUL_Tutorial/Erstellen_von_Assistenten" title="de/XUL_Tutorial/Erstellen_von_Assistenten">Erstellen von Assistenten</a></li> <li><a href="/de/XUL_Tutorial/Weitere_Assistenten" title="de/XUL_Tutorial/Weitere_Assistenten">Weitere Assistenten</a></li> <li><a href="/de/XUL_Tutorial/Overlays" title="de/XUL_Tutorial/Overlays">Overlays (Überlagerungen)</a></li> <li><a href="/de/XUL_Tutorial/Cross_Package_Overlays" title="de/XUL_Tutorial/Cross_Package_Overlays">Overlays über mehrere Packages</a></li> -</ul> -<h5 id="Installation">Installation</h5> -<ul> <li><a href="/de/XUL_Tutorial/Erstellen_eines_Installers" title="de/XUL_Tutorial/Erstellen_eines_Installers">Erstellen eines Installers</a></li> <li><a href="/De/XUL_Tutorial/Installations-Skripte" title="De/XUL_Tutorial/Installations-Skripte">Installations-Skripte</a></li> <li><a href="/de/XUL_Tutorial/Zusätzliche_Installationseigenschaften" title="de/XUL_Tutorial/Zusätzliche_Installationseigenschaften">Zusätzliche Installationseigenschaften</a></li> -</ul> -<div class="note"> -<p>Dieses XUL-Tutorial wurde ursprünglich von <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a> geschrieben. Er hat die Erlaubnis gegeben, es als Teil des <a href="/Project:de/About" title="Project:de/About">MDC</a> zu nutzen.</p> -</div> -<div class="originaldocinfo"> -<h5 id="Informationen_zum_Originaldokument">Informationen zum Originaldokument</h5> -<ul> <li>Autor: <a class="external" href="http://www.xulplanet.com/ndeakin/">Neil Deakin</a></li> <li>Urheberrecht-Informationen: © 1999-2005 XULPlanet.com</li> -</ul> -</div> -<p>{{ languages( { "zh-cn": "cn/XUL_\u6559\u7a0b", "en": "en/XUL_Tutorial", "es": "es/Tutorial_de_XUL", "fr": "fr/Tutoriel_XUL", "ja": "ja/XUL_Tutorial", "ko": "ko/XUL_Tutorial", "pl": "pl/Kurs_XUL", "ru": "ru/\u0420\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e_\u043f\u043e_XUL" } ) }}</p> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html b/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html deleted file mode 100644 index cf11ed3b11..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/installations-skripte/index.html +++ /dev/null @@ -1,96 +0,0 @@ ---- -title: Installations-Skripte -slug: Archive/Mozilla/XUL/XUL_Tutorial/Installations-Skripte -translation_of: Archive/Mozilla/XUL/Tutorial/Install_Scripts ---- -<div class="prevnext" style="text-align: right;"> - <p><a href="/de/docs/XUL_Tutorial/Erstellen_eines_Installers" style="float: left;">« zurück</a><a href="/de/docs/XUL_Tutorial/Zusätzliche_Installationseigenschaften">weiter »</a></p> -</div> -<p>Dieser Abschnitt beschreibt das Installationsskript.</p> -<h3 id="Erstellen_eines_Installationsskripts">Erstellen eines Installationsskripts</h3> -<div class="note"> - <strong>Hinweis</strong>: Für Firefox Erweiterungen, werden <code>install.js</code> Dateien nicht weiter verwendet. Es sollte ein <code><a href="/de/Installationsmanifest" title="de/Installationsmanifest">install.rdf</a></code> stattdessen erstellt werden.</div> -<p>In der Regel möchten Sie den Installationsprozess steuern können. Zum Beispiel möchten Sie vielleicht Datei-Versionen überprüfen und nur aktualisierte Dateien installieren oder Sie möchten Fehler in existierenden Dateien beheben. Das Installationsskript ist flexibel genug, um sogar Dateien zu deinstallieren. Aus diesen Gründen sollten Installationen ein Installationsskript an Board haben, um den Installationsprozess zu regeln.</p> -<p>Das Installationsskript muss "install.js" genannt werden und muss im Wurzelverzeichnis des Installationsverzeichnisses platziert werden. Das Skript wird JavaScript Code enthalten, welcher eine Reihe von Installationsfunktionen aufruft.</p> -<p>In einem HTML Dokument oder einem XUL Dokument ist das "window" Objekt das Wurzelobjekt. Das bedeutet, dass Sie die Methoden des window-Objekts ohne einem Qualifier davor aufrufen können, zum Beipiel kann statt <code>window.open()</code> einfach <code>open()</code> geschrieben werden. In einem Installationsskript gibt es kein Fenster, jedoch ist das globale Objekt das <em>Install</em> Objekt, welches eine Reihe von Funktionen zur Anpassung des Installationsprozess mit sich bringt. Einige der Install-Ojekt Funktionen werden weiter unter beschrieben.</p> -<p>Das Installationsskript sollte die folgenden Schritte ausführen:</p> -<ol> - <li>Initialisiere die Installation in dem festgelegt wird, welche Version und Paket installiert werden soll.</li> - <li>Benutze die Installationsfunktionen, um zu bestimmen, welche Dateien und Verzeichnisse installiert werden müssen. Sie können außerdem Dateien festlegen, die gelöscht oder verschoben werden sollen.</li> - <li>Starte den Installationsprozess der nötigen Dateien.</li> -</ol> -<p>Es ist wichtig zu beachten, dass während Schritt zwei, nur angegeben wird, welche Dateien installiert werden sollen und welche weiteren Operationen ausgeführt werden sollen. Es werden keine Dateien bis zum dritten Schritt kopiert. Sie können daher sehr einfach eine Reihe von Dateien festlegen, die installiert werden sollen, stolpern eventuell über einen Fehler und können den Prozess abbrechen, ohne dass das System des Benutzers verändert wird.</p> -<h3 id="Die_Komponentenregistrierung">Die Komponentenregistrierung</h3> -<p>Mozilla verfügt über eine Registrierungsdatei, welche alle Komponenten enthält, die momentan installiert sind. Komponenten sind Chrome Pakete, Skins und Plugins. Wird eine neue Komponente installiert, wird die Registrierungsdatei aktualisiert. Die Registrierung speichert auch Dateisets und Versionsinformationen über die installierten Komponenten. Daher ist es sehr einfach die Versionen Ihrer Komponente zu prüfen und zu ermitteln, ob die Komponente bereits verfügbar ist und eventuell aktualisiert werden muss.</p> -<p>Die Komponentenregistrierung arbeit ähnlich wie die Windows Registrierung. Sie besteht aus der hierarchischen Anordnung von Schlüsseln und Werten. Dabei müssen Sie nicht viel darüber wissen, um XUL Anwendungen zu erstellen, es sei denn Sie wollen eigene <a href="/de/XUL_Tutorial/XPCOM-Schnittstellen" title="de/XUL Tutorial/XPCOM-Schnittstellen">XPCOM</a> Komponenten erstellen.</p> -<p>Was Sie für eine Installation wissen müssen, ist, dass die Registrierung eine Reihe von Informationen über Ihre Anwendung speichert, zum Beispiel eine Liste der Dateien und Versionen. Die gesamten Informationen werden in einem Schlüssel gespeichert (und in Unter-Schlüsseln), welche Sie im Installationsskript angeben (in Schritt eins oben genannt).</p> -<p>Dieser Schlüssel ist wie in Verzeichnissen in der folgenden Form strukturiert:</p> -<pre>/Autor/Paketname -</pre> -<p>Ersetzen Sie das Wort "Author" mit Ihrem Name und "Paketname" mit dem Namen Ihres Pakets, welches Sie installieren möchten. Zum Beispiel:</p> -<pre>/Xulplanet/Find Files - -/Netscape/Personal Security Manager -</pre> -<p>Das erste Beispiel werden wir für den Dateisuche-Dialog verwenden. Das zweite Beispiel wird vom Personal Security Manager benutzt.</p> -<h3 id="Initialisierung_der_Installation">Initialisierung der Installation</h3> -<p>Das Install Objekt hat eine Funktion, <code>initInstall(), welche</code> zur Initialisierung der Installation gebraucht wird. Es sollte am Anfang des Installationsskript aufgerufen werden. Die Syntax dieser Funktion ist die folgende:</p> -<pre>initInstall( ''packageName'' , ''regPackage'' , ''version'' );</pre> -<p>Ein Beispiel</p> -<pre>initInstall("Find Files","/Xulplanet/Find Files","0.5.0.0");</pre> -<ul> - <li>Das erste Argument ist der Name des Paketes in einer lesbaren Form.</li> - <li>Das zweite Argument ist der Registrierungsschlüssel, welcher die Paketinformationen speichert.</li> - <li>Das dritte Argument ist die Version des Pakets, welches installiert werden soll.</li> -</ul> -<p>Als nächstes müssen wir das Verzeichnis festlegen, wo die Dateien installiert werden sollen. Es gibt zwei Möglichkeiten.</p> -<ul> - <li>Die einfache Methode ist, ein Installationsverzeichnis festzulegen und alle Datei dort zu installieren.</li> - <li>Die zweite Methode erlaubt Ihnen ein Zielverzeichnis für einzelne Dateien zu bestimmen. Die erste Methode wird nun beschrieben.</li> -</ul> -<p>Die Funktion <code>setPackageFolder()</code> legt ein Installationsverzeichnis fest. Für den Dateisuche-Dialog werden wir die Dateien in das Chrome-Verzeichnis installieren. (Wir könnten sie überall speichern). Die Funktion <code>setPackageFolder()</code> nimmt ein Argument an, das Installationsverzeichnis. Für maximale Portabilität kann kein String-Name für das Verzeichnis festgelegt werden. Stattdessen wird ein Identifier eines bekannten Verzeichnis verwendet und dann werden dort Unterverzeichnisse erstellt. Falls Ihre Anwendung Systembibliotheken installieren muss, brauchen Sie den Pfad dieser Verzeichnisse nicht zu wissen.</p> -<p>Die Verzeichnis-Identifiers sind in der <a class="external" href="http://www.xulplanet.com/references/elemref/ref_Install.html#prop_getFolder">XULPlanet Referenz</a> aufgelistet. Für das Chrome-Verzeichnis ist der Identifier 'Chrome'. Die <code>getFolder()</code> Funktion kann verwendet werden, um eine der speziellen Verzeichnisse zu bekommen. Diese Funktion nimmt zwei Argumente, das erste ist der Identifier und das zweite ist ein Unterverzeichnis. Zum Beispiel:</p> -<pre>findDir = getFolder("Chrome","findfile"); -setPackageFolder(findDir); -</pre> -<p>Hier bekommen wir das "findfile" Verzeichnis im Chrome-Ordner und reichen dies an die <code>setPackageFolder()</code> Funktion weiter. Das zweite Argument für <code>getFolder()</code> ist das Unterverzeichnis in dem wir installieren werden, was nicht bedeutet, dass es existieren muss. Dieses Argument kann weggelassen werden, wenn Sie kein Unterverzeichnis benötigen.</p> -<h3 id="Setting_Install_Files" name="Setting_Install_Files">Installationsdateien festlegen</h3> -<p>Als nächstes müssen die Dateien festgelegt werden, die installiert werden sollen. Das erfordert die Verwendung der Funktionen <code>addDirectory()</code> und <code>addFile()</code>. Die <code>addDirectory()</code> Funktion teilt dem Instller mit, dass ein Verzeichnis aus dem XPI Archiv (und alle Inhalte darin) in ein bestimmtes Verzeichnis installiert werden soll. Die Funktion <code>addFile()</code> ist ähnlich, aber für eine einzelne Datei.</p> -<p>Beide Funktionen <code>addDirectory()</code> und <code>addFile()</code> haben unterschiedliche Formen. Die einfachste Form nimmt nur ein Argument: Das Verzeichnis, welches von der Installation erstellt werden soll.</p> -<pre class="eval">addDirectory ( <em>dir</em> ); -addFile ( <em>dir</em> ); - -<strong>Beispiel:</strong> - -addDirectory("findfile"); -</pre> -<p>Das obige Beispiel legt ein Verzeichnis "findfile" für die Installation fest. Diese Funktionen können mehrmals aufgerufen werden, um mehrere Verzeichnisse und Dateien zu installieren.</p> -<p>Als nächstes wollen wir die Dateien im Chrome System registrieren, sodass diese mit einer Chrome-URL verwendet werden können. Das kann mit der <code>registerChrome()</code> Funktion erledigt werden. Die Funktion nimmt zwei Argumente an, als erstes den Chrome-Typ, der registriert werden soll (content, skin oder locale). Ein zweites Argument ist das Verzeichnis, welches die contents.rdf Datei enthält. Weil der Dateisuche-Dialog content, eine Skin-Datei und eine locale-Datei enthält, muss <code>registerChrome()</code> dreimal aufgerufen werden.</p> -<pre>registerChrome(Install.CONTENT | Install.DELAYED_CHROME, getFolder(findDir, "content")); -registerChrome(Install.SKIN | Install.DELAYED_CHROME, getFolder(findDir, "skin")); -registerChrome(Install.LOCALE | Install.DELAYED_CHROME, getFolder(findDir, "locale")); -</pre> -<p> DELAYED_CHROME wird verwendet, um anzuzeigen, dass es beim nächsten Mozilla-Start installiert werden soll.</p> -<h3 id="Abschluss_der_Installation">Abschluss der Installation</h3> -<p>Die <code>addDirectory()</code> und <code>addFile()</code> Funktions kopieren keine Dateien. Sie geben nur an, welche Dateien installiert werden sollen. Ebenfalls gibt <code>registerChrome()</code> nur an, dass diese im chrome-System registriert werden sollen. Um den Prozess zu vervollständigen und Dateien zu kopieren, muss die <code><span style="font-family: Verdana,Tahoma,sans-serif;">p</span>erformInstall()</code> Funktion aufgerufen werden. Diese Funktionen erwartet keine Argumente.</p> -<p>Das finale Skript zur Installation der "Dateisuche"-Komponente ist unten aufgeführt:</p> -<div class="highlight"> - <p><a href="https://developer.mozilla.org/samples/xultu/examples/ex_xpiscript_1.js.txt">Datei</a></p> - <pre>initInstall("Find Files","/Xulplanet/Find Files","0.5.0.0"); - -findDir = getFolder("Chrome","findfile"); -setPackageFolder(findDir); - -addDirectory("findfile"); - -registerChrome(Install.CONTENT | Install.DELAYED_CHROME, getFolder(findDir, "content")); -registerChrome(Install.SKIN | Install.DELAYED_CHROME, getFolder(findDir, "skin")); -registerChrome(Install.LOCALE | Install.DELAYED_CHROME, getFolder(findDir, "locale")); - -performInstall(); -</pre> -</div> -<p>Als nächstes schauen wir uns <a href="/de/XUL_Tutorial/Zusätzliche_Installationseigenschaften" title="de/XUL Tutorial/Zusätzliche Installationseigenschaften">zusätzliche Installationsfunktionen</a> an.</p> -<div class="prevnext" style="text-align: right;"> - <p><a href="/de/docs/XUL_Tutorial/Erstellen_eines_Installers" style="float: left;">« zurück</a><a href="/de/docs/XUL_Tutorial/Zusätzliche_Installationseigenschaften">weiter »</a></p> -</div> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html b/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html deleted file mode 100644 index 7f6f44a00e..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/lokalisierung/index.html +++ /dev/null @@ -1,270 +0,0 @@ ---- -title: Lokalisierung -slug: Archive/Mozilla/XUL/XUL_Tutorial/Lokalisierung -tags: - - Lokalisierung - - XUL - - XUL_Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/Localization ---- -<p>{{ PreviousNext("XUL_Tutorial/Eine_eigene_Skin_erstellen", "XUL_Tutorial/Property-Dateien") }}</p> -<p>XUL und XML stellen Entities als komfortablen Weg bereit, um Lokalisierungen zu ermöglichen.</p> -<h3 id="Entities">Entities</h3> -<p>Viele Anwendungen sind so gebaut, dass das Interface so einfach wie möglich in verschiedene Sprachen zu übersetzten ist. Üblicherweise wird eine Tabelle aus Strings für jede Sprache erstellt. Anstelle von den Text direkt in die Applikation zu programmieren, stellt jede Textstelle nur eine Referenz zur Stringtabelle dar. <a href="/de/XML" title="de/XML">XML</a> stellt Entities zur Verfügung, welche für den gleichen Zweck verwendet werden können.</p> -<p>Man sollte mit Entities bereits vertraut sein, wenn man schon Erfahrungen mit <a href="/de/HTML" title="de/HTML">HTML</a> sammeln konnte. Der Code <code>&lt;</code> und <code>&gt;</code> sind Beispiele von Entities, welche anstelle von „Größer-als-“ und „Kleiner-als-Zeichen“ im Text verwendet werden können. XML besitzt einen Syntax, welcher dir das deklarieren eigener Entities erlaubt. Du kannst diese so verwenden, dass das Entity durch seinen Wert ersetzt wird, welcher ein Textstring ist. Entities können immer wenn Text auftritt verwendet werden, inklusive den Attributwerten. Das Beispiel unten demonstriert die Verwendung eines Entity in einem Button.</p> -<pre><button label="&findLabel;"/> -</pre> -<p>Der Text der als Label erscheinen wird, wird den Wert des Entity <code>&findLabel;</code> sein. Eine Datei welche die Entity-Deklaration enthält wird für jede unterstützte Sprache erstellt. Für Englisch wird das <code>&findLabel;</code> Entity wahrscheinlich mit dem Text »Find« deklariert sein.</p> -<h3 id="DTD-Dateien">DTD-Dateien</h3> -<p>Entities sind in <em>Document Type Declaration</em> (DTD) Dateien deklariert. Dateien dieses Typs werden normalerweise verwendet um den Syntax und die Semantik einer bestimmten XML-Datei zu deklarieren, aber es können auch Entities deklariert werden. Im Mozilla Chrome-System sind die DTD Dateien im <code>locales</code> Unterordner zu finden. Normalerweise existiert eine DTD Datei (mit der Endung <code>.dtd</code>) pro XUL-Datei.</p> -<p>Wenn man im Chrome-Ordner nachschaut, sollte man ein Archiv für die jeweilige Sprache (<code>de-De.jar</code> ist normalerweise Deutsch) finden. Es ist möglich lokale Dateien in verschiedenen Sprachen, z.B. Deutsch (de-DE) und Englisch (en-US) zu haben. Innerhalb dieser Archive sind die Dateien zu finden, welche den lokalisierten Text für jedes Fenster enthalten. Die Struktur der Archive ist sehr ähnlich derjenigen, die für Skins verwendet wird.</p> -<p>Im Innern der Archive würde man die DTD-Dateien platzieren in welchen die Entities deklariert werden sollen. Normalerweise wird für jede XUL-Datei eine DTD-Datei mit dem gleichen Namen erstellt mit allerdings einer <code>.dtd</code> Endung. Daher werden wir für den Dateisuchdialog eine Datei namens <code>findfile.dtd</code> benötigen.</p> -<p>Für nicht installierte chrome Dateien kann einfach die DTD-Datei ins selbe Verzeichnis wie die XUL-Datei ablegt werden.</p> -<div class="note"><strong>Anmerkung:</strong> Die DTD-Dateien sollten für nicht ASCII Zeichen als UTF-8 kodiert werden. Deswegen sollten die Dateien im UTF-8 Format gespeichert werden. (<a class="external" href="http://www.mozdev.org/notes/l10n/unicode/editors-en.html">ohne BOM</a>). Für mehr Informationen, siehe <a class="external" href="http://www.mozilla.org/projects/l10n/mlp_chrome.html#text">Mozilla Sprachpakete</a>.</div> -<p>Sobald eine DTD-Datei für das XUL erstellt worden ist, muss eine Zeile in die XUL-Datei einfügt werden, welche angibt, dass die DTD-Datei verwendet werden soll. Andernfalls werden Fehler auftreten, weil die Entities nicht gefunden werden. Um dies zu tun, muss die folgende Zeile irgendwo im oberen Bereich der XUL-Datei eingefügt werden:</p> -<pre><!DOCTYPE window SYSTEM "chrome://findfile/locale/findfile.dtd"> -</pre> -<p>Diese Zeile legt fest, dass die URL auf eine DTD-Datei verweist. In diesem Fall wurde deklariert, dass die <code>findfile.dtd</code> DTD-Datei verwendet werden soll. Diese Zeile ist typischerweise gerade vor dem <code>window</code> Element platziert.</p> -<h3 id="Entities_deklarieren">Entities deklarieren</h3> -<p>Die Entities werden mit einem einfachen Syntax deklariert:</p> -<pre><!ENTITY findLabel "Find"> -</pre> -<p>Dieses Beispiel erstellt ein Entity mit dem Namen <code>findLabel</code> und dem Wert »Find«. Dies bedeutet, dass überall wo der Text „&findLabel;“ in der XUL-Datei auftritt es durch den Text »Find« ersetzt wird. Es sollte beachtet werden, dass die Deklaration kein Slash am Ende besitzt. In der DTD-Datei einer anderen Sprache wird der Text stattdessen in dieser Sprache geschrieben.</p> -<pre class="eval"><strong>für Japanisch:</strong> -<!ENTITY findLabel "検索"> -</pre> -<p>Zum Beispiel der folgende Text:</p> -<pre><description value="&findLabel;"/> -</pre> -<p>wird übersetzt als:</p> -<pre class="eval"><strong>Englische Version:</strong> -<description value="Find"/> - -<strong>Japanische Version:</strong> -<description value="検索"/> -</pre> -<p>Es wird ein Entity für jede Beschriftung und Textstelle vorhanden sein, die dem Interface verwendet wird. Es sollte kein direkt angezeigter Text in den XUL-Dateien existieren.</p> -<p>Zusätzlich zu der Verwendung in Beschriftungen, sollten Entities für jeden Wert verwendet werden, welcher in einer anderen Sprache abweichen könnte. Access-Keys und Tastatur-Shortcuts zum Beispiel.</p> -<pre class="eval"> <strong>XUL</strong> - <menuitem label="&undo.label;" accesskey="&undo.key;"/> - <strong>DTD</strong> - <!ENTITY undo.label "Undo"> - <!ENTITY undo.key "u"> -</pre> -<p>Das Beispiel oben verwendet zwei Entities, eines für die Beschriftung des Menüpunktes und ein zweiter für den Access-Key.</p> -<p> </p> -<div class="highlight"> -<h3 id=".C3.84nderung_des_Dateisuche_Beispiels" name=".C3.84nderung_des_Dateisuche_Beispiels">Änderung des Dateisuche Beispiels</h3> -<p>Werfen wir jetzt einen Blick darauf, wie wir das alles zusammenfügen können, indem wir den Dateisuche-Dialog so modifizieren, so dass eine DTD-Datei für alle seine Textstellen verwendet wird. Die gesamte XUL-Datei mit allen Änderungen in Rot ist unterhalb gezeigt.</p> -<pre class="eval"><?xml version="1.0"?> - -<?xml-stylesheet href="<a class=" external" rel="freelink">chrome://global/skin/</a>" type="text/css"?> -<?xml-stylesheet href="findfile.css" type="text/css"?> - -<span class="highlightred"><!DOCTYPE window SYSTEM "<a class=" external" rel="freelink">chrome://findfile/locale/findfile.dtd</a>"></span> - -<window - id="findfile-window" - title="<span class="highlightred">&findWindow.title;</span>" - persist="screenX screenY width height" - orient="horizontal" - onload="initSearchList()" - xmlns="<span class="nowiki">http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul</span>"> - -<script src="findfile.js"/> - -<popupset> - <popup id="editpopup"> - <menuitem label="Cut" accesskey="<span class="highlightred">&cutCmd.accesskey;</span>"/> - <menuitem label="Copy" accesskey="<span class="highlightred">&copyCmd.accesskey;</span>"/> - <menuitem label="Paste" accesskey="<span class="highlightred">&pasteCmd.accesskey;</span>" disabled="true"/> - </popup> -</popupset> - -<keyset> - <key id="cut_cmd" modifiers="accel" key="<span class="highlightred">&cutCmd.commandkey;</span>"/> - <key id="copy_cmd" modifiers="accel" key="<span class="highlightred">&copyCmd.commandkey;</span>"/> - <key id="paste_cmd" modifiers="accel" key="<span class="highlightred">&pasteCmd.commandkey;</span>"/> - <key id="close_cmd" keycode="VK_ESCAPE" oncommand="window.close();"/> -</keyset> - -<vbox flex="1"> - - <toolbox> - - <menubar id="findfiles-menubar"> - <menu id="file-menu" label="<span class="highlightred">&fileMenu.label;</span>" - accesskey="<span class="highlightred">&fileMenu.accesskey;</span>"> - <menupopup id="file-popup"> - <menuitem label="<span class="highlightred">&openCmd.label;</span>" - accesskey="<span class="highlightred">&openCmd.accesskey;</span>"/> - <menuitem label="<span class="highlightred">&saveCmd.label;</span>" - accesskey="<span class="highlightred">&saveCmd.accesskey;</span>"/> - <menuseparator/> - <menuitem label="<span class="highlightred">&closeCmd.label;</span>" - accesskey="<span class="highlightred">&closeCmd.accesskey;" key="close_cmd" oncommand="window.close();</span>"/> - </menupopup> - </menu> - <menu id="edit-menu" label="<span class="highlightred">&editMenu.label;</span>" - accesskey="<span class="highlightred">&editMenu.accesskey;</span>"> - <menupopup id="edit-popup"> - <menuitem label="<span class="highlightred">&cutCmd.label;</span>" - accesskey="<span class="highlightred">&cutCmd.accesskey;</span>" key="cut_cmd"/> - <menuitem label="<span class="highlightred">&copyCmd.label;</span>" - accesskey="<span class="highlightred">&copyCmd.accesskey;</span>" key="copy_cmd"/> - <menuitem label="<span class="highlightred">&pasteCmd.label;</span>" - accesskey="<span class="highlightred">&pasteCmd.accesskey;</span>" key="paste_cmd" disabled="true"/> - </menupopup> - </menu> - </menubar> - - <toolbar id="findfiles-toolbar"> - <toolbarbutton id="opensearch" label="<span class="highlightred">&openCmdToolbar.label;</span>"/> - <toolbarbutton id="savesearch" label="<span class="highlightred">&saveCmdToolbar.label;</span>"/> - </toolbar> - </toolbox> - - <tabbox> - <tabs> - <tab label="<span class="highlightred">&searchTab;</span>" selected="true"/> - <tab label="<span class="highlightred">&optionsTab;</span>"/> - </tabs> - - <tabpanels> - - <tabpanel id="searchpanel" orient="vertical" context="editpopup"> - - <description> - <span class="highlightred">&findDescription;</span> - </description> - - <spacer class="titlespace"/> - - <groupbox orient="horizontal"> - <caption label="<span class="highlightred">&findCriteria;</span>"/> - - <menulist id="searchtype"> - <menupopup> - <menuitem label="<span class="highlightred">&type.name;</span>"/> - <menuitem label="<span class="highlightred">&type.size;</span>"/> - <menuitem label="<span class="highlightred">&type.date;</span>"/> - </menupopup> - </menulist> - <spacer class="springspace"/> - <menulist id="searchmode"> - <menupopup> - <menuitem label="<span class="highlightred">&mode.is;</span>"/> - <menuitem label="<span class="highlightred">&mode.isnot;</span>"/> - </menupopup> - </menulist> - <spacer class="springspace"/> - - <menulist id="find-text" flex="1" - editable="true" - datasources="<a class=" external" rel="freelink">file:///mozilla/recents.rdf</a>" - ref="<span class="nowiki">http://www.xulplanet.com/rdf/recent/all</span>"> - <template> - <menupopup> - <menuitem label="<span class="nowiki">rdf:http://www.xulplanet.com/rdf/recent#Label</span>" uri="rdf:*"/> - </menupopup> - </template> - </menulist> - - </groupbox> - - </tabpanel> - - <tabpanel id="optionspanel" orient="vertical"> - <checkbox id="casecheck" label="<span class="highlightred">&casesensitive;</span>"/> - <checkbox id="wordscheck" label="<span class="highlightred">&matchfilename;</span>"/> - </tabpanel> - - </tabpanels> - </tabbox> - - <tree id="results" style="display: none;" flex="1"> - <treecols> - <treecol id="name" label="<span class="highlightred">&results.filename;</span>" flex="1"/> - <treecol id="location" label="<span class="highlightred">&results.location;</span>" flex="2"/> - <treecol id="size" label="<span class="highlightred">&results.size;</span>" flex="1"/> - </treecols> - - <treechildren> - <treeitem> - <treerow> - <treecell label="mozilla"/> - <treecell label="/usr/local"/> - <treecell label="<span class="highlightred">&bytes.before;</span>2520<span class="highlightred">&bytes.after;</span>"/> - </treerow> - </treeitem> - </treechildren> - </tree> - - <splitter id="splitbar" resizeafter="grow" style="display: none;"/> - - <spacer class="titlespace"/> - - <hbox> - <progressmeter id="progmeter" value="50%" style="display: none;"/> - <spacer flex="1"/> - <button id="find-button" label="<span class="highlightred">&button.find;</span>" - oncommand="doFind()"/> - <button id="cancel-button" label="<span class="highlightred">&button.cancel;</span>" - oncommand="window.close();"/> - </hbox> -</vbox> - -</window> -</pre> -<p>Jede Textstelle wurde durch eine Entity ersetzt. Eine DTD-Datei wurde nahe am Anfang eingefügt. Jede Entity welche eingefügt wurde, sollte in der DTD-Datei deklariert sein. Das Fenster wird nicht angezeigt, wenn eine Entity in der XUL-Datei gefunden wird, welche nicht deklariert wurde.</p> -<p>Es sollte beachtet werden, dass der Name der Entity nicht wichtig ist. Im Beispiel oben wurden die Wörter der Entities mit Bindestrichen getrennt. Dies ist keine Vorgabe. Die Entity-Namen folgen den selben Konventionen wie der Rest des Mozilla Codes.</p> -<p>Es ist vielleicht aufgefallen, dass der Text '2520 bytes' durch zwei Entities ersetzt wurde. Das kommt daher, weil die Struktur in anderen Sprachen variieren kann. Es könnte z.B. nötig sein, dass die Einheit vor der Zahl steht.</p> -<p>Die Access-Keys und Tastatur-Shortcuts wurden auch in Entities übersetzt, weil sie in anderen Sprachen abweichen können.</p> -<p>Nun die DTD-Datei - findfile.dtd:</p> -<pre><!ENTITY findWindow.title "Find Files"> -<!ENTITY fileMenu.label "File"> -<!ENTITY editMenu.label "Edit"> -<!ENTITY fileMenu.accesskey "f"> -<!ENTITY editMenu.accesskey "e"> -<!ENTITY openCmd.label "Open Search..."> -<!ENTITY saveCmd.label "Save Search..."> -<!ENTITY closeCmd.label "Close"> -<!ENTITY openCmd.accesskey "o"> -<!ENTITY saveCmd.accesskey "s"> -<!ENTITY closeCmd.accesskey "c"> -<!ENTITY cutCmd.label "Cut"> -<!ENTITY copyCmd.label "Copy"> -<!ENTITY pasteCmd.label "Paste"> -<!ENTITY cutCmd.accesskey "t"> -<!ENTITY copyCmd.accesskey "c"> -<!ENTITY pasteCmd.accesskey "p"> -<!ENTITY cutCmd.commandkey "X"> -<!ENTITY copyCmd.commandkey "C"> -<!ENTITY pasteCmd.commandkey "V"> -<!ENTITY openCmdToolbar.label "Open"> -<!ENTITY saveCmdToolbar.label "Save"> -<!ENTITY searchTab "Search"> -<!ENTITY optionsTab "Options"> -<!ENTITY findDescription "Enter your search criteria below and select the Find button to begin the search."> -<!ENTITY findCriteria "Search Criteria"> -<!ENTITY type.name "Name"> -<!ENTITY type.size "Size"> -<!ENTITY type.date "Date Modified"> -<!ENTITY mode.is "Is"> -<!ENTITY mode.isnot "Is Not"> -<!ENTITY casesensitive "Case Sensitive Search"> -<!ENTITY matchfilename "Match Entire Filename"> -<!ENTITY results.filename "Filename"> -<!ENTITY results.location "Location"> -<!ENTITY results.size "Size"> -<!ENTITY bytes.before ""> -<!ENTITY bytes.after "bytes"> -<!ENTITY button.find "Find"> -<!ENTITY button.cancel "Cancel"> -</pre> -<p>Um den Text in einer neuen Sprache hinzuzufügen, genügt es eine weitere DTD-Datei zu erstellen. Durch die Verwendung des Chrome Systems, um die DTD-Datei einer anderen Sprache hinzuzufügen, kann die selbe XUL-Datei für jede Sprache verwendet werden.</p> -<p>Das Dateisuche Beispiel so weit: <a class=" external" href="http://developer.mozilla.org/samples/xultu/examples/findfile/findfile-locale.xul.txt">Quellcode</a></p> -</div> -<p>Als nächstes werden wir einen Blick auf <a href="/de/XUL_Tutorial/Property-Dateien">Property Dateien</a> werfen.</p> -<p>{{ PreviousNext("XUL_Tutorial/Eine_eigene_Skin_erstellen", "XUL_Tutorial/Property-Dateien") }}</p> -<p>{{ languages( { "en": "en/XUL_Tutorial/Localization", "fr": "fr/Tutoriel_XUL/Localisation", "ja": "ja/XUL_Tutorial/Localization", "pl": "pl/Kurs_XUL/Lokalizacja" } ) }}</p> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html b/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html deleted file mode 100644 index 756e025aaa..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/positionierung_von_elementen/index.html +++ /dev/null @@ -1,259 +0,0 @@ ---- -title: Positionierung von Elementen -slug: Archive/Mozilla/XUL/XUL_Tutorial/Positionierung_von_Elementen -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/Element_Positioning ---- -<div class="prevnext" style="text-align: right;"> - <p><a href="/de/docs/XUL_Tutorial/Das_Box-Modell" style="float: left;">« zurück</a><a href="/de/docs/XUL_Tutorial/Details_zum_Box-Modell">weiter »</a></p> -</div> - -<p>Schauen wir uns die Steuerung von Positionen und Größen von XUL Elementen an.</p> - -<h2 id="Positionierung_in_Boxen">Positionierung in Boxen</h2> - -<p>Bis jetzt wissen wir, dass Elemente entweder horizontal oder vertikal innerhalb einer Box positioniert werden können. Meistens brauchen wir aber weitere Steuerungsmöglichkeiten zur Position und Größe von Elementen in der Box. Dazu müssen wir uns zunächst anschauen wie eine Box arbeitet.</p> - -<p>Die Position eines Elementes wird vom Layout des Containers bestimmt. Zum Beispiel ist die Position einer Schaltfläche in einer horizontalen Box rechts von der vorherigen Schaltfläche, sofern diese existiert. Die Größe eines Elements wird von zwei Faktoren beeinflusst: Die Größe, die das Element an Größe braucht und die Größe, die Sie festlegen. Die Größe, die das Element braucht, hängt vom dem ab, was sich innerhalb des Elements befindet. Zum Beispiel wird die Breite einer Schaltfläche anhand des Textes, welcher sich darauf befindet, berechnet.</p> - -<p>Ein Element wird generell so groß wie es Inhalt vorschreibt und nicht größer. Einige Elemente verfügen über eine Standardgröße (z.B. Textboxen), welche verwendet wird. Eine horizontale Box mit drei Schaltflächen darin, wird so groß wie die drei Schaltflächen plus einem kleinen zusätzlichen Abstand.</p> - -<div class="float-right"><img alt="Image:boxstyle1n.png" class="internal" src="/@api/deki/files/571/=Boxstyle1n.png"></div> - -<p>Im Bild wurde den ersten beiden Schaltflächen eine passende Größe vorgeschrieben, um den Text anzuzeigen. Die dritte Schaltfläche ist größer, weil sie mehr Inhalt enthält. Die Breite der umschließenden Box ist die Summe der Breite der drei Schaltflächen plus einem zusätzlichen Abstand zwischen ihnen. Die Höhe der Schaltflächen ist passend zur Textgröße berechnet worden.</p> - -<h3 id="Width_und_height_Attribute">Width und height Attribute</h3> - -<p>Sie möchten sicher mehr Einfluss auf die Größe eines Elements in einem Fenster nehmen können. Es gibt eine Reihe von Features, die Ihnen erlauben die Größe eines Elementes festzulegen. Der schnellste Weg ist, einfach die <code><code id="a-width"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/width">width</a></code></code> und <code><code id="a-height"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/height">height</a></code></code> Attribute festzulegen, genauso wie Sie es vielleicht von HTML kennen. Ein Beispiel dazu:</p> - -<p><span id="Beispiel_1"><a id="Beispiel_1"></a><strong>Beispiel 1</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_1.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_1.xul">Ansehen</a></p> - -<pre><button label="OK" width="100" height="40"/> -</pre> - -<p>Es ist jedoch nicht empfohlen, das so zu machen. Es ist passt nicht in einige Themes und ist umständlicher anpassbar. Ein besserer Weg ist, CSS Eigenschaften zu verwenden, welche wie in HTML arbeiten. Die folgenden CSS Eigenschaften können dazu verwendet werden:</p> - -<dl> - <dt><a href="/de/docs/Web/CSS/width" title="Die width CSS Eigenschaft legt die Breite des Inhaltsbereichs eines Elements fest. Der Inhaltsbereich ist innerhalb des Innenabstands, Rahmens und Außenabstands des Elements."><code>width</code></a></dt> - <dd>Legt die Breite eines Elementes fest.</dd> - <dt><a href="/de/docs/Web/CSS/height" title="Die height CSS Eigenschaft bestimmt die Höhe des Inhaltsbereichs eines Elements. Der Inhaltsbereich ist innerhalb des Innenabstands, der Rahmen und des Außenabstands des Elements."><code>height</code></a></dt> - <dd>Legt die Höhe eines Elementes fest.</dd> -</dl> - -<p>Werden beide Eigenschaften festgelegt, wird das Element mit dieser Breite und Höhe erstellt. Wird nur eines der beiden angegeben, wird die andere Eigenschaft nach dem benötigten Platz berechnet. Die Größe sollte als Zahl gefolgt von einer Einheit angegeben werden.</p> - -<h3 id="Flexible_Elemente">Flexible Elemente</h3> - -<p>Die Größen der Elemente sind ziemlich einfach zu berechnen für nicht-flexible Elemente. Sie folgen einfach der festgelegten Breiten und Höhen und sobald eine Größe nicht festgelegt wurde, wird das Element so groß wie es für den Inhalt erforderlich ist. Für flexible Elemente ist die Berechnung allerdings nicht ganz so einfach.</p> - -<p>Flexible Elemente sind solche, die über ein <code><code id="a-flex"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/flex">flex</a></code></code> Attribut verfügen und einen Wert größer als 0 haben. Flexible Elemente passen sich an den verfügbaren Freiraum an. Die Standardgröße wird trotzdem genauso berechnet wie für nicht-flexible Elemente. Das folgende Beispiel soll dies verdeutlichen:</p> - -<p><span id="Beispiel_2"><a id="Beispiel_2"></a><strong>Beispiel 2</strong></span> : <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_2.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_2.xul">Ansehen</a></p> - -<pre><window orient="horizontal" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - -<hbox> - <button label="Yes" flex="1"/> - <button label="No"/> - <button label="I really don't know one way or the other"/> -</hbox> - -</window> -</pre> - -<p>Das Fenster wird zunächst so erscheinen wie im vorherigen Bild. Die ersten beiden Schaltflächen werden auf eine passende Breite und die dritte Schaltfläche auf längere Breite skaliert, weil diese über eine längere Aufschrift verfügt. Die erste Schaltfläche ist flexibel und alle Elemente wurde in eine Box getan. Die Breite dieser Box wird auf die Startgröße aller drei Schaltflächen gesetzt (ca. 430 Pixel in dem Bild).</p> - -<p>Wenn Sie nun das Fenster vergrößern, wird überprüft, ob Elemente flexibel sind, um den entstehenden Freiraum zu füllen, der entstehen würde. Da die erste Schaltfläche das einzig flexible Element ist, sollte es größer werden. Das geschieht in diesem Fall jedoch nicht, da die Box in dem sich die Schaltfläche befindet nicht flexibel ist. Ein unflexibles Element kann niemals seine Größe ändern, wenn der Platz verfügbar ist. Die Schaltfläche kann also nicht größer werden.</p> - -<p>Die Lösung ist, die Box ebenfalls flexibel zu machen. Wird dann das Fenster größer gemacht, ist zusätzlicher Raum verfügbar und die Box wird diesen Raum füllen. Weil die Box größer ist, ist auch mehr Platz innerhalb verfügbar und die flexible Schaltfläche kann diesen Platz einnehmen. Dieser Prozess wird für jede Verschachtelung wiederholt.</p> - -<h2 id="Minimale_und_maximale_Größen_festlegen">Minimale und maximale Größen festlegen</h2> - -<p>Vielleicht möchten Sie, dass ein Element eine bestimmte Größe besitzt, aber dennoch flexibel ist. Es können Größen festgelegt werden, die auch flexible Elemente nicht über- oder unterschreiten sollen. Diese Einstellung erreicht man mit diesen vier Attributen:</p> - -<dl> - <dt><code id="a-minwidth"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/minwidth">minwidth</a></code></dt> - <dd>Legt die minimale Breite eines Elements fest.</dd> - <dt><code id="a-minheight"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/minheight">minheight</a></code></dt> - <dd>Legt die minimale Höhe eines Elements fest.</dd> - <dt><code id="a-maxwidth"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/maxwidth">maxwidth</a></code></dt> - <dd>Legt die maximale Breite eines Elements fest.</dd> - <dt><code id="a-maxheight"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/maxheight">maxheight</a></code></dt> - <dd>Legt die maximale Höhe eines Elements fest.</dd> -</dl> - -<p>Die Werten werden immer in Pixeln angegeben. Es können auch die zugehörigen CSS Eigenschaften angegeben werden: <code>min-width</code>, <code>min-height</code>, <code>max-width</code> und <code>max-height</code>.</p> - -<p>Diese Eigenschaften sind nur für flexible Elemente sinnvoll. Wird zum Beispiel eine maximale Höhe festgelegt, wird eine Schaltfläche nur bis zu einer bestimmten Größe skaliert. Sie können das Fenster weiterhin vergrößern, die Schaltfläche wird jedoch nicht weiter vergrößert werden. Die Box, in der sich die Schaltfläche befindet wird sich weiterhin anpassen, wenn Sie keine maximale Höhe festgelegt haben.</p> - -<p>Wenn zwei Schaltflächen flexibel sind, werden sich normalerweise beide den freien Platz gleichermaßen teilen. Falls eine Schaltfläche eine maximale Breite hat, wird die zweite Schaltfläche den restlichen Freiraum mit einnehmen.</p> - -<p>Wenn eine Box über eine maximale Breite oder Höhe verfügt, können die darin enthaltenen Kindelemente nicht größer als die festgelegte Größe der Box werden. Wenn eine minimale Breite oder Höhe vorliegt, können die Kindelemente ebenfalls nicht kleiner werden.</p> - -<h5 id="Beispiele_zur_Festlegung_von_Breiten_und_Höhen">Beispiele zur Festlegung von Breiten und Höhen</h5> - -<pre><button label="1" style="width: 100px;"/> -<button label="2" style="width: 100em; height: 10px;"/> -<button label="3" flex="1" style="min-width: 50px;"/> -<button label="4" flex="1" style="min-height: 2ex; max-width: 100px"/> -<textbox flex="1" style="max-width: 10em;"/> -<description style="max-width: 50px">This is some boring but simple -wrapping text.</description> -</pre> - -<dl> - <dt>Beispiel 1 </dt> - <dd>Die erste Schaltfläche wird mit einer Breite von 100 Pixeln (px bedeutet Pixel) angezeigt. Die Einheit muss angegeben werden, sonst wird die Breite ignoriert.</dd> - <dt>Beispiel 2 </dt> - <dd>Die zweite Schaltfläche wird mit einer Höhe von 10 Pixeln und einer Breite von 100em (ein em ist die Größe eines Zeichens der aktuellen Schrift) angezeigt.</dd> - <dt>Beispiel 3 </dt> - <dd>Die dritte Schaltfläche ist flexibel, sie wird also auf Basis der Größe Box der angezeigt. Die Schaltfläche wird jedoch niemals kleiner als 50 Pixel breit. Andere flexible Komponenten wie z.B. Spacer werden den verbleibenden Platz einnehmen.</dd> - <dt>Beispiel 4 </dt> - <dd>Die vierte Schaltfläche is flexibel und wird niemals eine Höhe haben, die kleiner als 2 ex ist (ein ex ist normalerweise die Höhe des Buchstaben x der aktuellen Schrift) oder größer als 100 Pixel ist.</dd> - <dt>Beispiel 5 </dt> - <dd>Das Texteingabefeld ist flexibel, wird aber niemals größer als 10em werden. Sie werden vermehrt em verwenden wollen, da Sie Größen für Elemente festlegen, die Text enthalten. Diese Einheit ist hilfreich für Textboxen, da die Schrift geändert werden kann und die Textbox immer eine passende Größe hat, auch wenn der Text mal ganz groß werden sollte.</dd> - <dt>Beispiel 6 </dt> - <dd>Das <code><code><a href="/de/docs/Mozilla/Tech/XUL/description" title="description">description</a></code></code> Element wird gezwungen eine maximale Breite von 50 Pixeln zu besitzen. Der Text innerhalb wird in eine neue Zeile verschoben, wenn die 50 Pixel erreicht sind.</dd> -</dl> - -<div class="highlight"> -<h5 id="Unser_Dateisuche-Dialog">Unser Dateisuche-Dialog</h5> - -<p>Fügen wir einige dieser Möglichkeiten zu unserem Dateisuche-Dialog hinzu. Wir werden es so machen, dass die Textbox auf das gesamte Fenster ausgestreckt wird.</p> - -<pre><textbox id="find-text" flex="1" style="min-width: 15em;"/> -</pre> - -<div class="float-right"><img alt="Image:boxstyle1.png" class="internal" src="/@api/deki/files/570/=Boxstyle1.png"></div> - -<p>Hier wurde das Texteingabefeld flexibel gemacht. Demnach wird es sich anpassen, wenn der Benutzer die Fenstergröße ändert. Das ist sehr hilfreich, wenn der Benutzer einen langen Text einfügen möchte. Außerdem wurde eine minimale Breite von 15em festgelegt, damit immer zumindest 15 Zeichen zu sehen sind. Verkleinert der Benutzer den Dialog sehr stark, wird das Texteingabefeld nur bis 15em verkleinert. Es wird so gezeichnet werden, als wenn es sich auch außerhalb des Fensters ausbreitet. Beachten Sie, dass das Bild ein Texteingabefeld zeigt, welches auf die maximale Fenstergröße ausgebreitet wurde.</p> -</div> - -<h2 id="Anordnung_in_Boxen">Anordnung in Boxen</h2> - -<p>Wenn Sie eine Box mit zwei Kindelementen haben, beide nicht flexibel, die Box ist aber flexibel. Zum Beispiel:</p> - -<p><span id="Beispiel_3"><a id="Beispiel_3"></a><strong>Beispiel 3</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_3.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_3.xul">Ansehen</a></p> - -<pre><box flex="1"> - <button label="Happy"/> - <button label="Sad"/> -</box> -</pre> - -<p>Wenn Sie nun das Fenster vergrößern, wird die Box auf die Fenstergröße ausgedehnt. Die Schaltflächen sind nicht flexibel, sie werden also nicht ihre Breiten ändern. Das Ergebnis ist zusätzlicher Platz, der auf der rechten Seite der Fensters (innerhalb der Box) erscheint. Sie möchten aber unter Umständen, dass dieser freie Platz auf der linken Seite erscheint, sodass die Schaltflächen auf der rechten Seite des Fensters ausgerichtet werden.</p> - -<p>Sie könnten das lösen, in dem Sie ein <code><code><a href="/de/docs/Mozilla/Tech/XUL/spacer" title="spacer">spacer</a></code></code> Element innerhalb der Box platzieren, aber das wird umständlich, wenn Sie es für eine Vielzahl von Elementen machen müssen. Ein besserer Weg ist, ein zusätzliches Attribut <code><code id="a-pack"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/pack">pack</a></code></code> dem <code><code><a href="/de/docs/Mozilla/Tech/XUL/box" title="box">box</a></code> Element hinzuzufügen</code>. Dieses Attribut gibt an, wie die Kindelemente innerhalb der Box angeordnet werden sollen. Für horizontal orientierte Boxen wird die horizontale Position der Kindelemente gesteuert. Für vertikal orientierte Boxen wird die die vertikale Position der Kindelemente gesteuert. Es können die folgenden Werte verwendet werden:</p> - -<dl> - <dt>start</dt> - <dd>Positioniert Elemente an der linken Seite für horizontale Boxen und an der oberen Seite für vertikale Boxen. Dies ist der Standardwert.</dd> - <dt>center</dt> - <dd>Zentriert Kindelemente in der Box.</dd> - <dt>end</dt> - <dd>Positioniert Elemente an der rechten Seite für horizontale Boxen und an der unteren Seite für vertikale Boxen.</dd> -</dl> - -<p>Das <code><code id="a-pack"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/pack">pack</a></code></code> Attribut wird in der Box festgelegt, die die auszurichteten Elemente enthält, nicht in den Elementen selbst.</p> - -<p>Wir können das vorherige Beispiel ändern, sodass die Elemente wie folgt zentriert werden:</p> - -<p><span id="Beispiel_4"><a id="Beispiel_4"></a><strong>Beispiel 4</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_4.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_4.xul">Ansehen</a></p> - -<pre><box flex="1" pack="center"> - <button label="Happy"/> - <button label="Sad"/> -</box> -</pre> - -<p>Jetzt, wenn das Fenster verändert wurde, werden die Schaltflächen horizontal zentriert. Vergleichen Sie das Verhalten zum vorherigen Beispiel.</p> - -<h2 id="Box_Ausrichtung">Box Ausrichtung</h2> - -<p>Wenn das Fenster im Happy-Sad Beispiel oben horizontal verändern, wird die Box in der Breite wachsen. Wenn Sie das Fenster vertikal verändern, werden jedoch die Schaltflächen in ihrer Höhe mitwachsen. Das kommt daher weil, die Flexibilität standardmäßig für die vertikale Richtung aktiviert ist.</p> - -<p>Dieses Verhalten kann mit dem <code><code id="a-align"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/align">align</a></code></code> Attribut gesteuert werden. Für horizontale Boxen werden die vertikalen Positionen der kindelemente gesteuert. Für vertikale Boxen werden die horizontalen Positionen der Kindelemente gesteuert. Die möglichen Werte sind ähnlich zu denen de<code><span style="font-family: Verdana,Tahoma,sans-serif;">s {</span>{XULAttr("pack")}}</code> Attributs.</p> - -<dl> - <dt>start</dt> - <dd>Richtet Elemente an der oberen Seite für horizontal Boxen und an der linken Seite für vertikale Boxen aus.</dd> - <dt>center</dt> - <dd>Zentriert Kindelemente in der Box.</dd> - <dt>end</dt> - <dd>Richtet Elemente an der unteren Seite für horizontale Boxen und an der rechten Seite für vertikale Boxen aus.</dd> - <dt>baseline</dt> - <dd>Richtet Elemente an der Textlinie aus. Nur für horizontale Boxen sinnvoll.</dd> - <dt>stretch</dt> - <dd>Standardwert. Sorgt dafür, dass die Elemente auf die Größe der Box ausgedehnt werden, wie ein flexibles Element nur in die andere Richtung.</dd> -</dl> - -<p>Im Gegensatz zum <code><code id="a-pack"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/pack">pack</a></code></code> Attribut, wird das <code><code id="a-align"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/align">align</a></code></code> Attribut auf die beinhalteten Elemente der Box angewendet, nicht auf das Element selbst.</p> - -<p>Zum Beispiel, die erste Box unten wird die Kindelemente ausdehnen, weil das die Standardeinstellung ist. Die zweite Box hat ein <code><code id="a-align"><a href="https://developer.mozilla.org/de/docs/Mozilla/Tech/XUL/Attribute/align">align</a></code></code> Attribut, seine Kindelemente werden also zentriert platziert.</p> - -<p><span id="Beispiel_5"><a id="Beispiel_5"></a><strong>Beispiel 5</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_5.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_5.xul">Ansehen</a></p> - -<pre><?xml version="1.0"?> -<?xml-stylesheet href="chrome://global/skin/" type="text/css"?> - -<window id="yesno" title="Question" orient="horizontal" - xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"> - - <hbox> - <button label="Yes"/> - <button label="No"/> - </hbox> - <hbox align="center"> - <button label="Maybe"/> - <button label="Perhaps"/> - </hbox> - -</window> -</pre> - -<div class="float-right"><img alt="Image:boxstyle2-b.png" class="internal" src="/@api/deki/files/572/=Boxstyle2-b.png"></div> - -<p>Es können auch die CSS Eigenschaften: <code><a href="/de/CSS/-moz-box-pack" title="de/CSS/-moz-box-pack">-moz-box-pack</a></code> und <code><a href="/de/CSS/-moz-box-align" title="de/CSS/-moz-box-align">-moz-box-align</a></code> anstatt von Attributen verwendet werden.</p> - -<div class="note">Vielleicht finden Sie auch das <a class="external" href="http://developer.mozilla.org/samples/xultu/examples/aligner.xul">Ausrichtungsbeispiel</a> hilfreich, um die verschiedenen Eigenschaften auszuprobieren.</div> - -<h2 id="Text_und_Schaltflächen_abschneiden">Text und Schaltflächen abschneiden</h2> - -<p>Sie können eine Schaltfläche erstellen, die eine Beschriftung hat, die länger als die maximale Breite der Schaltfläche ist. Eine Lösung wäre sicher die Breite zu erhöhen, jedoch verfügen Schaltflächen (und andere Elemente mit einer Beschriftung) über ein spezielles Attribut. Das Attribut <code>"crop"</code> erlaubt Ihnen wie ein Text abgeschnitten wird, wenn dieser zu lang ist.</p> - -<p>Wenn der Text abgeschnitten wird, wird ein Auslassungszeichen (...) dort eingefügt, wo der Text ausgeschnitten wurde. Vier mögliche Werte sind dazu gültig:</p> - -<dl> - <dt>left</dt> - <dd>Der Text wird auf der linken Seite abgeschnitten.</dd> - <dt>right</dt> - <dd>Der Text wird auf der rechten Seite abgeschnitten.</dd> - <dt>center</dt> - <dd>Der Text wird in der Mitte abgeschnitten.</dd> - <dt>none</dt> - <dd>Der Text wird nicht abgeschnitten. Das ist das Standardverhalten.</dd> -</dl> - -<p>Dieses Attribut ist wirklich nur dann sinnvoll, wenn ein Dialog so entworfen wurde, dass er verwendbar in jeder Große sein soll. Das <code>crop</code> Attribut kann auch bei anderen Elementen verwendet werden, die ein <code><span style="font-family: Verdana,Tahoma,sans-serif;">l</span>abel</code> Attribut für Beschriftungen verwenden. Das folgende Beispiel zeigt das Attribut in Aktion:</p> - -<p><span id="Beispiel_6"><a id="Beispiel_6"></a><strong>Beispiel 6</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_6.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/ex_boxstyle_6.xul">Ansehen</a></p> - -<div class="float-right"><img alt="Image:boxstyle2.png" class="internal" src="/@api/deki/files/573/=Boxstyle2.png"></div> - -<pre><button label="Push Me Please!" crop="right" flex="1"/> -</pre> - -<p>Beachten Sie, wie der Text der Schaltfläche auf der rechten Seiten abgeschnitten wird, wenn das Fenster verkleinert wird.</p> - -<div class="highlight"> -<p><span id="Aktueller_Dateisuche-Dialog"><a id="Aktueller_Dateisuche-Dialog"></a><strong>Aktueller Dateisuche-Dialog</strong></span>: <a href="https://developer.mozilla.org/samples/xultu/examples/findfile/findfile-boxstyle.xul.txt">Datei</a> <a href="https://developer.mozilla.org/samples/xultu/examples/findfile/findfile-boxstyle.xul">Ansehen</a></p> -</div> - -<p>Als nächstes eine Zusammenfassung und einige <a href="/de/XUL_Tutorial/Details_zum_Box-Modell" title="de/XUL Tutorial/Details zum Box-Modell">zusätzliche Details zum Box-Modell</a>.</p> - -<div class="prevnext" style="text-align: right;"> - <p><a href="/de/docs/XUL_Tutorial/Das_Box-Modell" style="float: left;">« zurück</a><a href="/de/docs/XUL_Tutorial/Details_zum_Box-Modell">weiter »</a></p> -</div> diff --git a/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html b/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html deleted file mode 100644 index 2469697a21..0000000000 --- a/files/de/archive/mozilla/xul/xul_tutorial/xul_struktur/index.html +++ /dev/null @@ -1,154 +0,0 @@ ---- -title: XUL Struktur -slug: Archive/Mozilla/XUL/XUL_Tutorial/XUL_Struktur -tags: - - XUL - - XUL Tutorial -translation_of: Archive/Mozilla/XUL/Tutorial/XUL_Structure ---- -<p>{{ PreviousNext("XUL_Tutorial/Einfuehrung", "XUL_Tutorial/Die_Chrome_URL") }}</p> - -<p>Wir werden mit einem Blick auf die Handhabung von XUL in Mozilla starten.</p> - -<h3 id="Wie_wird_XUL_behandelt">Wie wird XUL behandelt</h3> - -<p>In Mozilla wird XUL genauso behandelt wie HTML oder anderer Inhalt. Wenn man die URL einer HTML-Seite in das Adressfeld des Browsers eingibt, ortet der Browser die Webseite und lädt den Inhalt herunter. Die Mozilla Rendering-Engine übersetzt den HTML-Quelltext in ein Dokumentbaum mit <a href="/de/DOM" title="de/DOM">DOM</a>. Anschließend wird der Baum in ein Satz Objekte konvertiert, die am Bildschirm angezeigt werden können. <a href="/de/CSS" title="de/CSS">CSS</a>, Bilder und andere Technologien werden verwendet, um die Anzeige zu kontrollieren. XUL funktioniert größtenteils auf die selbe Art und Weise.</p> - -<p>In der Tat werden alle Dokumenttypen, egal ob HTML, XUL oder sogar <a href="/de/SVG" title="de/SVG">SVG</a>, durch den selben zugrunde liegenden Code behandelt. Das bedeutet, dass die selben CSS-Eigenschaften benutzt werden können, um sowohl HTML und XUL zu manipulieren. Daher können viele Funktionen von beiden genutzt werden. Doch gibt es einige Funktionen, welche nur von HTML verwendet werden können, wie z.B. Formulare, und andere, welche nur von XUL verwendet werden können, so wie <a href="/de/XUL_Tutorial/Overlays" title="de/XUL_Tutorial/Overlays">Overlays</a>. Da XUL und HTML auf die selbe Art und Weise behandelt werden, kann man beide, sowohl vom lokalen Dateisystem, von einer Webseite oder von einer Erweiterung oder einer selbständigen <a href="/de/XULRunner" title="de/XULRunner">XULRunner</a>-Anwendung laden.</p> - -<p>Inhalte aus entfernten Quellen z.B. <code><span class="nowiki">http://localhost/~username/</span></code> sind (egal ob HTML, XUL oder ein anderer Dokumententyp) aus Sicherheitsgründen in ihrem Handlungsspielraum beschränkt. Deshalb stellt Mozilla die Methode zur Verfügung, Inhalte lokal zu installieren und registriert die installierten Dateien in sein <strong><a href="/de/Chrome" title="de/Chrome">chrome</a></strong>-System. Dies ermöglicht, dass eine spezielle URL-Form genutzt werden kann, die <code>chrome://</code> URL genannt wird. Durch den Zugriff auf eine Datei mittels einer Chrome-URL erhält die Datei höhere Rechte, um auf lokale Dateien, Eigenschaften und Bookmarks zuzugreifen und andere privilegierte Operationen auszuführen. Webseiten erhalten diese Privilegien nicht, es sei denn sie sind mit einem digitalen Zertifikat signiert, und der Benutzer hat den Zugriff auf diese Operationen gewährt.</p> - -<p>Die <strong>chrome</strong>-Paketregistrierung ist der Weg, um es Firefox-Erweiterungen zu ermöglichen, Funktionen zum Browser hinzuzufügen. Erweiterungen sind kleine Pakete mit XUL-Dateien, JavaScript, Stylesheets und Bildern, die in einer einzigen Datei verpackt sind. Eine solche Datei kann mit einem ZIP-Programm erstellt werden. Wenn der Benutzer diese Datei herunterlädt, wird die Erweiterung auf seiner Maschine installiert. Sie hängt sich in den Browser ein, indem sie eine XUL-Eigenschaft benutzt, die man Overlay nennt. Sie erlaubt es, das XUL der Erweiterung mit dem XUL des Browsers zu kombinieren. Für den Benutzer scheint es, als ob die Erweiterung den Browser <em>verändert</em> hat, aber in Wirklichkeit ist der Quelltext separat und die Erweiterung kann leicht entfernt werden. Registrierte Pakete müssen natürlich nicht unbedingt Overlays benutzen. Wenn sie keinen Gebrauch von Overlays machen, ist die Erweiterung nicht von der Browser-Oberfläche aus erreichbar, aber man kann sie über die Chrome-URL erreichen, sofern das erwünscht ist.</p> - -<p>Eigenständige XUL-Anwendungen können XUL-Code auf ähnliche Weise enthalten, er wird aber natürlich als Teil der Installation eingebunden, anstatt separat als Erweiterung eingebettet zu werden. Dennoch wird der XUL-Code im chrome-System registriert, sodass die Applikation die Benutzeroberfläche darstellen kann.</p> - -<p>Der Mozilla Browser selbst ist ebenfalls nichts weiter als eine Sammlung von Paketen, die XUL-Dateien, JavaScript und Stylesheets enthalten. Diese Dateien können über die chrome URL erreicht werden, haben erweiterte Privilegien und verhalten sich auch sonst wie andere Pakete. Natürlich ist der Browser weitaus größer und komplexer als die meisten Erweiterungen. Firefox und Thunderbird und einige andere Komponenten sind alle in XUL geschrieben und erreichbar über chrome-URLs. Sie können diese Pakete erkunden, indem Sie die Dateien in dem chrome-Verzeichnis ansehen, wo Firefox oder die anderen XUL-Anwendungen installiert sind.</p> - -<p>Die chrome-URL beginnt immer mit 'chrome://'. Ähnlich wie eine <span class="nowiki">'http://'-</span>URL immer eine entfernte Website per HTTP adressiert und die 'file://'-URL immer lokale Dateien, referenziert die 'chrome://'-URL immer installierte Pakete und Erweiterungen. Wir werden uns die chrome-Syntax im nächsten Kapitel genauer ansehen. Es ist wichtig zu wissen, dass der Zugriff über eine chrome-URL erweiterte Privilegien gegenüber den anderen Arten von URLs erlangt. Beispielsweise hat eine HTTP-URL keine besonderen Rechte und es wird ein Fehler ausgegeben, wenn eine Website versucht, zum Beispiel lokale Dateien zu lesen. Wird hingegen eine Datei von einer chrome-URL aus geladen, hat sie das Recht, lokale Dateien ohne Einschränkungen zu lesen.</p> - -<p>Diese Unterscheidung ist wichtig. Es bedeutet, dass Websites bestimmte Dinge nicht tun können, wie zum Beispiel die Lesezeichen des Benutzers zu lesen. Diese Unterscheidung basiert nicht auf dem Inhalt, sondern nur auf der URL, die benutzt wird. Sowohl HTML als auch XUL auf einer Website haben keine erweiterten Rechte, wohingegen XUL und HTML, die mit einer chrome-URL geladen wurden, erweiterte Privilegien haben.</p> - -<p>Wenn Sie XUL auf einer Website benutzen möchten, müssen Sie nur die XUL-Dateien auf die Website stellen, genau so, wie Sie es auch mit HTML-Dateien tun. Laden Sie dann die URL in den Browser: <small><span class="nowiki">http://localhost/xul.php</span></small>. Vergewissern Sie sich, dass Ihr Webserver so konfiguriert ist, dass er XUL-Dateien mit dem passenden Content-Type <strong><code>application/vnd.mozilla.xul+xml</code></strong> ausliefert. (zum Beispiel mittels PHP: <code>header('content-type: application/vnd.mozilla.xul+xml');</code>). Der Content-Type stellt sicher, dass Mozilla HTML und XUL unterscheiden kann. Mozilla nutzt die Dateierweiterung nur, solange die Datei vom Dateisystem gelesen wird. Sie sollten trotzdem die <code>.xul</code>-Dateiendung für all Ihre XUL-Dateien benutzen. Sie können XUL-Dateien in Ihren Browser laden, indem Sie sie mit dem Browser öffnen oder im Datei-Manager die Datei doppelklicken.</p> - -<div class="note">Denken Sie daran, dass entfernte XUL-Dateien bedeutende Einschränkungen haben.</div> - -<h4 id="sect1"> </h4> - -<h4 id="Dokumenttypen_HTML_XML_XUL_CSS">Dokumenttypen: HTML XML XUL CSS</h4> - -<p>Mozilla verwendet deutlich unterschiedliche Arten des Dokumentenobjektmodells (<a href="/de/DOM" title="de/DOM">DOM</a>) für HTML und XUL, obwohl viele der Funktionen gemeinsam verwendet werden. Es gibt drei hauptsächliche Dokumententypen in Mozilla: HTML, XML und XUL. Natürlich wird HTML für HTML-Dokumente genutzt, XUL für XUL-Dokumente und XML für andere XML-Dokumenttypen. Da XUL ebenfalls XML ist, ist das XUL-Dokument als eine Unterart des XML-Dokumentes zu verstehen. Es gibt feine Unterschiede in der Funktionsweise. Zum Beispiel sind die Formularsteuerungen auf einer HTML-Seite über die <code>document.forms</code>-Eigenschaft erreichbar, während diese nicht für XUL-Dokumente verfügbar ist, weil XUL keine Formulare im Sinne von HTML haben. Andererseits sind spezielle XUL-Funktionen (wie Overlays und Templates) nur in XUL-Dokumenten verfügbar.</p> - -<p>Diese Unterscheidung zwischen den Dokumenten ist wichtig. Es ist möglich viele XUL-Funktionen in HTML oder XML-Dokumenten zu verwenden, sofern sie nicht spezifisch für den jeweiligen Dokumententyp sind. Andere Funktionen erfordern jedoch den richtigen Dokumententyp. Daher können Sie zum Beispiel XUL-Layouts in anderen Dokumenten verwenden, da diese nicht vom XUL-Dokumententyp abhängig sind.</p> - -<p>Um die oben genannten Punkte zusammenfassen:</p> - -<ul> - <li>Mozilla rendert sowohl <a href="/de/HTML" title="de/HTML">HTML</a> als auch <a href="/de/XUL" title="de/XUL">XUL</a> mit der gleichen zugrunde liegenden Engine und verwendet <a href="/de/CSS" title="de/CSS">CSS</a>, um das Aussehen festzulegen.</li> - <li>XUL kann von einer entfernten Seite, vom lokalen Dateisystem oder als Paket installiert und über eine <a href="/de/Chrome" title="de/Chrome">chrome</a>-URL erreicht werden. Von der letzten Möglichkeit machen Erweiterungen gebrauch.</li> - <li>Chrome-URLs können verwendet werden, um auf installierte Pakete zuzugreifen und sie mit erweiterten Privilegien zu öffnen.</li> - <li>HTML, XML und XUL haben alle einen unterschiedlichen Dokumententyp. Einige Funktionen können in jedem Dokumententyp verwendet werden, während andere einen bestimmten Typ erfordern.</li> -</ul> - -<p>Die nächsten Abschnitte beschreiben die grundlegende Struktur eines Chrome-Pakets, welches in Mozilla installiert werden kann. Wenn Sie jedoch beginnen wollen eine einfache Anwendung zu schreiben, sollten Sie zu "<a href="/de/XUL_Tutorial/Ein_Fenster_erzeugen" title="de/XUL Tutorial/Ein Fenster erzeugen">Ein Fenster erzeugen</a>" springen und zu diesem Abschnitt später zurück kommen.</p> - -<h3 id="Paketorganisation">Paketorganisation</h3> - -<p>Mozilla ist so organisiert, sodass Sie so viele Komponenten wie Sie möchten, vorinstallieren können. Jede Erweiterung ist eine eigenständige Komponente mit einer separaten Chrome-URL. Mozilla verfügt außerdem über je eine Komponente für jedes installierte Theme und Sprachpaket. Jedes dieser Komponenten oder Pakete besteht aus einer Reihe von Dateien, welche die Benutzeroberfläche dafür beschreiben. Die Messenger-Komponente besitzt z.B. Beschreibungen für Fenster von Mailnachrichten oder Adressbuchdialogen.</p> - -<p>Die Pakete, die mit Mozilla ausgeliefert werden, befinden sich im Chrome-Verzeichnis, welches das Verzeichnis ist, wo Sie Mozilla installiert haben. Das Chrome-Verzeichnis ist das, wo Sie alle Dateien, die die Benutzeroberfläche beschreiben, finden. Normalerweise packen Sie alle XUL-Dateien für eine Anwendung in dieses Verzeichnis, obwohl Erweiterungen in das Erweiterungsverzeichnis für einen bestimmten Benutzer installiert werden. Das einfache Kopieren einer XUL-Datei in das <code>chrome-</code>Verzeichnis gibt der Datei noch keine erweiterten Rechte und außerdem kann sie nicht über eine chrome-URL aufgerufen werden. Um diese zusätzlichen Privilegien zu bekommen, müssen Sie eine Manifestdatei erstellen und diese in das Chrome-Verzeichnis packen. Diese Datei ist sehr einfach zu erstellen und ist normalerweise nur ein paar Zeilen lang. Diese Datei wird verwendet, um chrome-URLs auf eine Datei oder einen Verzeichnispfad zu binden, wo sich die XUL-Dateien befinden. Details zur Erstellung dieser Datei werden in einem <a href="/de/XUL_Tutorial/Manifest_Dateien" title="de/XUL Tutorial/Manifest Dateien">späteren Abschnitt</a> genauer betrachtet.</p> - -<p>Der einzige Weg Inhalte zu erstellen, die über eine Chrome-Url erreichbar sind, ist, ein Paket wie in nächsten Abschnitten beschrieben, zu erstellen. Das Verzeichnis wird 'chrome' genannt, weil es ein geeigneter Name zur Aufbewahrung von Chrome-Paketen ist, welche in Mozilla enthalten sind.</p> - -<p>Um die Verwirrung noch weiter zu treiben, gibt es noch zwei weitere Orte, wo das Wort "chrome" auftreten könnte. Das ist einmal das <code>-chrome-</code>Kommandozeilenargument und zum anderen der <code>chrome</code>-Modifier der <code><a href="https://developer.mozilla.org/en/DOM/window.open">window.open()</a>-</code>Funktion. Keine dieser Funktionen verteilen zusätzliche Privilegien, stattdessen werden sie verwendet, um ein neues Top-Level-Fenster ohne das Browser UI (Toolbars, Menü) zu erstellen. Sie werden diese Funktion sicher noch in komplexeren XUL Anwendungen verwenden, wenn Sie nicht das Browser UI um Ihre Dialogboxen herum haben wollen.</p> - -<p>Dateien eines Pakets werden normalerweise in einzelne JAR-Dateien zusammengefügt. Eine JAR-Datei kann mit einem ZIP-Tool erstellt werden. Beispielsweise können Sie JAR-Dateien in Mozilla's <code>chrome-</code>Verzeichnis öffnen, um die grundlegende Struktur des Pakets zu sehen. Obwohl es normal so ist, dass die Dateien in einer JAR-Datei gepackt sind, können Pakete genauso von einem normalen Verzeichnis erreicht werden. Obwohl Pakete normalerweise nicht auf diese Art ausgeliefert werden, ist es dennoch während der Entwicklung handlicher, die Dateien vorerst nicht zu packen, da Sie diese dann besser bearbeiten können ohne die Dateien jedes Mal neu zu packen zu müssen.</p> - -<p>Standardmäßig parsen Mozilla-Applikationen XUL-Dateien und Skripte und speichern eine vor-kompilierte Version im Speicher im Laufe der Anwendungssitzung. Das verbessert die Leistung. Dadurch wird XUL allerdings nicht neu geladen, auch nicht, wenn die Quelldateien sich geändert haben. Um diesen Mechanismus zu deaktivieren, ist es notwendig die Einstellung <code>nglayout.debug.disable_xul_cache</code> festzulegen. In Firefox muss diese Einstellung unter Umständen hinzugefügt werden, indem "about:config" in die Adresszeile eingegeben wird und dieser Wert auf "true" gesetzt wird. Oder Sie verändern die <code>user.js</code>-Einstellungsdatei manuell und fügen die folgende Zeile hinzu:</p> - -<pre class="eval">pref("nglayout.debug.disable_xul_cache", true); -</pre> - -<p>Es gibt normalerweise drei verschiedene Teile eines chrome-Pakets, auch wenn sie alle optional sind. Jeder Teil wird in einem anderen Verzeichnis gespeichert. Diese drei Sets sind content, skin und locale, welche unten näher beschrieben sind. Ein bestimmtes Paket kann ein oder mehrere Skins und Sprachen bereitstellen und der Benutzer kann diese mit den eigenen ersetzen. Zusätzlich kann das Paket mehrere unterschiedliche Anwendungen enthalten, jedes davon über eine andere chrome-URL erreichbar. Das Paketsystem ist flexibel genug, um separate Downloads von anderen Teilen wie zum Beispiel andere Sprachen, handzuhaben.</p> - -<p>Die drei Typen der Chrome-Pakete sind:</p> - -<ul> - <li><strong>Content</strong> - Fenster und Skripte<br> - Beinhaltet Festlegungen zu Fenstern und der Benutzeroberfläche. Diese sind in XUL-Dateien gespeichert, welche eine <code>.xul</code>-Endung haben. Ein content-Paket kann mehrere XUL-Dateien besitzen, aber das Hauptfenster sollte den gleichen Dateinamen haben, wie die Anwendung selbst. Beispielsweise sollte ein "Editor"-Paket die Datei <code>editor.xul</code> haben. Skripte werden in separaten Dateien neben den XUL-Dateien platziert.</li> - <li><strong>Skin</strong> - Style Sheets, Bilder und andere Dateien zum Aussehen<br> - Style Sheets beschreiben Details zum Erscheinungsbild eines Fensters. Sie werden separat von den XUL-Dateien gespeichert, um Änderungen am Aussehen einfacher verwalten zu können. Etwaige Bilder werden hier ebenfalls gespeichert.</li> - <li><strong>Locale</strong> - Dateien zum Text und zur Sprache<br> - Der gesamte Text, welcher in der Anwendung angezeigt wird, wird hier gespeichert. Dadurch wird ermöglicht, dass der Benutzer eine eigene Sprache für das Paket bereitstellen kann.</li> -</ul> - -<h3 id="Content_Pakete">Content Pakete</h3> - -<p>Der Name der JAR-Datei kann beschreiben, was sich darin befindet, aber Sie können nur sicher gehen, wenn Sie sich die Inhalte wirklich anschauen. Verwenden wir das Browserpaket, welches in Firefox enthalten ist als Beispiel. Wenn Sie Dateien in <code>browser.jar</code> entpacken, werden Sie die folgende Verzeichnisstruktur auffinden:</p> - -<pre>content - browser - browser.xul - browser.js - -- weitere XUL und JS-Dateien -- - bookmarks - -- Bookmarks-Dateien -- - preferences - -- Einstellungsdateien -- -. -. -. -</pre> - -<p>Das lässt einfach als ein 'content'-Paket identifizieren, weil das oberste Verzeichnis "content" genannt wurde. Für Skins wird dieses Verzeichnis normalerweise "<code>skin"</code> und für Sprachen wird es normalerweise "<code>locale"</code> genannt. Dieses Benennungsschema ist nicht notwendig, aber es ist eine gute Konvention, um die Teile des Pakets klar trennen zu können. Einige Pakete können unter Umstand ein Abschnitt für content, skin sowie locale besitzen. In diesem Fall werden Sie ein Unterverzeichnis für jeden Typ finden. Chatzilla wird zum Beispiel auf diesem Weg ausgeliefert.</p> - -<p>Das "<code>content/browser</code>"-Verzeichnis enthält eine Vielzahl an Dateien mit der Endung <code>.xul</code> und <code>.js</code>. Die XUL-Dateien sind die mit der<code> .xul</code>-Endung. Die Dateien mit der <code>.js</code>-Endung sind JavaScript-Dateien, welche Skripte enthalten, die die Funktionen eines Fenstern steuern. Viele XUL-Dateien haben eine zugehörige JavaScript-Datei und einige haben sogar mehr als eine.</p> - -<p>In der Verzeichnisauflistung oben werden zwei Dateien genannt. Es gibt natürlich noch weitere, aber zur Einfachheit wurde diese ausgelassen. Die Datei <code>browser.xul</code> ist die XUL-Datei, die das Hauptfenster beschreibt. Das Hauptfenster für ein "content"-Paket sollte den selben Namen wie das Paket haben, mit der Endung <code>.xul</code>. In diesem Fall ist der Paketname "browser" also erwarten wir die Datei <code>browser.xul</code>. Einige der anderen XUL-Dateien beschreiben weitere Fenster. Die Datei <code>pageInfo.xul</code> beschreibt zum Beispiel den Seiteninformationsdialog.</p> - -<p>Viele Pakete werden eine <code>contents.rdf</code> Datei enthalten, welches das Paket beschreibt, den Autor und die Overlays, die verwendet werden. Diese Datei ist jedoch veraltet und wurde durch ein einfacheres Verfahren ersetzt. Die neue Methode ist die sogenannte Manifestdatei, die bereits erwähnt wurde. Diese Dateien finden Sie mit der Endung <code>.manifest</code> im Chrome-Verzeichnis. Die Datei <code>browser.manifest</code> beschreibt beispielsweise das Browser-Paket.</p> - -<p>Mehrere Unterverzeichnisse wie "<code>bookmarks</code>" und "<code>preferences</code>" sind zusätzliche Bereiche der Browser-Komponente. Sie werden nur in unterschiedlichen Ordnern aufbewahrt, um die Dateien besser organisieren zu können.</p> - -<h3 id="Skins_oder_Themes">Skins oder Themes</h3> - -<p>Obwohl der zugrunde liegende Code für Mozilla sie Skins nennt und die Benutzeroberfläche den Ausdruck "Themes" gebraucht, meinen beide die gleiche Sache. Die <code>classic.jar</code>-Datei beschreibt das Standard-Theme von Firefox. Die Struktur ist ähnlich zum content-Paket. Zum Beispiel <code>classic.jar</code>:</p> - -<pre>skin - classic - browser - browser.css - -- weitere browser Skin-Dateien -- - global - -- globale Skin-Dateien -- -. -. -. -</pre> - -<p>Auch hier ist die Verzeichnisstruktur nicht notwendig und wird zur besseren Organisation verwendet. Sie können sogar alle Dateien in ein Verzeichnis packen. Für große Anwendungen werden Unterverzeichnisse verwendet, um verschiedene Komponenten zu trennen. Im obigen Beispiel existiert ein Verzeichnis für Theme-bezogene Dateien des Browsers und ein Ordner für globale Theme-bezogene Dateien. Das "global"-Verzeichnis enthält Skin-Dateien, die allgemein für alle Pakete zu gebrauchen sind. Die Dateien sind für alle Komponenten angelegt und werden mit ihrer eigenständigen Anwendung eingebunden. Der globale Teil definiert den Teil der gemeinsamen XUL-Widgets, wohingegen die anderen Verzeichnisse Dateien enthalten, die speziell für die entsprechenden Anwendungen sind. Firefox bindet beide, die globalen und die Browser Theme-Dateien in einem Archiv ein, aber sie können auch einzeln eingebunden werden.</p> - -<p>Ein Skin besteht aus CSS-Dateien und einer Reihe von Bildern, die das Aussehen des Interface definieren. Die Datei <code>browser.css</code> wird von <code>browser.xul</code> verwendet und enthält Styles, welche das Aussehen unterschiedlicher Teile der Anwendung beschreiben. Beachten Sie hier wieder, dass die Datei <code>browser.css</code> den gleichen Dateinamen wie das Paket besitzt. Beim Verändern von CSS-Dateien, stellen Sie das Aussehen eines Fensters ein, ohne dabei die Funktionen zu beeinflussen. Auf diese Weise können Sie ein neues Theme erstellen. Der XUL-Teil bleibt der Gleiche, aber der Skin-Teil wird unabhängig verändert.</p> - -<h3 id="Lokalisierung">Lokalisierung</h3> - -<p>Die Datei "<code>en-US.jar</code>" beschreibt die Sprachinformationen für jede Komponente, in diesem Fall für US-Englisch. Wie bei den Skins, enthält jede Sprachdatei Dateien, welche den Text für das Paket in der jeweiligen Sprache festlegen. Die Struktur von "locale" ist ähnlich zu den anderen, wir werden das hier nicht noch einmal auflisten.</p> - -<p>Der lokalisierte Text wird in zwei verschiedenen Dateitypen gespeichert: DTD-Dateien und properties-Dateien. Die DTD Dateien haben die Endung <code>.dtd</code> und enthalten Entity-Deklarationen, eine für jeden Textstring, welcher in einem Fenster verwendet wird. Die Datei <code>browser.dtd</code> enthält zum Beispiel Entity-Deklarationen für jedes Menü-Kommando. Zusätzlich werden Tastaturkürzel für jedes Kommando definiert, weil Sie eventuell unterschiedlich in verschiedenen Sprachen sein können. DTD-Dateien werden von XUL Dateien benutzt, meist werden Sie eine Datei pro XUL Datei finden. Der "locale" Teil beinhaltet auch "properties" Dateien, welche ähnlich sind, aber von Skriptdateien verwendet werden. Die Datei <code>browser.properties</code> enthält einige solcher lokalisierter Strings.</p> - -<p>Diese Struktur erlaubt Ihnen Mozilla oder eine Komponente in verschiedene Sprachen zu übersetzen, in dem einfach ein neues "locale"-Verzeichnis hinzugefügt wird. Sie müssen den XUL-Code gar nicht verändern. Weiter kann eine andere Person ein anderes Paket hinzufügen, welches Unterstützung für eine neue Sprache bietet, ohne dass Ihr Originalpaket verändert wird.</p> - -<h3 id="Weitere_Pakete">Weitere Pakete</h3> - -<p>Es gibt ein spezielles Paket, welches "Toolkit" (oder "global") genannt wird. Wir haben uns das "global"-Verzeichnis für Skins angeschaut. Die Datei <code>toolkit.jar</code> enthält den zugehörigen "content"-Teil dazu. Es sind einige globale Dialoge und Definitionen darunter. Es wird auch das Standardaussehen und die Standardfunktionen der XUL-Widgets, wie Textboxen und Schaltflächen festgelegt. Diese Datei im globalen Teil eines Skin-Verzeichnisses enthalten das Standardaussehen für alle XUL Interface-Elemente. Das Toolkit-Paket wird von allen XUL-Applikationen verwendet.</p> - -<h3 id="Ein_Paket_hinzufügen">Ein Paket hinzufügen</h3> - -<p>Mozilla platziert die Pakete, die mit der Installation eingebunden werden, in das Chrome-Verzeichnis. Diese Dateien müssen dort jedoch nicht platziert werden. Wenn ein anderes Paket installiert wird, können Sie dies überall auf der Festplatte platzieren, so lange eine Manifestdatei darauf zielt. Es ergibt Sinn Pakete in das Chrome-Verzeichnis zu packen, einfach weil es bequemer ist. Jedoch funktionieren die Pakete genauso gut, wenn sie woanders liegen. Sie können die Dateien jedoch nicht auf einer entfernten Seite speichern, da die entfernte Seite nicht durch das lokale Dateisystem gemountet ist.</p> - -<p>Es gibt zwei <code>chrome</code>-Verzeichnisse für XUL-Applikationen: Eine ist dort installiert, wo auch die Anwendung installiert wurde, während die andere Teil des Benutzerprofils ist. Das erste Verzeichnis erlaubt Paketen über alle Benutzer zu agieren, während das zweite Verzeichnis nur für den jeweiligen Benutzer erstellt worden ist. Erweiterungen werden in einem separaten Erweiterungsverzeichnis installiert und sind außerdem Benutzer-spezifisch. Jede Manifestdatei in einem der Chrome-Verzeichnissen wird geprüft, um zu sehen, welche Pakete installiert sind.</p> - -<p>Im nächsten Abschnitt werden wir einen Blick darauf werfen, wie man die Chrome-URL verwendet, um sich auf Chrome-Pakete zu beziehen.</p> - -<p>{{ PreviousNext("XUL_Tutorial/Einfuehrung", "XUL_Tutorial/Die_Chrome_URL") }}</p> - -<p>{{ languages( { "en": "en/XUL_Tutorial/XUL_Structure", "es": "es/Tutorial_de_XUL/Estructura_XUL", "ja": "ja/XUL_Tutorial/XUL_Structure", "pl": "pl/Kurs_XUL/Struktura_XUL","fr": "fr/Tutoriel_XUL/La_structure_XUL" } ) }}</p> |