Beispiel: Internationalisierung einer Börsenticker-Anwendung

Flash Player 10.1 und höher, Adobe AIR 2.0 und höher

Mit der Anwendung „Global Stock Ticker“ werden fiktive Börsendaten aus drei verschiedenen Börsen (USA, Japan und Europa) abgerufen und angezeigt. Die Anwendung formatiert die Daten gemäß den Konventionen verschiedener Gebietsschemas.

Dieses Beispiel veranschaulicht die folgenden Funktionsmerkmale des flash.globalization-Pakets:

  • Zahlenformatierung mit Erkennung des Gebietsschemas

  • Währungsformatierung mit Erkennung des Gebietsschemas

  • Einstellen von ISO-Währungscodes und Währungssymbolen

  • Datumsformatierung mit Erkennung des Gebietsschemas

  • Abrufen und Anzeigen der passenden Abkürzungen für Monatsnamen

Die Anwendungsdateien für dieses Beispiel finden Sie unter www.adobe.com/go/learn_programmingAS3samples_flash_de . Die Dateien für die Anwendung „Global Stock Ticker“ befinden sich im Ordner „Samples/GlobalStockTicker“. Die Anwendung umfasst die folgenden Dateien:

Datei

Beschreibung

GlobalStockTicker.mxml

oder

GlobalStockTicker.fla

Die Benutzeroberfläche der Anwendung im Flex-Format (MXML) oder Flash-Format (FLA).

styles.css

Stile für die Benutzeroberfläche der Anwendung (nur Flex).

com/example/programmingas3/stockticker/flex/FinGraph.mxml

Eine MXML-Komponente, die ein Diagramm mit simulierten Börsendaten anzeigt (nur Flex).

com/example/programmingas3/stockticker/flash/GlobalStockTicker.as

Document-Klasse mit der Benutzeroberflächenlogik für die Anwendung (nur Flash).

comp/example/programmingas3/stockticker/flash/RightAlignedColumn.as

Ein benutzerdefinierter Zellen-Renderer für die DataGrid-Komponente in Flash (nur Flash).

com/example/programmingas3/stockticker/FinancialGraph.as

Eine ActionScript-Klasse, die ein Diagramm mit simulierten Börsendaten zeichnet.

com/example/programmingas3/stockticker/Localizer.as

Eine ActionScript-Klasse, die das Gebietsschema und die Währung verwaltet und Zahlen, Währungsbeträge und Datumsangaben je nach Gebietsschema formatiert.

com/example/programmingas3/stockticker/StockDataModel.as

Eine ActionScript-Klasse, die alle Beispieldaten für die Beispielanwendung „Global Stock Ticker“ enthält.

Benutzeroberfläche und Beispieldaten

Die Benutzeroberfläche der Anwendung besteht aus den folgenden Hauptelementen:

  • Kombinationsfeld zum Auswählen des Gebietsschemas

  • Kombinationsfeld zum Auswählen einer Börse

  • DataGrid-Objekt zum Anzeigen von Daten für sechs Unternehmen einer jeden Börse

  • Diagramm mit simulierten historischen Daten zu den Wertpapieren des ausgewählten Unternehmens

Alle Beispieldaten über Gebietsschemas, Börsen und Wertpapiere der Anwendung werden in der StockDataModel-Klasse gespeichert. Eine echte Anwendung würde Daten von einem Server abrufen und dann in einer Klasse wie StockDataModel speichern. In diesem Beispiel sind alle Daten in der StockDataModel-Klasse hartkodiert.

Hinweis: Die Daten, die im Finanzdiagramm angezeigt werden, stimmen nicht unbedingt mit den Daten im DataGrid-Objekt überein. Bei Auswahl eines anderen Unternehmens wird das Diagramm immer zufällig neu gezeichnet. Es dient nur zu Illustrationszwecken.

Einstellen des Gebietsschemas

Nachdem einige Schritte zur Einrichtung durchgeführt wurden, ruft die Anwendung die Localizer.setLocale()-Methode auf, um Formatter-Objekte für das Standardgebietsschema zu erstellen. Die setLocale()-Methode wird auch immer aufgerufen, wenn der Benutzer einen neuen Wert aus dem Kombinationsfeld für das Gebietsschema auswählt.

public function setLocale(newLocale:String):void 
{ 
    locale  = new LocaleID(newLocale); 
 
    nf = new NumberFormatter(locale.name); 
    traceError(nf.lastOperationStatus, "NumberFormatter", nf.actualLocaleIDName); 
 
    cf = new CurrencyFormatter(locale.name); 
    traceError(cf.lastOperationStatus, "CurrencyFormatter", cf.actualLocaleIDName); 
    symbolIsSafe = cf.formattingWithCurrencySymbolIsSafe(currentCurrency); 
    cf.setCurrency(currentCurrency, currentSymbol); 
    cf.fractionalDigits = currentFraction; 
 
    df = new DateTimeFormatter(locale.name, DateTimeStyle.LONG, DateTimeStyle.SHORT); 
    traceError(df.lastOperationStatus, "DateTimeFormatter", df.actualLocaleIDName); 
    monthNames = df.getMonthNames(DateTimeNameStyle.LONG_ABBREVIATION); 
} 
 
public function traceError(status:String, serviceName:String, localeID:String) :void 
{ 
    if(status != LastOperationStatus.NO_ERROR) 
    { 
        if(status == LastOperationStatus.USING_FALLBACK_WARNING) 
        { 
            trace("Warning - Fallback locale ID used by " 
                    + serviceName + ": " + localeID); 
        } 
        else if (status == LastOperationStatus.UNSUPPORTED_ERROR) 
        { 
            trace("Error in " + serviceName + ": " + status); 
            //abort application 
            throw(new Error("Fatal error", 0)); 
        } 
        else 
        { 
            trace("Error in " + serviceName + ": " + status); 
        } 
    } 
    else 
    { 
        trace(serviceName + " created for locale ID: " + localeID); 
    } 
}

Zunächst erstellt die setLocale()-Methode ein LocaleID-Objekt. Bei Verwendung dieses Objekts ist es später einfacher, bei Bedarf Einzelheiten zum tatsächlichen Gebietsschema abzurufen.

Anschließend werden neue NumberFormatter-, CurrencyFormatter- und DateTimeFormatter-Objekte für das Gebietsschema erstellt. Nach dem Erstellen der einzelnen Formatter-Objekte wird die traceError()-Methode aufgerufen. Diese Methode zeigt in der Konsole Fehler- und Warnmeldungen an, wenn ein Problem mit dem angeforderten Gebietsschema vorliegt. (In einer echten Anwendung sollten Fehlermeldungen nicht nur angezeigt werden, sondern es sollten auch entsprechende Maßnahmen ergriffen werden.)

Nach dem Erstellen des CurrencyFormatter-Objekts stellt die setLocale()-Methode den ISO-Währungscode, das Währungssymbol und die fractionalDigits-Eigenschaften des Objekts auf vorab bestimmte Werte ein. (Diese Werte werden immer eingestellt, wenn der Benutzer eine neue Börse im Kombinationsfeld auswählt.)

Nach dem Erstellen des DateTimeFormatter-Objekts ruft die setLocale()-Methode auch ein Array der lokalisierten Abkürzungen für Monatsnamen ab.

Formatieren der Daten

Die formatierten Börsendaten werden in einem DataGrid-Objekt angezeigt. Die DataGrid-Spalten rufen jeweils eine Beschriftungsfunktion auf, die den Spaltenwert anhand des entsprechenden Formatter-Objekts formatiert.

In der Flash-Version werden die DataGrid-Spalten beispielsweise mit dem folgenden Code eingerichtet:

var col1:DataGridColumn = new DataGridColumn("ticker"); 
col1.headerText = "Company"; 
col1.sortOptions = Array.NUMERIC; 
col1.width = 200; 
 
var col2:DataGridColumn = new DataGridColumn("volume"); 
col2.headerText = "Volume"; 
col2.width = 120; 
col2.cellRenderer = RightAlignedCell; 
col2.labelFunction = displayVolume; 
 
var col3:DataGridColumn = new DataGridColumn("price"); 
col3.headerText = "Price"; 
col3.width = 70; 
col3.cellRenderer = RightAlignedCell; 
col3.labelFunction = displayPrice; 
 
var col4:DataGridColumn = new DataGridColumn("change"); 
col4.headerText = "Change"; 
col4.width = 120; 
col4.cellRenderer = RightAlignedCell; 
col4.labelFunction = displayPercent;

Die Flex-Version des Beispiels deklariert das DataGrid-Objekt in MXML. Sie definiert auch ähnliche Beschriftungsfunktionen für die einzelnen Spalten.

Die labelFunction-Eigenschaften verweisen auf die folgenden Funktionen, die Formatierungsmethoden der Localizer-Klasse aufrufen:

private function displayVolume(item:Object):String 
{   
    return localizer.formatNumber(item.volume, 0); 
} 
     
private function displayPercent(item:Object):String 
{ 
       return localizer.formatPercent(item.change )  ; 
} 
   
  private function displayPrice(item:Object):String 
{ 
    return localizer.formatCurrency(item.price); 
}

Dann werden die entsprechenden Formatter-Objekte von den Localizer-Methoden eingerichtet und aufgerufen:

public function formatNumber(value:Number, fractionalDigits:int = 2):String 
{ 
    nf.fractionalDigits = fractionalDigits; 
    return nf.formatNumber(value); 
} 
 
public function formatPercent(value:Number, fractionalDigits:int = 2):String 
{ 
    // HACK WARNING: The position of the percent sign, and whether a space belongs 
    // between it and the number, are locale-sensitive decisions. For example, 
    // in Turkish the positive format is %12 and the negative format is -%12. 
    // Like most operating systems, flash.globalization classes do not currently 
    // provide an API for percentage formatting. 
    nf.fractionalDigits = fractionalDigits; 
    return nf.formatNumber(value) + "%"; 
} 
 
public function formatCurrency(value:Number):String 
{ 
    return cf.format(value, symbolIsSafe); 
} 
 
public function formatDate(dateValue:Date):String 
{ 
    return df.format(dateValue); 
} 
|