https://airsdk.dev/assets/js/15890802.88f70a6e.js

1"use strict";(globalThis.webpackChunkairsdk_dev=globalThis.webpackChunkairsdk_dev||[]).push([[9274],{92045(e,t,n){n.r(t),n.d(t,{assets:()=>c,contentTitle:()=>o,default:()=>h,frontMatter:()=>l,metadata:()=>a,toc:()=>s});const a=JSON.parse('{"id":"development/internationalizing-applications/internationalizing-applications/example-internationalizing-a-stock-ticker-application","title":"Example: Internationalizing a stock ticker application","description":"The Global Stock Ticker application retrieves and displays fictitious data about","source":"@site/docs/development/internationalizing-applications/internationalizing-applications/example-internationalizing-a-stock-ticker-application.md","sourceDirName":"development/internationalizing-applications/internationalizing-applications","slug":"/development/internationalizing-applications/internationalizing-applications/example-internationalizing-a-stock-ticker-application","permalink":"/docs/development/internationalizing-applications/internationalizing-applications/example-internationalizing-a-stock-ticker-application","draft":false,"unlisted":false,"editUrl":"https://github.com/airsdk/airsdk.dev/edit/main/docs/development/internationalizing-applications/internationalizing-applications/example-internationalizing-a-stock-ticker-application.md","tags":[],"version":"current","sidebarPosition":9,"frontMatter":{"sidebar_position":9},"sidebar":"mainSidebar","previous":{"title":"Case conversion","permalink":"/docs/development/internationalizing-applications/internationalizing-applications/case-conversion"},"next":{"title":"Localizing applications","permalink":"/docs/development/internationalizing-applications/localizing-applications"}}');var i=n(74848),r=n(28453);const l={sidebar_position:9},o="Example: Internationalizing a stock ticker application",c={},s=[{value:"Understanding the user interface and sample data",id:"understanding-the-user-interface-and-sample-data",level:2},{value:"Setting the locale",id:"setting-the-locale",level:2},{value:"Formatting the data",id:"formatting-the-data",level:2}];function d(e){const t={a:"a",code:"code",em:"em",h1:"h1",h2:"h2",header:"header",li:"li",p:"p",pre:"pre",ul:"ul",...(0,r.R)(),...e.components};return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(t.header,{children:(0,i.jsx)(t.h1,{id:"example-internationalizing-a-stock-ticker-application",children:"Example: Internationalizing a stock ticker application"})}),"\n",(0,i.jsx)(t.p,{children:"The Global Stock Ticker application retrieves and displays fictitious data about\nstocks in three different stock markets: the United States, Japan, and Europe.\nIt formats the data according to the conventions of various locales."}),"\n",(0,i.jsx)(t.p,{children:"This example illustrates the following features of the flash.globalization\npackage:"}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"Locale-aware number formatting"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"Locale-aware currency formatting"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"Setting currency ISO code and currency symbols"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"Locale-aware date formatting"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"Retrieving and displaying appropriate month name abbreviations"}),"\n"]}),"\n"]}),"\n",(0,i.jsxs)(t.p,{children:["To get the application files for this sample, see\n",(0,i.jsx)(t.a,{href:"https://github.com/joshtynjala/flash-platform-as3-dev-guide-examples/releases/tag/original",children:(0,i.jsx)(t.em,{children:"FlashPlatformAS3DevGuideExamples.zip"})}),".\nThe Global Stock Ticker application files can be found in the folder\nSamples/GlobalStockTicker. The application consists of the following files:"]}),"\n",(0,i.jsxs)("table",{children:[(0,i.jsx)("thead",{children:(0,i.jsxs)("tr",{children:[(0,i.jsx)("th",{children:(0,i.jsx)("p",{children:"File"})}),(0,i.jsx)("th",{children:(0,i.jsx)("p",{children:"Description"})})]})}),(0,i.jsxs)("tbody",{children:[(0,i.jsxs)("tr",{children:[(0,i.jsxs)("td",{children:[(0,i.jsx)("p",{children:"GlobalStockTicker.mxml"}),(0,i.jsx)("p",{children:"or"}),(0,i.jsx)("p",{children:"GlobalStockTicker.fla"})]}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"The user interface for the application for Flex (MXML) or Flash\n(FLA)."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"styles.css"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"Styles for the application user interface (Flex only)."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"com/example/programmingas3/stockticker/flex/FinGraph.mxml"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"An MXML component that displays a chart of simulated stock data,\nfor Flex only."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"com/example/programmingas3/stockticker/flash/GlobalStockTicker.as"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"Document class containing the user interface logic for the\napplication (Flash only)."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"comp/example/programmingas3/stockticker/flash/RightAlignedColumn.as"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"A custom cell renderer for the Flash DataGrid component (Flash\nonly)."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"com/example/programmingas3/stockticker/FinancialGraph.as"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"An ActionScript class that draws a chart of simulated stock\ndata."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"com/example/programmingas3/stockticker/Localizer.as"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"An ActionScript class that manages the locale and currency and\nhandles the localized formatting of numbers, currency amounts, and\ndates."})})]}),(0,i.jsxs)("tr",{children:[(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"com/example/programmingas3/stockticker/StockDataModel.as"})}),(0,i.jsx)("td",{children:(0,i.jsx)("p",{children:"An ActionScript class that holds all the sample data for the\nGlobal Stock Ticker example."})})]})]})]}),"\n",(0,i.jsx)(t.h2,{id:"understanding-the-user-interface-and-sample-data",children:"Understanding the user interface and sample data"}),"\n",(0,i.jsx)(t.p,{children:"The application's main user interface elements are:"}),"\n",(0,i.jsxs)(t.ul,{children:["\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"a combo box for selecting a Locale"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"a combo box for selecting a Market"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"a DataGrid that displays data for six companies in each market"}),"\n"]}),"\n",(0,i.jsxs)(t.li,{children:["\n",(0,i.jsx)(t.p,{children:"a chart that shows simulated historical data for the selected company's stock"}),"\n"]}),"\n"]}),"\n",(0,i.jsx)(t.p,{children:"The application stores all of its sample data about locales, markets, and\ncompany stocks in the StockDataModel class. A real application would retrieve\ndata from a server and then store it in a class like StockDataModel. In this\nexample, all the data is hard coded in the StockDataModel class."}),"\n",(0,i.jsx)(t.p,{children:"Note: The data displayed in the financial chart doesn't necessarily match the\ndata shown in the DataGrid control. The chart is randomly redrawn each time a\ndifferent c

1ompany is selected. It is for illustration purposes only."}),"\n",(0,i.jsx)(t.h2,{id:"setting-the-locale",children:"Setting the locale"}),"\n",(0,i.jsx)(t.p,{children:"After some initial setup work, the application calls the method\nLocalizer.setLocale() to create formatter objects for the default locale. The\nsetLocale() method is also called each time the user selects a new value from\nthe Locale combo box."}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{children:'public function setLocale(newLocale:String):void\n{\n\tlocale  = new LocaleID(newLocale);\n\n\tnf = new NumberFormatter(locale.name);\n\ttraceError(nf.lastOperationStatus, "NumberFormatter", nf.actualLocaleIDName);\n\n\tcf = new CurrencyFormatter(locale.name);\n\ttraceError(cf.lastOperationStatus, "CurrencyFormatter", cf.actualLocaleIDName);\n\tsymbolIsSafe = cf.formattingWithCurrencySymbolIsSafe(currentCurrency);\n\tcf.setCurrency(currentCurrency, currentSymbol);\n\tcf.fractionalDigits = currentFraction;\n\n\tdf = new DateTimeFormatter(locale.name, DateTimeStyle.LONG, DateTimeStyle.SHORT);\n\ttraceError(df.lastOperationStatus, "DateTimeFormatter", df.actualLocaleIDName);\n\tmonthNames = df.getMonthNames(DateTimeNameStyle.LONG_ABBREVIATION);\n}\n\npublic function traceError(status:String, serviceName:String, localeID:String) :void\n{\n\tif(status != LastOperationStatus.NO_ERROR)\n\t{\n\t\tif(status == LastOperationStatus.USING_FALLBACK_WARNING)\n\t\t{\n\t\t\ttrace("Warning - Fallback locale ID used by "\n\t\t\t\t\t+ serviceName + ": " + localeID);\n\t\t}\n\t\telse if (status == LastOperationStatus.UNSUPPORTED_ERROR)\n\t\t{\n\t\t\ttrace("Error in " + serviceName + ": " + status);\n\t\t\t//abort application\n\t\t\tthrow(new Error("Fatal error", 0));\n\t\t}\n\t\telse\n\t\t{\n\t\t\ttrace("Error in " + serviceName + ": " + status);\n\t\t}\n\t}\n\telse\n\t{\n\t\ttrace(serviceName + " created for locale ID: " + localeID);\n\t}\n}\n'})}),"\n",(0,i.jsx)(t.p,{children:"First the setLocale() method creates a LocaleID object. This object makes it\neasier to get details about the actual locale later, if needed."}),"\n",(0,i.jsx)(t.p,{children:"Next it creates new NumberFormatter, CurrencyFormatter, and DateTimeFormatter\nobjects for the locale. After creating each formatter object it calls the\ntraceError() method. This method displays error and warning messages in the\nconsole if there is a problem with the requested locale. (A real application\nshould react based on such errors rather than just tracing them)."}),"\n",(0,i.jsx)(t.p,{children:"After creating the CurrencyFormatter object, the setLocale() method sets the\nformatter's currency ISO code, currency symbol, and fractionalDigits properties\nto previously determined values. (Those values are set each time the user\nselects a new market from the Markets combo box)."}),"\n",(0,i.jsx)(t.p,{children:"After creating the DateTimeFormatter object, the setLocale() method also\nretrieves an array of localized month name abbreviations."}),"\n",(0,i.jsx)(t.h2,{id:"formatting-the-data",children:"Formatting the data"}),"\n",(0,i.jsx)(t.p,{children:"The formatted stock data is presented in a DataGrid control. The DataGrid\ncolumns each call a label function that formats the column value using the\nappropriate formatter object."}),"\n",(0,i.jsx)(t.p,{children:"In the Flash version, for example, the following code sets up the DataGrid\ncolumns:"}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{children:'var col1:DataGridColumn = new DataGridColumn("ticker");\ncol1.headerText = "Company";\ncol1.sortOptions = Array.NUMERIC;\ncol1.width = 200;\n\nvar col2:DataGridColumn = new DataGridColumn("volume");\ncol2.headerText = "Volume";\ncol2.width = 120;\ncol2.cellRenderer = RightAlignedCell;\ncol2.labelFunction = displayVolume;\n\nvar col3:DataGridColumn = new DataGridColumn("price");\ncol3.headerText = "Price";\ncol3.width = 70;\ncol3.cellRenderer = RightAlignedCell;\ncol3.labelFunction = displayPrice;\n\nvar col4:DataGridColumn = new DataGridColumn("change");\ncol4.headerText = "Change";\ncol4.width = 120;\ncol4.cellRenderer = RightAlignedCell;

1\ncol4.labelFunction = displayPercent;\n'})}),"\n",(0,i.jsx)(t.p,{children:"The Flex version of the example declares its DataGrid in MXML. It also defines\nsimilar label functions for each column."}),"\n",(0,i.jsx)(t.p,{children:"The labelFunction properties refer to the following functions, which call\nformatting methods of the Localizer class:"}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{children:"private function displayVolume(item:Object):String\n{\n\treturn localizer.formatNumber(item.volume, 0);\n}\n\nprivate function displayPercent(item:Object):String\n{\n"})}),"\n",(0,i.jsx)(t.p,{children:"return localizer.formatPercent(item.change )  ;"}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{children:"}\n\nprivate function displayPrice(item:Object):String\n{\n\treturn localizer.formatCurrency(item.price);\n}\n"})}),"\n",(0,i.jsx)(t.p,{children:"The Localizer methods then set up and call the appropriate formatters:"}),"\n",(0,i.jsx)(t.pre,{children:(0,i.jsx)(t.code,{children:'public function formatNumber(value:Number, fractionalDigits:int = 2):String\n{\n\tnf.fractionalDigits = fractionalDigits;\n\treturn nf.formatNumber(value);\n}\n\npublic function formatPercent(value:Number, fractionalDigits:int = 2):String\n{\n\t// HACK WARNING: The position of the percent sign, and whether a space belongs\n\t// between it and the number, are locale-sensitive decisions. For example,\n\t// in Turkish the positive format is %12 and the negative format is -%12.\n\t// Like most operating systems, flash.globalization classes do not currently\n\t// provide an API for percentage formatting.\n\tnf.fractionalDigits = fractionalDigits;\n\treturn nf.formatNumber(value) + "%";\n}\n\npublic function formatCurrency(value:Number):String\n{\n\treturn cf.format(value, symbolIsSafe);\n}\n\npublic function formatDate(dateValue:Date):String\n{\n\treturn df.format(dateValue);\n}\n'})})]})}function h(e={}){const{wrapper:t}={...(0,r.R)(),...e.components};return t?(0,i.jsx)(t,{...e,children:(0,i.jsx)(d,{...e})}):d(e)}},28453(e,t,n){n.d(t,{R:()=>l,x:()=>o});var a=n(96540);const i={},r=a.createContext(i);function l(e){const t=a.useContext(r);return a.useMemo(function(){return"function"==typeof e?e(t):{...t,...e}},[t,e])}function o(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:l(e.components),a.createElement(r.Provider,{value:t},e.children)}}}]);