Set up the formatters. : Formatter « Data Model « Flex






Set up the formatters.

    

<!--
Code from Flex 4 Documentation "Using Adobe Flex 4".

This user guide is licensed for use under the terms of the Creative Commons Attribution 
Non-Commercial 3.0 License. 

This License allows users to copy, distribute, and transmit the user guide for noncommercial 
purposes only so long as 
  (1) proper attribution to Adobe is given as the owner of the user guide; and 
  (2) any reuse or distribution of the user guide contains a notice that use of the user guide is governed by these terms. 
The best way to provide notice is to include the following link. 
To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-sa/3.0/

-->


    <!-- l10n/FormattingExample.mxml -->
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:s="library://ns.adobe.com/flex/spark"
    creationComplete="initApp(event)"
    chromeColor="{resourceManager.getUint('FormattingValues', 'CHROMECOLOR')}">
    <s:layout>
        <s:VerticalLayout />
    </s:layout>
    <fx:Declarations>
        <mx:DateFormatter id="dateFormatter"
            formatString="{resourceManager.getString('FormattingValues', 'DATE_FORMAT')}" />
        <mx:DateFormatter id="timeFormatter"
            formatString="{resourceManager.getString('FormattingValues', 'TIME_FORMAT')}" />
        <mx:CurrencyFormatter id="currencyFormatter"
            precision="{resourceManager.getInt('FormattingValues', 'CURRENCY_PRECISION')}"
            currencySymbol="{resourceManager.getString('FormattingValues', 'CURRENCY_SYMBOL')}"
            thousandsSeparatorTo="{resourceManager.getString('FormattingValues','THOUSANDS_SEPARATOR')}"
            decimalSeparatorTo="{resourceManager.getString('FormattingValues','DECIMAL_SEPARATOR')}" />
    </fx:Declarations>
    <fx:Script> 
        import mx.resources.ResourceBundle; 
        [Bindable] 
        private var locales:Array = [ "es_ES","en_US" ]; 
        [Bindable] 
        private var dateValue:String; 
        [Bindable] 
        private var timeValue:String; 
        [Bindable] 
        private var currencyValue:String; 
        private var d:Date = new Date(); 
        private function initApp(e:Event):void { 
            localeComboBox.selectedIndex = locales.indexOf(resourceManager.localeChain[0]); 
            applyFormats(e); 
            // Updating the localeChain does not reapply formatters. As a result, you must 
            // apply them whenever the ResourceManager's change event is triggered. 
            resourceManager.addEventListener(Event.CHANGE, applyFormats); 
        } 
        private function comboChangeHandler():void { 
            // Changing the localeChain property triggers a change event, so the 
            // applyFormats() method will be called whenever you select a new locale. 
            resourceManager.localeChain = [ localeComboBox.selectedItem ]; 
        } 
        private function applyFormats(e:Event):void { 
            dateValue = dateFormatter.format(d); 
            timeValue = timeFormatter.format(d); 
            currencyValue = currencyFormatter.format(1000); 
        } 
      </fx:Script>
    <fx:Metadata>
        [ResourceBundle("FormattingValues")] 
    </fx:Metadata>
    <mx:ComboBox id="localeComboBox" dataProvider="{locales}"
        change="comboChangeHandler()" />
    <mx:Form>
        <mx:FormItem label="Date">
            <mx:TextInput id="ti1" text="{dateValue}" />
        </mx:FormItem>
        <mx:FormItem label="Time">
            <mx:TextInput text="{timeValue}" />
        </mx:FormItem>
        <mx:FormItem label="Currency">
            <mx:TextInput text="{currencyValue}" />
        </mx:FormItem>
    </mx:Form>
</s:Application>

   
    
    
    
  








Related examples in the same category

1.Formatter ErrorFormatter Error
2.Data Formatting Using MXML FormattersData Formatting Using MXML Formatters
3.Formatting data with the formatter classesFormatting data with the formatter classes
4.Edit Event FormatterEdit Event Formatter
5.End Edit Event FormatterEnd Edit Event Formatter