加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 （https://www.lidatong.com.cn/）- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置： 首页 > 百科 > 正文

Flex笔记_格式化数据

发布时间：2020-12-15 03:39:22 所属栏目：百科 来源：网络整理
导读：格式化程序（formatter） 是一类对象，它们可以接收原始数据，并将其转换为可展示的格式。 用法上同验证器在实现机制上比较类似。 应用模式有下列两种： 实时格式化； 脚本式格式化 用法简单，输入原始数据，就会输出结构清晰，容易认读的格式化数据。 内置

格式化程序（formatter）

  • 是一类对象，它们可以接收原始数据，并将其转换为可展示的格式。
  • 用法上同验证器在实现机制上比较类似。
  • 应用模式有下列两种：
  1. 实时格式化；
  2. 脚本式格式化
  • 用法简单，输入原始数据，就会输出结构清晰，容易认读的格式化数据。

内置的格式化程序


Formatter

  • 所有专用格式化程序的父类，可以作为其它格式化程序的模板。
  • format函数：接收一个需要被格式化的对象，返回string类型的结果。
  • error属性

NumberFormatter

  • 用来处理数值表示的细节，如小数的精度，很用作千分位分隔符的字符。
  • decimalSeparatorFrom、decimalSeparatorTo、precision、rounding、thousandSeparatorFrom、thousandSeparatorTo、useNegativeSign、useThousandSeparator
  • 额外的错误消息：Invalid Value、Invalid Format 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
<fx:XML id="myData" xmlns="">
<root>
<forsale>
<item name="weight" value="32.5x698"/>
</forsale>
</root>
</fx:XML>

<mx:NumberFormatter id="fmtNumber" precision="2" rounding="up"/>
</fx:Declarations>
<s:VGroup>
<s:Label text="Weight {fmtNumber.format(myData.forsale.item.@value)} lbs"/>
<s:Label text="{fmtNumber.error}"/>
</s:VGroup>
</s:Application>

CurrencyFormatter

  • 插入预定义的货币符号，并在适当的位置插入千分位分隔符，将数据组织成公认的货币表示形式。
  • 包括两个特定于货币的属性：alignSymbol指定在输出字符串的什么位置放置货币符号、currencySymbol指定输出字符串中使用的货币符号。
  • 具有同NumberFormatter同样的错误消息。 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Declarations>
<!-- 将非可视元素（例如服务、值对象）放在此处 -->
<fx:XML id="myData" xmlns="">
<root>
<forsale>
<item name="Laptop" value="599.999"/>
</forsale>
</root>
</fx:XML>
<mx:CurrencyFormatter id="fmtCurrency" precision="2"/> 
</fx:Declarations>
<s:VGroup>
<s:Label text="Laptop Price {fmtCurrency.format(myData.forsale.item.@value)}"/>
<s:Label text="{fmtCurrency.error}"/>
</s:VGroup>
</s:Application>

DateFormatter

  • 控制输出日期的显示方式。
  • formatString属性，如YYYY/MM/DD，取值定义：
  1. Y：年， YY,YYYY
  2. M: 月， M，MM， MMM（三个字符的英文月份表示），MMMM（完整的英文月份表示）
  3. D：天， D，DD
  4. E：周几， 周日为0， E，EE，EEE（三个字符的英文周几表示），EEEE（完整的英文周几表示）
  5. A：上午下午， AM，PM
  6. J：24小时格式的小时，0表示第一小时， J，JJ
  7. H：24小时格式的小时，1表示第一小时， H，HH
  8. K：12小时格式的小时，0表示第一小时， K，KK
  9. L：12小时格式的小时，0表示第一小时， L，LL
  10. N：分，N，NN
  11. S：秒，S，SS
  12. 其它字符
  • 错误消息：Invalid Value、Invalid Format 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">


<fx:Script>
<![CDATA[
[Bindable]
public var sDate:String = "12/01/08 12:42";
[Bindable]
public var dDate:Date = new Date("12/01/08 12:42");
]]>
</fx:Script>
<fx:Declarations>
<mx:DateFormatter id="fmtDate" formatString="YY/MM/DD"/>
</fx:Declarations>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="Formatting the Date as a String:{fmtDate.format(sDate)}"/>
<s:Label text="Formatting the Date as a Date object:{fmtDate.format(dDate)}"/>
</s:VGroup>
</s:Application>

综合使用DateFormatter和XML 

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">


<fx:Declarations>
<fx:XML id="myData">
<root>
<info>
<item lastVisit="12/01/08 12:42"/>
</info> 
</root>
</fx:XML>
<mx:DateFormatter id="fmtDate" formatString="YY/MM/DD"/>
</fx:Declarations>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="{fmtDate.format(myData.info.item.@lastVisit)}"/>
</s:VGroup>
</s:Application>
注意：上述代码没有输出结果是因为Flex内部会把XML转换成一组高级对象，既不是Date也不是String，而format函数只接受这两种对象作为参数，因此代码需要做如下修改：
<s:Label text="{fmtDate.format(String(myData.info.item.@lastVisit))}"/>

PhoneFormatter

  • formatString属性，应用于电话号码的格式
  • areaCode属性，Number型，默认值为-1，表示忽略此项，再输入10位电话号码的情况下，用来指定一个区号。
  • areaCodeFormat属性，String型，定义如何表示区号，默认值为（###）
  • validPatternChars属性，String型，可以在formatString中使用的一组字符。字符#用于表示一个数字位。默认字符为+、（、）、#和-。
  • 模式示例：
????????????###-##-####、(###)-###-####、###.###.####、#-###-###-####、+##-########
  • 错误消息：Invalid Value、Invalid Format 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">


<fx:Declarations>
<fx:XML id="myData">
<root>
<contactlist>
<item name="contact" phone="2016679872"/>
</contactlist>
</root>
</fx:XML>
<mx:PhoneFormatter id="fmtNumber" formatString="(###) ###-####"/>
</fx:Declarations>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="Contact Phone:{fmtNumber.format(myData.contactlist.item.@phone)}"/>
</s:VGroup>
</s:Application>

ZipCodeFormatter

  • 主要用于格式化美国邮政编码和加拿大邮递区号。
  • formatString属性，默认值##### 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">


<fx:Declarations>
<fx:XML id="myData">
<root>
<contacts>
<item name="Leo" zipcode="953763233"/>
</contacts>
</root>
</fx:XML>
<mx:ZipCodeFormatter id="fmtZipCode" formatString="#####-####"/>
</fx:Declarations>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="Zip Code:{fmtZipCode.format(myData.contacts.item.@zipcode)}"/>
</s:VGroup>
</s:Application>

SwitchSymbolFormatter

  • 通用的格式化程序，用于处理Flex内置格式化程序不适用的数据。
  • 与内置的格式化程序的不同在于，它对要处理的数据类型的上下文信息缺乏了解，因此用途有一定的局限性。
  • 可以使用SwitchSymbolFormatter创建自定义格式化程序。
  • 没有相应的MXML组件，但可以使用其ActionScript版本。
  • 默认构造函数SwitchSymbolFormatter接收一个表示用作数字占位符的字符值。默认为#。
  • formatValue方法接收一个格式化字符串和一个源对象引用的组合。
  • 没有特定的错误消息。 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import mx.formatters.SwitchSymbolFormatter;
public var fmtSymbol:SwitchSymbolFormatter
= new SwitchSymbolFormatter("#");
public function formatMe(rawData:String):String {
return fmtSymbol.formatValue("####-####",rawData);
}
]]>
</fx:Script>
<fx:Declarations>
<fx:XML id="myData">
<root>
<workorders>
<item name="Fix something" id="99818382"/>
</workorders>
</root>
</fx:XML>
</fx:Declarations>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="Workorder:{formatMe(myData.workorders.item.@id)}"/>
</s:VGroup>
</s:Application>

实时格式化

脚本格式化

  • 结合使用函数与格式化程序组件
  • 结合使用函数与格式化程序类

处理格式化错误

  • 如果格式化过程顺利，error属性的值为空；
  • 如果格式化遇到问题，那么error属性中就会保存有相应的错误代码。 
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  xmlns:s="library://ns.adobe.com/flex/spark" 
  xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Script>
<![CDATA[
import mx.controls.Alert;
import mx.formatters.*;

public function formatThis(plainText:String):String {
var fmtPhone:PhoneFormatter = new PhoneFormatter();
var formatedString = fmtPhone.format(plainText);
if(fmtPhone.error == "Invalid value") {
Alert.show("Invalid...");
} else if(fmtPhone.error == "Invalid format") {
Alert.show("Invalid Format");
}
return formatedString;
}
]]>
</fx:Script>
<s:VGroup verticalCenter="0" horizontalCenter="0" horizontalAlign="center">
<s:Label text="{formatThis('222')}"/>
</s:VGroup>
</s:Application>

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
    相关内容
      推荐文章
        站长推荐
        热点阅读

          【免责声明】本站内容转载自互联网，其发布内容言论不代表本站观点，如果其链接、内容的侵犯您的权益，烦请提交相关链接至邮箱bqsm@foxmail.com我们将及时予以处理。

          建议您使用1920×1080分辨率、谷歌浏览器Google Chrome、Microsoft Edge以获得本站的最佳浏览效果

          Copygight © 2008-2022 https://www.lidatong.com.cn/ All Rights Reserved. 李大同