Press "Enter" to skip to content

Interface-Dateien übersetzen

Die Übersetzung in verschiedene Sprachen spielt in der App-Entwicklung eine wichtige Rolle. Das kann mitunter sehr aufwendig werden, wenn man viele Interfaces in XIB-Dateien oder Storyboards gestaltet und dort Labels und Schaltflächen untergebracht werden, die allesamt übersetzt werden müssen. Eine Möglichkeit wäre, für all diese View-Elemente passende Outlets im Code zu erzeugen (falls nicht bereits aufgrund anderer Voraussetzungen geschehen), um dann in der Implementierung der zugrundeliegenden Klassen die passende Übersetzung mittels NSLocalizedString vorzunehmen. Es geht aber auch deutlich einfacher.

Base Internationalization

Auf Basis der sogenannten Base Internationalization erlaubt es Xcode, Interface-Dateien direkt in der Development Language eines Projekts zu übersetzen. Das bedeutet, dass alle Strings und Texte bereits im Interface in der Development Language umgesetzt werden.

Für alle weiteren Sprachen, die eine App unterstützt, erstellt man dann im nächsten Schritt eine passende STRINGS-Datei. Die enthält die Übersetzungen des Interfaces und ist direkt mit der zugehörigen Interface-Datei gekoppelt.

Beispielprojekt

Betrachten wir das einmal anhand eines kleinen und sehr einfachen Beispiels. Es handelt sich dabei um eine iOS-App, deren initialer View-Controller in der Main.storyboard-Datei über ein Label verfügt. Dieses Label soll im Englischen den Text „Hello world!“ ausgeben. Da Englisch auch die Development Language des Projekts ist, tragen wir den gewünschten Text direkt in das Label ein.

Die Beispiel-App verfügt über ein Label, dessen Text bereits in der Development Language Englisch passend übersetzt ist.
Die Beispiel-App verfügt über ein Label, dessen Text bereits in der Development Language Englisch passend übersetzt ist.

Als Nächstes erweitern wir das Projekt um die Unterstützung für eine weitere Sprache, nämlich Deutsch. Dazu wechseln wir in die Projekteinstellungen und fügen die Sprache dort hinzu. Bei der Auswahl der Dateien, die um eine passende deutsche Übersetzung ergänzt werden sollen, entscheiden wir uns ausschließlich für die Main.storyboard-Datei.

Beim Hinzufügen der Sprache Deutsch zu unserem Beispielprojekt übersetzen wir lediglich die Main.storyboard-Datei.
Beim Hinzufügen der Sprache Deutsch zu unserem Beispielprojekt übersetzen wir lediglich die Main.storyboard-Datei.

Durch diesen Schritt wird die Main.storyboard-Datei um ein STRINGS-File für die Sprache Deutsch ergänzt. Um es einzusehen, klickt man auf das kleine Pfeilsymbol links vom Dateinamen des Storyboards. In dieser STRINGS-Datei sind bereits Übersetzungen für alle Texte untergebracht, die bis zu diesem Zeitpunkt Teil der Interface-Datei waren (wobei als Übersetzung natürlich bisher noch der Text der Development Language zum Einsatz kommt und von uns passend ersetzt werden muss).

Die Main.storyboard-Datei wurde um ein STRINGS-File für die Sprache Deutsch ergänzt. Darin werden nun alle deutschen Übersetzungen für die Interface-Datei untergebracht.
Die Main.storyboard-Datei wurde um ein STRINGS-File für die Sprache Deutsch ergänzt. Darin werden nun alle deutschen Übersetzungen für die Interface-Datei untergebracht.

Interessant ist hierbei, wie sich die Schlüssel der STRINGS-Datei zusammensetzen. Ganz zu Beginn steht eine geradezu kryptische ID, gefolgt von einem Punkt und „text“. Die ID bezieht sich auf die View, die übersetzt werden soll. Um die herauszufinden, wechselt man in die Main.storyboard-Datei, wählt das Label aus und ruft den Identity Inspector auf. Dort wird im Bereich Document genau diese ID als Object ID aufgeführt.

Die Object ID einer View kann über den Identitiy Inspector innerhalb einer Interface-Datei ermittelt werden.
Die Object ID einer View kann über den Identitiy Inspector innerhalb einer Interface-Datei ermittelt werden.

„.text“, das in der STRINGS-Datei an diese Object ID angefügt wird, bezieht sich schließlich auf die zu übersetzende Eigenschaft der View. Das Label selbst lässt sich nämlich nicht übersetzen, sehr wohl aber dessen Wert der text-Property. Genau das ist der String, für den wir eine Übersetzung anbieten möchten. Genau so setzen sich die Schlüssel des STRINGS-Files einer Interface-Datei zusammen.

Nun können wir dieses Label also passend ins Deutsche übersetzen, in dem wir in der STRINGS-Datei für die deutsche Sprache den Wert der text-Eigenschaft des Labels auf „Hallo Welt!“ ändern. Abhängig davon, ob die App nun auf Deutsch oder auf Englisch ausgeführt wird, zeigt das Label den passend übersetzten Text an.

Abhängig davon, in welcher Sprache die App ausgeführt wird, wird die passende Übersetzung für das Label angezeigt.
Abhängig davon, in welcher Sprache die App ausgeführt wird, wird die passende Übersetzung für das Label angezeigt.

Übrigens: Mithilfe der Object ID können Sie im Laufe der Entwicklung einer App auch Übersetzungen für Views nachträglich in der STRINGS-Datei hinzufügen. Würden wir beispielsweise in dem gezeigten Projekt ein zweites Label im Storyboard einbinden, verfügt das nicht über einen passenden Eintrag in der STRINGS-Datei. Wir müssen das Label also entsprechend im Storyboard auswählen, im Identity Inspector die zugehörige Object ID auslesen und die dann in der STRINGS-Datei (inklusive der zu übersetzenden Eigenschaft) hinzufügen und übersetzen.

Fazit

Mithilfe der Base Internationalization gestaltet sich die Übersetzung von Interfaces sehr einfach und komfortabel. Die Übersetzungen werden alle direkt in der jeweiligen Interface-Datei zusammengefasst und können in der gesetzten Development Language direkt im Interface eingepflegt werden. Das macht das Interface an sich während der Entwicklung bereits deutlich verständlicher und erspart darüber hinaus das unnötige Erstellen von Outlets für Views, die man nur benötigt, um eine Übersetzung durchzuführen.

Euer Thomas

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Kontakt und soziale Netzwerke

Impressum

Thomas Sillmann
Kettererstraße 6
D-63739 Aschaffenburg
E-Mail: contact@thomassillmann.de
Mobil: +49 (0) 151 65125650
Web: https://www.thomassillmann.de/

Inhaltlich Verantwortlicher gemäß §55 Abs. 2 RStV: Thomas Sillmann (Anschrift siehe oben)

Haftungshinweis: Trotz sorgfältiger inhaltlicher Kontrolle übernehme ich keine Haftung für die Inhalte externer Links. Für die Inhalte der verlinkten Seiten sind ausschließlich deren Betreiber verantwortlich.

Copyright © 2019 · Thomas Sillmann