GWT - Internacionalizácia aplikácie

  • strict warning: Only variables should be passed by reference in /var/www/virtual/mrazovci.eu/htdocs/modules/book/book.module on line 559.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Declaration of views_handler_argument::init() should be compatible with views_handler::init(&$view, $options) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/handlers/views_handler_argument.inc on line 744.
  • strict warning: Declaration of views_handler_filter::options_validate() should be compatible with views_handler::options_validate($form, &$form_state) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/handlers/views_handler_filter.inc on line 607.
  • strict warning: Declaration of views_handler_filter::options_submit() should be compatible with views_handler::options_submit($form, &$form_state) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/handlers/views_handler_filter.inc on line 607.
  • strict warning: Declaration of views_handler_filter_node_status::operator_form() should be compatible with views_handler_filter::operator_form(&$form, &$form_state) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/modules/node/views_handler_filter_node_status.inc on line 13.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Declaration of views_handler_field_user::init() should be compatible with views_handler_field::init(&$view, $options) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/modules/user/views_handler_field_user.inc on line 47.
  • strict warning: Declaration of views_handler_field_node_new_comments::pre_render() should be compatible with views_handler_field::pre_render($values) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/modules/comment/views_handler_field_node_new_comments.inc on line 100.
  • strict warning: Declaration of views_handler_filter_boolean_operator::value_validate() should be compatible with views_handler_filter::value_validate($form, &$form_state) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/handlers/views_handler_filter_boolean_operator.inc on line 159.
  • strict warning: Non-static method view::load() should not be called statically in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/views/views.module on line 906.
  • strict warning: Declaration of date_handler_field_multiple::pre_render() should be compatible with content_handler_field_multiple::pre_render($values) in /var/www/virtual/mrazovci.eu/htdocs/sites/all/modules/date/date/date_handler_field_multiple.inc on line 185.
Verzia pre tlačSend by emailPDF verzia

Teraz máme vytvorenú počiatočnú implementáciu aplikácie StockWatcher.

V tomto návode sa naučíme ako pripraviť aplikáciu tak, aby podporovala iné jazyky a formáty údajov. Preložíme používateľské rozhranie aplikácie StockWatcher do nemčiny. Postup bude nasledujúci:

  1. Zvolíme si techniku internacionalizácie.
  2. Internacionalizácia aplikácie StockWatcher vytvorením prekladu do každého jazyka.
  3. Lokalizácia aplikácie StockWatcher výberom vhodného prekladu pomocou miestnych nastavení.

Poznámka: Podrobnejšiu príručku o internacionalizácii GWT aplikácii môžeme nájsť na stránke Internationalization.

Skôr ako začneme

Projekt StockWatcher

Tento návod je zostavený podľa konceptov GWT a aplikácia StockWatcher bola vytvorená podľa návodu Zostavenie vzorovej GWT aplikácie. Ak ste tento návod nečítali, ale poznáme základné koncepty GWT, môžeme si kód projektu StockWatcher teraz naimportovať. Aby kód mohli prekladať aj vývojári iných krajín, je vhodné napísať zdrojový kód a texty viditeľné v používateľskom rozhraní v anglickom jazyku, preto sme texty zmenili do angličtiny.

  1. Stiahneme si projekt StockWatcher.
  2. Rozbalíme súbor.
  3. Naimportujeme projekt do vývojárskeho IDE prostredia Eclipse
    1. Z ponuky File vyberieme položku Import....
    2. Vyberieme General > Existing Projects into Workspace. Klikneme na tlačidlo Next.
    3. Vyhľadáme a zvolíme rozbalený adresár s projektom StockWatcher. Klikene na tlačidlo Finish.

Ak používame ant, upravíme vlastnosť gwt.sdk v súbore StockWatcher/build.xml tak, aby odkazovala na rozbalený adresár.

1. Návrh

Určíme čo je potrebné preložiť a čo lokalizovať

Ak sa pozrieme na aktuálne anglické rozhranie programu StockWatcher, uvidíme, že obsahuje dva druhy textov, ktoré by sa mali lokalizovať: konštanty a správy.

screenshot: StockWatcher English UI

Výber techniky pre internacionalizáciu

Keď chceme intenacionalizovať GWT aplikáciu, máme na výber niekoľko techník, z ktorých si môžeme vybrať. Vďaka tomu, že používateľské rozhranie aplikácie StockWatcher obsahuje iba niekoľko konštánt a parametrizovaných správ, použijeme statickú internacionalizáciu reťazcov (Static String Internationalization).

Statická internacionalizácia reťazcov
Statické naplnenie reťazcov vyžaduje veľmi malú záťaž pri behu aplikácie, a preto je veľmi efektívnou technikou na prekladanie konštánt aj parametrizovaných reťazcov. Je to tiež najjednoduchšia technika na implementáciu. Statická internacionalizácia reťazcov používa na ukladanie preložených reťazcov a parametrizovaných správ štandardné Java súbory s príponou properties, a potom použije silne typové rozhrania jazyka Java na získanie ich hodnôt.

Dynamická internacionalizácia reťazcov
Dynamická internacionalizácia reťazcov je pomalšia ako statická, no je veľmi flexibilná. Aplikácia používa techniku vyhľadávania lokalizovaných reťazcov v hostiteľskej stránke modulu, preto pri pridaní novej lokalizácie nie je potrebné projekt znova zostaviť. Ak potrebujeme GWT aplikáciu umiestniť do lokalizačného systému na strane servera, dynamická internacionalizácia reťazcov je ideálnym riešením.

Lokalizovateľné rozhranie
Najmocnejšia technika je implementácia lokalizoateľného rozhrania. Jej implementácia nám umožňuje isť za rámec nahradzovania textov a vytvoriť lokalizované verzie vlastných typov. Je to pokročilá technika, ktorú zrejme nebudeme veľmi často používať.

2. Internacionalizácia aplikácie StockWatcher: Vytvorenie prekladu do každého jazyka

Kroky procesu: Statická internacionalizácia reťazcov

Proces, ktorým sa vytvára statická internacionalizácia, je jednodcuhý.

  1. Najskôr implementujeme inštancie dvoch Java rozhraní:
    • jedno pre konštantné reťazce – rozhranie GWT Constants  (StockWatcherConstants.java)
    • jedno pre parametrizované správy -rozhranie GWT Messages  (StockWatcherMessages.java)
    Tieto rozhrania na definíciu predvoleného prekladu používajú anotácie.
  2. Potom pre každý nový jazyk, ktorý chceme podporovať, vytvoríme dva Java súbory s príponami properties:
    • jeden pre konštantné reťazce
      (StockWatcherConstants_de.properties)
    • jedno pre parametrizované správy (StockWatcherMessages_de.properties)
  3. Nakoniec nahradíme všetky reťazce napevno vložené do zdrojového kódu jazyka Java volaním metódy z príslušného rozhrania.

Tip: GWT poskytuje nástroj pre príkazový riadok s názvom i18nCreator, ktorý automatizuje vytváranie Java rozhraní s prístupom do súborov s príponami properties. Tento nástroj sa hodí najmä vtedy, ak máme lokalizované súbory vlastností a chceme ich znova použiť.

Implementácia rozhrania Constants

Najskôr vytvoríme rozhranie jazyka Java (StockWatcherConstants), ktoré bude pristupovať do súborov s príponami properties, v ktorých budú preklady. Rozhranie na definíciu predvoleného prekladu používa anotácie. Toto rozhranie implementuje rozhranie GWT Constants a automaticky sa previaže so súbormi StockWatcherConstants*.properties, ktoré vytvoríme, a ktorým priradíme odpovedajúce meno.

Rozhranie StockWatcherConstants obsahuje metódy pre každú z konštánt v súbore s príponou properties. Keď je počas behu jedna z týchto metód zavolaná, bude vrátená hodnota z takého súboru s príponou properties, ktorý zodpovedá miestnym nastaveniam (O chvíľu si ukážeme ako miestne nastavenia zmeniť). Ak miestne nastavenia nie sú zadané, StockWatcher použije predvolený preklad, ktorý je určený anotáciou. Napríklad, ak sú miestne nastavenia nastavené na German, metóda stockWatcher vráti AktieWatcher; Ak miestne nastavenia nie sú nastavené, metóda stockWatcher vráti StockWatcher.

Vytvorenie rozhrania StockWatcherConstants

  1. V podbalíku client vytvoríme rozhranie, ktorému dáme názov StockWatcherConstants.
    Na paneli Package Explorer v prostredí Eclipse, zvolíme balík
    com.google.gwt.sample.stockwatcher.client
    Z hlavnej ponuky Eclipse zvolíme File > New > Interface
    Eclipse otvorí okno New Java Interface.
  2. Vyplníme okno New Java Interface.
    Ako Name zadáme StockWatcherConstants
    Ostatné hodnoty ponecháme nezmenené.
    Klikneme na Finish
    Eclipse vytvorí kostru kódu pre rozhranie StockWatcherConstants.
  3. Kostru kódu nahradíme nasledujúcim kódom.
    Na zadanie predvolených hodnôt použijeme anotácie.
    package com.google.gwt.sample.stockwatcher.client;
    
    import com.google.gwt.i18n.client.Constants;
    
    public interface StockWatcherConstants extends Constants {
      @DefaultStringValue("StockWatcher")
      String stockWatcher();
    
      @DefaultStringValue("Symbol")
      String symbol();
    
      @DefaultStringValue("Price")
      String price();
    
      @DefaultStringValue("Change")
      String change();
    
      @DefaultStringValue("Remove")
      String remove();
    
      @DefaultStringValue("Add")
      String add();
    }

Poznámka k implementácii: GWT poskytuje aj iné podobné rozhranie (ConstantsWithLookup), ktoré obsahuje metódy na dynamické vyhľadanie lokalizovaných reťazcov podľa názvu počas behu programu.

Vytvorenie nemeckého prekladu reťazcov

Kódovanie pomocou medzinárodnej znakovej sady

Keď vytvárame internacionalizáciu rozhrania aplikácie, musíme myslieť na to, že jazyky môžu podporovať znaky, ktoré sa nenachádzajú v základnej množine znakov podľa kódovania ASCII. Z tohto dôvodu hostiteľská HTML stránka (StockWatcher.html) aj Java súbor s príponou properties, ktorý obsahuje preklady, musia používať kódovanie UTF-8.

  1. Skontrolujeme kódovanie hostiteľskej stránky aplikácie.
    Otvoríme súbor StockWatcher.html.
    Ak kódovanie ešte nie je nastavené na UTF-8, skopírujeme nasledujúci riadok a vložíme ho do prvku <head>.
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">

Vytvorenie súboru StockWatcherConstant_de.properties

  1. V podbalíku client vytvoríme Java súbor s príponou properties.
    Na paneli Package Explorer v prostredí Eclipse, zvolíme balík
    com.google.gwt.sample.stockwatcher.client
    Z hlavnej ponuky Eclipse zvolíme File > New > File
    Do poľa File name zadáme
    StockWatcherConstants_de.properties
    Klikneme na Finish
  2. Zmeníme kódovanie súboru na UTF-8.
    Označíme súbor s príponou properties, a potom z hlavnej ponuky Eclipse zvolíme File > Properties.
    Eclipse otvorí okno Properties.
    V časti Text file encoding, zvolíme Other a nastavíme UTF-8. Klikneme na Apply, a potom na OK.
    Poznámka: V závislosti od konfigurácie Eclipse, sa pri aplikovaní zmien môže zobraziť správa: UTF-8 conflicts with the encoding defined in the content type (ISO-8859-1). Do you wish to set it anyway? Túto správu môžeme ignorovať a zmenu potvrdíme.
  3. Pridáme preklad statických textov pre nemecké rozhranie.
    Skopírujeme nasledujúci text a prilepíme ho do súboru StockWatcherConstant_de.properties.
    stockWatcher = Aktienbeobachter
    symbol = Symbol
    price = Kurs
    change = Änderung
    remove = Entfernen
    add = Hinzufügen

Poznámka: Súbor s príponou properties

Ak sme sa doteraz ešte nikdy nezaoberali internacionalizáciou, možno nám nie je jasné, prečo sa k nemeckému súboru s príponou properties pridáva prípona _de. Prípona _de je štandardnou jazykovou značkou pre nemecký jazyk (Deutsch). Jazykové značky sú skratky, ktoré indikujú miestne nastavenia dokumentu alebo aplikácie. Okrem označenia jazyka môžu tiež obsahovať aj značku označujúcu región pre miestne nastavenia. Napríklad pre francúzky hovoriacich región Kanady použijeme príponu fr_CA.

V GWT sa miestne nastavenia súboru s príponou properties označujú príponou s jazykovým kódom (podobne ako pri baleniach so zdrojmi v jazyku Java). Výnimkou je súbor s príponou properties pre predvolené miestne nastavenia. Keď nie sú explicitne zadané miestne nastavenia pri behu programu, použije sa súbor s vlastnosťami bez prípony. V aplikácii StockWatcher sme však predvolený preklad zadali pomocou anotácii a nie pomocou predvoleného súboru s vlastnosťami.

Implementácia rozhrania Messages

Najskôr vytvoríme Java rozhranie (StockWatcherMessages). Bude pristupovať do súboru s vlastnosťami, ktorý obsahuje preklad každej parametrizovanej správy. Toto rozhranie implementuje rozhranie GWT Messages. Na rozdiel od rozhrania StockWatcherConstants, metódy v tomto rozhraní obsahujú parametre. Keď zavoláme tieto metódy, parametre, ktoré im predáme, nahradia zástupné reťazce, ktoré sa nachádzajú v reťazcoch v súbore s vlastnosťami. Toto rozhranie sa automaticky podľa názvu previaže s hociktorými súbormi StockWatcherMessages*.properties, ktoré sme vytvorili.

Internacionalizácia dátumových formátov

Parametrizované správy nie sú určené len pre upozornenia a chybové správy. Každé miesto v aplikácii, kde sa nastavuje text do widgetu Label má možnosť použiť parametrizovanú správu. Príkladom v našej aplikácii StockWatcher je časová značka – nestačí jej predať iba hodnotu dátumu, ale je potrebné prispôsobiť aj jej formát podľa miestnych nastavení.

  1. V podbalíku client vytvoríme rozhranie a priradíme mu názov StockWatcherMessages.
  2. Nahradíme jeho kostru nasledujúcim kódom.
    package com.google.gwt.sample.stockwatcher.client;
    
    import com.google.gwt.i18n.client.Messages;
    
    import java.util.Date;
    
    public interface StockWatcherMessages extends Messages {
      @DefaultMessage("''{0}'' is not a valid symbol.")
      String invalidSymbol(String symbol);
    
      @DefaultMessage("Last update: {0,date,medium} {0,time,medium}")
      String lastUpdate(Date timestamp);
    
    }

Tipy pre formátovanie parametrizovaných správ

Určenie počtu parametrov

Všetky reťazce správ v sebe obsahujú reťazec {0}. Ide o tzv. zástupný reťazec (placeholder), ktorý sa po spustení programu nahradí predaným parametrom z metód rozhrania StockWatcherMessages.

Ak máme reťazce, ktoré potrebujú viac ako jeden parameter, môžeme zaradom zástupné reťazce očíslovať.
Naprlíklad: mojRetazec = Prvý parameter je {0}, druhý parameter je {1}, tretí parameter je {2}.

Spracovanie textu v úvodzovkách

Ak správa obsahuje apostrof ('), všetko čo je potrebné urobiť v programe StockWatcher, nahradiť ich dvoma za sebou idúcimi apostrofmi v súbore vlastností jazyka Java. Vo všeobecnosti sú pravidlá formátovania pre GWT správy rovnaké ako pre Java triedu MessageFormat.

Vytvorenie nemeckého prekladu parametrizovaných správ

  1. Vytvoríme Java súbor s príponou properties.
    Ako miesto zadáme alebo označíme
    StockWatcher/src/com/google/gwt/sample/stockwatcher/client
    Ako názov súboru zadáme
    StockWatcherMessages_de.properties
  2. Zmeníme kódovanie súboru na UTF-8.
  3. Pridáme mapovanie pre parametrizovaný text v anglickom používateľskom.
    Skopírujeme nasledujúci text do súboru StockWatcherMessages_de.properties.
    lastUpdate = Letzte Aktualisierung: {0,date,medium} {0,time,medium}
    invalidSymbol = ''{0}'' ist kein gültiges Aktiensymbol.

Nahradenie natvrdo zadaného reťazca s generovaným lokalizovaným reťazcom

Ďalším krokom pri internacionalizácii aplikácie StockWatcher je nahradenie  reťazcov natvrdo zadaných do zdrojových kódov, metódami, ktoré volajú jedno z dvoch nových rozhraní.

Nahradenie reťazcov natvrdo zapísaných na hostiteľskej HTML stránke

Teraz má aplikácia StockWatcher jeden reťazec, ktorý nie je generovaný programovo: svoj názov StockWatcher. Ide o HTML nadpis <h1> na hostiteľskej stránke (StockWatcher.html).

V návode Zostavenie vzorovej GWT aplikácie sme chceli ukázať, že je možné miešať statické HTML prvky s tými, ktoré generuje StockWatcher, na jednej stránke. Bolo tiež rýchle a jednoduché pridať statický text nad tabuľku s komoditami. Teraz však chceme internacionalizovanú aplikáciu StockWatcher a zisťujeme, že to nebola veľmi flexibilná stratégia.

Jednoduchý spôsob ako nadpis generovať, je ten, že nahradíme text vo vnútri prvku <h1>  GWT widgetom Label a zavoláme jeho metódu setText(String) method. GWT widgety sa nedajú začleniť priamo do hostiteľskej HTML stránky, preto ich musíme obaliť panelom Root.

  1. Otvoríme StockWatcher.html.
    Prepojíme panel Root s nadpisom <h1> tým, že do prvku pridáme atribút id s hodnotou "appTitle".
    Zmažeme text v nadpise <h1>.
      <body>
    
        <img src="images/GoogleCode.png"/>
    
        <h1>StockWatcher</h1>
        <h1 id="appTitle"></h1>

Teraz by sme mali byť schopní nastaviť všetky lokalizované reťazce po spustení aplikácie StockWatcher.

Nahradenie reťazcov nastavených programovo

Prejdeme si celú triedu StockWatcher a nahradíme všetky reťazce, ktoré su natvrdo zapísané.

  1. Vytvoríme inštancie rozhraní StockWatcherConstants a StockWatcherMessages.
    V triede StockWatcher pridáme nasledujúci vlastností.
      private ArrayList<String> stocks = new ArrayList<String>();
      private StockWatcherConstants constants = GWT.create(StockWatcherConstants.class);
      private StockWatcherMessages messages = GWT.create(StockWatcherMessages.class);
    Pretože sa jedná o rozhrania a nie o triedy, nedajú sa inštancie vytvoriť priamo. Namiesto toho použijeme metódu GWT.create(Class). Potom by sme mali byť schopní použiť metódy rozhraní na získanie prislúchajúcich reťazcov.
  2. Eclipse označí GWT a odporučí pridať deklaráciu import.
    import com.google.gwt.core.client.GWT;
  3. Nahradíme všetky natvrdo zapísané reťazce volaniami metód z triedy constants.
    Získame hodnoty z titulky okna, názvu aplikácie, tlačidla Add Stock, a hlavičiek stĺpcov tabuľky zo súborov s koncovkami properties.
      public void onModuleLoad() {
        // Set the window title, the header text, and the Add button text.
        Window.setTitle(constants.stockWatcher());
        RootPanel.get("appTitle").add(new Label(constants.stockWatcher()));
        addStockButton = new Button(constants.add());
    
        // Create table for stock data.
        stocksFlexTable.setText(0, 0, constants.symbol());
        stocksFlexTable.setText(0, 1, constants.price());
        stocksFlexTable.setText(0, 2, constants.change());
        stocksFlexTable.setText(0, 3, constants.remove());
    
        ...
  4. Nahradíme parametrizovanú chybovú správu.
    V metóde addStock nahradíme správu s upozornením na neplatný kód komodity.
    Change:
      private void addStock() {
        final String symbol = newSymbolTextBox.getText().toUpperCase().trim();
        newSymbolTextBox.setFocus(true);
    
        // Stock code must be between 1 and 10 chars that are numbers, letters, or dots.
        if (!symbol.matches("^[0-9a-zA-Z\\.]{1,10}$")) {
          Window.alert("'" + symbol + "' is not a valid symbol.");
          Window.alert(messages.invalidSymbol(symbol));
          newSymbolTextBox.selectAll();
          return;
        }
    
        ...
  5. Presunieme logiku na určenie formátu dátumu do rozhrania Messages.
    V metóde updateTable(StockPrice[] prices) nahradíme premennú timestamp volaním metódy lastUpdate.
    Zmena:
      private void updateTable(StockPrice[] prices) {
        for (int i = 0; i < prices.length; i++) {
          updateTable(prices[i]);
        }
    
        // Display timestamp showing last refresh.
        lastUpdatedLabel.setText("Last update : "
            + DateTimeFormat.getMediumDateTimeFormat().format(new Date()));
        lastUpdatedLabel.setText(messages.lastUpdate(new Date()));
    
      }

3. Lokalizovanie aplikácie StockWatcher

V tejto chvíli by sme mali mať vytvorené dve lokalizované verzie používateľského rozhrania aplikácie StockWatcher. Ale ako má GWT vedieť, ktorú z nich má načítač pri spustení aplikácie? GWT používa vlastnosti klienta na vytvorenie prispôsobených zostavení JavaScriptu GWT aplikácie, pričom používa mechanizmus s názvom odložené viazanie. Aby sa vybrala správna lokalizovaná verzia aplikácie StockWatcher a zobrazila sa po spustení, GWT vyhodnocuje vlastnosť klienta s názvom locale.

Internacionalizácia a odložené viazanie

V časti Zostavenie vzorovej GWT aplikácie sme mohli vidieť, ako GWT používa odložené viazanie na generovanie rôznych variant aplikácie pre rôzne webové prehliadače. Počas behu programu zavádzací kód GWT doručí správnu variantu podľa toho, na ktorý prehliadač koncový používateľ používa. Rôzne varianty prekladov sa vytvárajú preto, lebo vlastnosť user agent je vlastnosťou klienta GWT. Rovnakým spôsobom GWT reprezentuje vlastnosť locale ako vlastnosť klienta. To znamená, že prekladač GWT vygeneruje prispôsobené verzie internacializovaných aplikácií pre každé podporované miestne nastavenie (locale).

Ak existuje viacero klientských vlastností, GWT vygeneruje jedinečný preklad pre každú ich možnú kombináciu hodnôt. Preto ak napríklad GWT podporuje 5 webových prehliadačov a urobíme preklad do 4 rôznych jazykov, prekladač GWT vytvorí celkovo 20 rôznych verzií aplikácie. Avšak každému používateľovi bude poskytnutý tá verzia kódu, ktorá zodpovedá jeho kombinácii webového prehliadača a miestneho prostredia.

Identifikácia miestnych nastavení podporovaných aplikáciou StockWatcher

Teraz je potrebné prekladaču GWT povedať, že aplikácia StockWatcher podporuje aj nemecké miestne nastavenie (de) tým, že nastavíme hodnoty klientskej vlastnosti locale.

  1. Nastavíme nemčinu ako podporovaný jazyk.
    Otvoríme StockWatcher.gwt.xml a pridáme nasledujúcu vlastnosť.
      <entry-point class='com.google.gwt.sample.stockwatcher.client.StockWatcher'/>
    
      <extend-property name="locale" values="de"/>
    </module>
  2. Obnovíme aplikáciu StockWatcher vo vývojovom režime.
    Štandardne sa načíta verzia v angličtine.
  3. Načítame nemeckú verziu.
    Na koniec adresy URL pridáme &amp;locale=de
    http://localhost:8888/StockWatcher.html?gwt.codesvr=127.0.0.1:9997&locale=de
    Všetky konštanty by sa mali zobraziť v nemčine.
  4. Ako kód komodity zadáme neplatný znak.
    Mala by sa zobraziť chybová správa v nemčine.
    Môžeme si tiež všimnúť, že je lokalizovaný aj formáty meny.
    screenshot: StockWatcher German UI
  5. Zostavíme aplikáciu StockWatcher a otvoríme ju v ostrom režime.
    Webový prehliadač zobrazí aplikáciu StockWatcher s predvoleným rozhraním.
  6. Otestujeme nemecké rozhranie.
    Pridáme do adresy URL ?locale=de
    Webový prehliadač zobrazí nemecké rozhranie aplikácie StockWatcher.
  7. Pozrieme sa na vygenerované súbory.
    Mali by sme vidieť súbory pre dvakrát toľko variant ako sme mali pred vytvorením nemeckého rozhrania.

Určenie miestneho nastavenia používateľa

Ako počas behu aplikácie môžeme určiť miestne nastavenia používateľa? Môžeme to urobiť rovnako ako na webových stránkach – ponúknuť používateľovi zoznam jazykov alebo miestnych nastavení a nechať ho, aby si z nich vybral ručne. Môžeme tiež nechať webový server, aby skontroloval pole Accept-Language v HTTP požiadavke prehliadača a zistil správne miestne nastavenie. Ak to urobíme, je potrebné používateľovi poskytnúť možnosť, aby hodnotu poľa Accept-Language mohol ignorovať a nastaviť si vlastný preferovaný jazyk.

Nastavenie miestneho nastavenia

Teraz, keď je aplikácia StockWatcher internacionalizovaná, ako bude GWT vedieť, ktoré miestne nastavenie má použiť počas behu? Odpoveďou je, že sa použije hodnota vlastnosti klienta locale. Túto vlastnosť klienta môžeme zmeniť dvoma spôsobmi:

  • Pridáme HTML značku <meta> do značky <head> v hostiteľskej stránke aplikácie, ktorá bude obsahovať názov vlastnosti a jej hodnotu:
    &lt;meta name="gwt:property" content="locale=de"&gt;
  • Pridáme hodnotu vlastnosti do reťazca požiadavky adresy URL:
    http://www.example.org/myapp.html?locale=de

Ak zadáme rozdielne hodnoty vlastnosti klienta (napríklad locale) do značky <meta> aj do adresy URL, hodnota v adrese URL dostane prednosť.

Ochránenie miestnych nastavení naprieč viacerými stránkami prehliadača

Miestne nastavenia pre modul GWT sa použijú iba pre konkrétnu inštanciu konkrétneho modulu. To znamená, že ak aplikácia obsahuje odkaz na inú hostiteľskú stránku GWT alebo bežnú stránku bez GWT, miestne nastavenia sa medzi týmito stránkami neprenesú. Preto, ak chceme ochrániť mieste nastavenie vybrané používateľom, je ich potrebné pridať buď do každého reťazca požiadavky vo všetkých odkazoch v GWT aplikácii, alebo je potrebné uložiť miestne nastavenia niekam na server, odkiaľ sa budú vkladať do príslušnej <meta> značky hostiteľských stránok načítavaných GWT modulov.

Viac o internacionalizácii

Teraz máme pomocou statickej internacionalizácie reťazcov vygenerovanú nemeckú verziu GWT aplikácie. Implementovali sme lokalizáciu, takže by sa mal príslušný variant aplikácie načítať s miestnymi nastaveniami.

Viac informácií o troch technikách internacionalizácie modulu GWT I18N a o tom ako pomocou GWT nástroja i18nCreator môžeme použiť existujúce lokalizované súbory vlastností, sa nachádza  v časti Internationalization vývojárskej príručky.