1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
|
---
title: Localização
slug: Archive/Mozilla/XUL/Tutorial/Localização
tags:
- Internacionalização
- Localização
- Tutoriais
- XUL
- XUL_Tutorial
translation_of: Archive/Mozilla/XUL/Tutorial/Localization
---
<p>XUL e XML fornecem entidades, que são uma forma conveniente de permitir localização.</p>
<h3 id="Entities" name="Entities">Entidades</h3>
<p>Muitos aplicativos são compilados de forma que a tradução da interface para um idioma diferente seja o mais simples possível. Geralmente, uma tabela de strings é criada para cada idioma. Em vez de codificar texto diretamente para um aplicativo, cada pedaço de texto só é uma referência na tabela de strings. <a href="/pt-BR/XML" title="en/XML">XML</a> fornece entidades que podem ser usadas para um propósito similar.</p>
<p>Você já deve ser familiar com entidades se você escreveu <a href="/pt-BR/HTML" title="en/HTML">HTML</a>. Os códigos <code>&lt;</code> e <code>&gt;</code> são exemplos de entidades que podem ser usadas para colocar sinais de menor que e maior que no texto. XML possui uma sintaxe que lhe permite declarar entidades personalizadas. Você pode usá-las, de forma que a entidade seja substituída com seu valor, que pode ser uma string de texto. Entidades podem ser usados sempre que houver texto, inclundo os valores de atributos. O exemplo abaixo demonstra o uso de uma entidade em um botão.</p>
<pre><button label="&findLabel;"/>
</pre>
<p>O texto que aparecerá no rótulo será o valor que a entidade <code>&findLabel;</code> tem. Um arquivo é criado contendo as declarações da entidade para cada idioma suportado. Em ingçês, a entidade <code>&findLabel;</code> provavelmente será declarada para ter o texto "Find" ("localizar", "encontrar").</p>
<h3 id="DTD_Files" name="DTD_Files">DTD Files</h3>
<p>Entities are declared in <em>Document Type Definition</em> (DTD) files. Files of this type are normally used to declare the syntax and semantics of a particular XML file, but they also let you declare entities. In the Mozilla chrome system, you will find DTD files located in the <code>locales</code> subdirectory. You would normally have one DTD file (with an extension <code>.dtd</code>) per XUL file.</p>
<p>If you look in the chrome directory, you should see an archive for your language. (<code>en-US.jar</code> is the default for English.) You might have locale files in multiple languages, for example, US English (en-US) and French (fr). Inside these archives, you will find the files that hold the localized text for each window. The structure of the archives is very similar to the directory structure used for <a href="/en/XUL_Tutorial/Creating_a_Skin" title="en/XUL_Tutorial/Creating_a_Skin">skins</a>.</p>
<p>Inside the archives, you would place the DTD files in which you declare entities. Typically, you will have one DTD file for each XUL file, usually with the same filename except with a <code>.dtd</code> extension. So, for the find files dialog, we will need a file called <code>findfile.dtd</code>.</p>
<p>For non-installed chrome files, you can just put the DTD file in the same directory as the XUL file.</p>
<div class="note"><strong>Note:</strong> You should encode DTD files as UTF-8 for non-ASCII characters. That is, you should save them in UTF-8 format (<a class="external" href="http://www.mozdev.org/notes/l10n/unicode/editors-en.html">without BOM</a>). For more information, see <a class="external" href="http://www.mozilla.org/projects/l10n/mlp_chrome.html#text">Mozilla Language Packs</a>.</div>
<p>Once you have created a DTD file for your XUL, you will need to add a line to the XUL file which indicates that you want to use the DTD file. Otherwise, errors will occur as it won't be able to find the entities. To do this, add a line of the following form somewhere near the top of the XUL file:</p>
<pre><!DOCTYPE window SYSTEM "chrome://findfile/locale/findfile.dtd">
</pre>
<p>This line specifies that the URL indicated is to be used as a DTD for the file. In this case, we have declared that we want to use the <code>findfile.dtd</code> DTD file. This line is typically placed just before the <code><code><a href="/pt-BR/docs/Mozilla/Tech/XUL/window" title="window">window</a></code></code> element.</p>
<p>You also need to add the locale to the <a href="/en/Chrome_Registration#locale" title="en/Chrome_Registration#locale">chrome.manifest</a> file, for example:</p>
<pre class="eval">locale findfile en-US locale/
</pre>
<h3 id="Declaring_Entities" name="Declaring_Entities">Declaring Entities</h3>
<p>The entities are declared using a simple syntax as shown below:</p>
<pre><!ENTITY findLabel "Find">
</pre>
<p>This example creates an entity with the name <code>findLabel</code> and the value "Find". This means that wherever the text "&findLabel;" appears in the XUL file, it will be replaced with the text "Find". Note that entity declarations do not have a trailing slash at the end of them. In the DTD file for a different language, the text for that language will be used instead.</p>
<pre class="eval"><strong>for Japanese:</strong>
<!ENTITY findLabel "検索">
</pre>
<p>For example, the following text:</p>
<pre><description value="&findLabel;"/>
</pre>
<p>is translated as:</p>
<pre class="eval"><strong>English version:</strong>
<description value="Find"/>
<strong>Japanese version:</strong>
<description value="検索"/>
</pre>
<p>You would declare an entity for each label or string of text that you use in your interface. You should not have any directly displayed text in the XUL file at all.</p>
<p>In addition to using entities for text labels, you should use them for any value that could be different in a different language. <a href="/en/XUL_Tutorial/Keyboard_Shortcuts" title="en/XUL_Tutorial/Keyboard_Shortcuts">Access keys and keyboard shortcuts </a> for example.</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>The example above uses two entities, one for the label on the Undo menu item and the second for the access key.</p>
<p> </p>
<div class="highlight">
<h3 id="Changing_the_Find_Files_example" name="Changing_the_Find_Files_example">Changing the Find Files example</h3>
<p>Let's take a look at how we would put all of this together by modifying the find files dialog so that it uses a DTD file for all of its text strings. The entire XUL file is shown below with the changes shown in red.</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>
<menupopup id="editpopup">
<menuitem label="<span class="highlightred">&cutCmd.label;</span>" accesskey="<span class="highlightred">&cutCmd.accesskey;</span>"/>
<menuitem label="<span class="highlightred">&copyCmd.label;</span>" accesskey="<span class="highlightred">&copyCmd.accesskey;</span>"/>
<menuitem label="<span class="highlightred">&pasteCmd.label;</span>" accesskey="<span class="highlightred">&pasteCmd.accesskey;</span>" disabled="true"/>
</menupopup>
</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>Each text string has been replaced by an entity reference. A DTD file has been included near the beginning of the XUL file. Each entity that was added should be declared in the DTD file. The window will not be displayed if an entity is found in the XUL file that hasn't been declared.</p>
<p>Note that the name of the entity is not important. In the example above, words in entities have been separated with periods. You don't have to do this. The entity names here follow similar conventions as the rest of the Mozilla code.</p>
<p>You might notice that the text '2520 bytes' has been replaced by two entities. This is because the phrase structure may be different in another locale. For example, the number might need to appear before the equivalent of 'bytes' instead of after. Of course, this might need to be more complicated in order to display KB or MB as needed.</p>
<p>The access keys and keyboard shortcuts have also been translated into entities because they will likely be different in a different locale.</p>
<p>Next, the DTD file - 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>Now, to add text for a new language all you need to do is create another DTD file. By using the chrome system to add the DTD file to a different locale, the same XUL file can be used in any language.</p>
<p>Find files example so far: <a href="https://developer.mozilla.org/samples/xultu/examples/findfile/findfile-locale.xul.txt">Source</a></p>
</div>
<p>Next, we'll look at <a href="/en/XUL_Tutorial/Property_Files" title="en/XUL_Tutorial/Property_Files">property files</a>.</p>
<div class="prevnext" style="text-align: right;">
<p><a href="/pt-BR/docs/XUL_Tutorial/Creating_a_Skin" style="float: left;">« Previous</a><a href="/pt-BR/docs/XUL_Tutorial/Property_Files">Next »</a></p>
</div>
<h2 id="See_Also">See Also</h2>
<ul>
<li>How to localize html pages, xul files, and js/jsm files from bootstrapped add-ons: <a href="/en-US/Add-ons/Bootstrapped_extensions#Localization_%28L10n%29">Bootstrapped Extensions :: Localization (L10n)</a></li>
</ul>
|