Flex技巧收集

1、让Label、Text中的文本自动换行：

???? <mx:Label id="lab" creationComplete="{lab.mx_internal::getTextField().wordWrap = true;}"/>

??? ?Text 标签同理

?

2、flex获得年月日:?

??? ? var date:Date = new Date();
???? ?var df:DateFormatter = new DateFormatter();
???? ?df.formatString = 'YYYY-MM-DD HH:NN:SS';
???? ?trace(df.format(date));
??? --------------------------------------------------------------------------

??? 格式化时间戳：1314063166171 （自 1970 年 1 月 1 日午夜以来的毫秒数。）
??? flex 获得时间戳的方法是 new Date().getTime() 。
??? Date 的 getTime() 方法 是 自 1970 年 1 月 1 日午夜以来的毫秒数。
??? getTime() 得到的时间毫秒数跟 java 和 php 等得到的毫秒数是一样的。
??? 格式化毫秒数的方法：
??? var df:DateFormatter = new DateFormatter();??? ??? ??? ??? ???
??? df.formatString = 'YYYY-MM-DD HH:NN:SS';? // 1314063166171
??? trace(" 格式化时间戳 = ",df.format(new Date()));??? //当前时间
??? trace(" 格式化时间戳 = ",df.format(new Date(1314063166171)));? //已有时间
?? ?注意：new Date()中的数字不能为String 类型。类型为String转化会有问题。???

??

3、ArrayCollection 数据

??private var tempArr:ArrayCollection = new ArrayCollection(?
????[?
?????{date:"2011-3-4",type:"[flex]",title:"flex开发"},
?????{date:"2011-3-4",type:"[java]",title:"java开发"},type:"[php]",title:"php开发"},
????]?
???);
4、屏幕分辨率相关
?? Capabilities
Capabilities 类提供一些属性，这些属性描述了承载 SWF 文件的系统和播放器。例如，手机屏幕可以有 100 个正方形像素（黑白），而 PC 屏幕则可以有 1000 个正方形像素（彩色）。通过使用 Capabilities 对象来确定用户所拥有的设备的类型，可以向尽可能多的用户提供适当的内容。如果熟悉设备的功能，则可以通知服务器发送合适的 SWF 文件，或是通知 SWF 文件变更其播放方式。

可使用 GET 或 POST HTTP 方法发送功能信息，这些信息作为一个 URL 编码的字符串存储在 Capabilities.serverString 属性中。下例显示了支持 MP3、具有 1600 x 1200 像素分辨率、运行 Windows XP 并且安装有输入法编辑器 (IME) 的计算机的服务器字符串：

A=t&SA=t&SV=t&EV=t&MP3=t&AE=t&VE=t&ACC=f&PR=t&SP=t&     SB=f&DEB=t&V=WIN%209%2C0%2C0%2C0&M=Adobe%20Windows&     R=1600x1200&DP=72&COL=color&AR=1.0&OS=Windows%20XP&     L=en&PT=External&AVD=f&LFD=f&WD=f&IME=t
【 FlexGlobals? 出自于 Flex4 】

5、自动更新界面组件大小，如：
   ViewStack 设置 resizeToContent="true"

6、获得Text组件的行数和列数 var numLines:int = summaryText.mx_internal::getTextField().numLines;
var lineLength:int = summaryText.mx_internal::getTextField().getLineLength(numLines - 1);

7、Embed 嵌入资源

   1）<mx:Image id="myLogo" source="@Embed('assets/logo.png')"/>

   2）[Embed("/assets/report/reportLibrary/pdf.png")]
??   ?public var pdfIcon:Class;

8、通过两开时间戳来计算其之间相差的天数

? ????var begin:Number? =? 128672640032;

?????var end:Number? =? 1318175999328;
???? var count:int= (end - begin)/60/60/1000/24 + 1;

9、加载外部 swf? 样式文件
????? var event:IEventDispatcher = StyleManager.loadStyleDeclarations(" assets/compStyle.swf",true);
?? ? ?event.addEventListener(StyleEvent.COMPLETE,loadStyleHandler);

???? ----------------------------------------------------------------------------------

???? private function loadStyleHandler(event:StyleEvent):void
??? {
???????? ?trace("load swf style?css finish");?
?? ?}

10、将组件的 【属性】提取成为【样式】

?????? 1）作为 .as 文件来做：

?????? package com.comps
????? {
??????????? ?import mx.containers.VBox;

???????????? [Style(name="heightStyle",type="Number",format="uint",inherit="no")]
??????????? ?public class MyVBox extends VBox
??????????? {
???????????????? ?public function MyVBox()
?????????????????{
????????????????? }
???????????????? override public function styleChanged(styleProp:String):void
??????????????? ?{
??????????????????? ???super.styleChanged(styleProp);
????????????????????? ?var heightNum:Number;
???????????????????? ??switch (styleProp){
??????????????????? ???case "heightStyle":
??????????????????????????? ??heightNum = this.getStyle( styleProp ) as?Number;

????????????????????????????? this.height = heightNum;
??????????????????????????????break;

????????????????????? ??}
????????????????????????this.invalidateDisplayList();
???????????????? }
??????????? }
???????}
???? 2)作为组件来做：

?????? <?xml version="1.0" encoding="utf-8"?>
?????? <mx:HBox xmlns:mx=" http://www.adobe.com/2006/mxml" width="100%" height="100%">
????????? ?<mx:Metadata>
??????????????? [Style(name=" heightStyle",format="Number",inherit="no")]
????????? ?</mx:Metadata>
????????? ?<mx:Script>
?????????????? ?<![CDATA[
??????????????????? ?/**
???????????????????? ?* 重写styleChanged事件，处理combobox样式
?????????????????? ?? */
?????????????????? ?public override function styleChanged(styleProp:String):void
????????????????? ?{
?????????????????????? ?super.styleChanged( styleProp );
?????????????????????? ?var heightNum:Number;
??????????????????????? switch( styleProp )
??????????????????????? {
????????????????????????? ???case "heightStyle":
???????????????????????????????? ?heightNum? = getStyle( styleProp ) as Number
??????????????????????????????? ??if(? heightNum != 0 )
?????????????????????????????????{
????????????????????????????????????? ?this.height = heightNum;
?????????????????????????????????}
??????????????????????????????? ?break;
???????????????????????? }
??????????????????? }
?????????????? ?]]>
?????????? </mx:Script>
???????? </mx:HBox>

11、DataGrid??设置表头背景、?设置表头坚线 样式

DataGrid
{
??? ??/**? 表头竖线 **/?

? ?? vertical-locked-separator-skin:Embed?

???????????????????????????????????(source="/assets/components/dg/Headerseparator.png");
????? header-separator-skin: Embed('/assets//components/dg/Headerseparator.png');

??? ??/** 表头背景 **/
??????header-background-skin:Embed(source="/assets/components/dg/Header.png",

??????????????????????????????????????????????????????? scaleGridLeft=3,
????????????????????????????????????????????????????? ??scaleGridRight=12,
??????????????????????????????????????????????????????? scaleGridTop=3,
????????????????????????????????????????????????????????scaleGridBottom=22);
}

????

12、遍历 Dictionary 数据

??????? var arr:Array = new Array();

??????? for each ( var obj:Object in dictionary){

????????????? arr.push(obj);

????????}

13、字符串替换

?????? 原文引自：http://bbs.9ria.com/viewthread.php?tid=106303

??? ??????? private function testFlexStringReplaceAll():void {
var strSource:String = "Li_guo_Liang.com";
trace(strSource + " - " + replaceAllBySplit(strSource,"_",""));
trace(strSource + " - " + replaceAllByRegex(strSource,""));
}

/**
* Repalce all by split and join;
*/
public static function replaceAllBySplit(strSource:String,strReplaceFrom:String,strRepalceTo:String):String {
return strSource == null ? null : strSource.split(strReplaceFrom).join(strRepalceTo);
}

/**
* Replace all by RegEx;
*/
public static function replaceAllByRegex(strSource:String,strRepalceTo:String):String {
return strSource == null ? null : strSource.replace(new RegExp(strReplaceFrom,'g'),strRepalceTo);
}

14、 flex AxisRenderer的轴样式 （Flex图表的坐标轴样式）

???? AxisRenderer的预定义轴样式

???????? 打开AxisRenderer的源码，可以发现AxisRenderer类有七个预定义样 式：verticalAxisStyle，blockNumericAxis，linedNumericAxis，dashedNumericAxis，blockCategoryAxis，hangingCategoryAxis，dashedCategoryAxis。 对于NumericAxis，横轴默认的样式为hangingCategoryAxis，纵轴的样式为blockNumericAxis；对于 CategoryAxis，横轴默认的样式为hangingCategoryAxis，纵轴的样式为blockCategoryAxis。这些样式在早期 的Flex版本中也出现过，不过自从Flex 2.0后就被隐藏起来了。

?以上内容出自：http://www.riaqx.com/a/Flexwendang/jichuwendang/2010/1130/643.html

? 坐标轴样式演示，引自：http://www.9flex.com/archives/77/

15、下载相关

protected?function?download_clickHandler():void
{
var?fileurl:String;
//链接地址字符串中混乱的字符的处理??--开始
fileurl?=?decodeURI(_articleMessage.fileurl);
fileurl?=?fileurl.replace(new?RegExp("%2F",?"g"),?"/");
fileurl?=?fileurl.replace(new?RegExp("%3A",?":");
//链接地址字符串中混乱的字符的处理??--结束
var?fileRef:FileReference?=?new?FileReference;
var?urlRequest:URLRequest?=?new?URLRequest(fileurl);
fileRef.download(urlRequest);
}

16、内存泄漏相关

1. 引用泄露：对子对象的引用，外部对本对象或子对象的引用都需要置null；
2. 系统类泄露：使用了系统类而忘记做删除操作了，如BindingUtils.bindSetter()，ChangeWatcher.watch()函数时候完毕后需要调用ChangeWatcher.unwatch()函数来清除引用 ，否则使用此函数的对象将不会被删除；
类似的还有MUSIC，VIDEO，IMAGE，TIMER，EVENT，BINDING等。
3. 效果泄露：当对组件应用效果Effect的时候，当本对象本删除时需要把本对象和子对象上的Effect动画停止掉，然后把Effect的target对象置null; 如果不停止掉动画直接把 Effect置null将不能正常移除对象。
4. SWF泄露：要完全删除一个SWF要调用它的unload()方法并且把对象置null;
5. 图片泄露：当Image对象使用完毕后要把source置null;(为测试)；
6. 声音、视频泄露: 当不需要一个音乐或视频是需要停止音乐，删除对象，引用置null;

内存泄露解决方法：
1. 在组件的REMOVED_FROM_STAGE事件回掉中做垃圾处理操作（移除所有对外引用（不管是VO还是组件的都需要删除），删除监听器，调用系统类的清除方法）
先remove再置null,确保被remove或者removeAll后的对象在外部的引用全部释放干净;
2. 利用Flex的性能优化工具Profile来对项目进程进行监控，可知道历史创建过哪些对象，目前有哪些对象没有被删除，创建的数量，占用的内存比例和用量，创建过程等信息；

详细出处参考： http://www.aspzz.cn/article/13736.htm

17、浏览器相关

?????? 1. Flex打开一个新浏览器窗口

???????? ?navigateToURL(newURLRequest('http://ntt.cc'),'_blank');

????? 2. 刷新浏览器

????????? navigateToURL(newURLRequest("javascript:location.reload();"),"_self")

????? 3. 关闭浏览器

????????? navigateToURL(newURLRequest("javascript:window.close()"),"_self");

18、Flex设置Alert容口的背景为透明

19、取随机颜色

???? ???lbl.setStyle('color',0xffffff*Math.random());

20、消除锯齿（字体锯齿）flash

创建抗锯齿文本有多种算法,但最终的办法是使用字体颜色阴影(useshadesofthefontcolor)平滑曲线(smoothcurves)和弯曲角度(corners)(butultimatelytheideaistouseshadesofthefontcolortosmoothcurvesandcornersofthetext)。对于字体的抗锯齿方法，要记住,所有的字体都使用是不必要的。抗锯齿技术不能运用于设备字体中(Anti-aliasingcannotbecontrolledindevicefonts)

21、动态创建的datagrid中如何使用sortCompareFunction

方法：

dgColumn.sortCompareFunction=sortFunc( item.@columnName);

使用：

private static function sortFunc(field:String):Function{?????????????????????????
????????????????????????? return function(obj1:Object,obj2:Object):int{
????????????????????????????????? return ObjectUtil.numericCompare(obj1[field],obj2[field]);
????????????????????????? }
????????????????? }

22、多module 切换问题

http://www.blogjava.net/caizh2009/archive/2009/08/19/291784.html

23、 Flash Build 4编译慢、报java heap space 堆空间异常错误的解决方法：
?1)、在安装路径下找到FlexBuilder.ini文件，进行编辑，加入如下参数
-vmargs
-Xms128m
-Xmx512m
-XX:MaxPermSize=256m
-XX:PermSize=64m #不要设置太高，否则会更加慢
-Djava.net.preferIPv4Stack=true
以上几条经验可以明显加快编译速度数倍，第3条可以明显减低FB挂掉的几率。（ 最后一句也很重要）
2)、由于Flex Builder compiler shell有memory leak的问题， 而SDK默认的的 JVM heap size 只有384M，当compile比较大的project容易不够，所以只要修改SDK的JVM参数就可以。
编辑 {Flex SDK}安装路径/bin/jvm.config 文件如下。
java.args=-Xmx512m -Dsun.io.useCanonCaches=false
如果还是有Error，可以增加到1024或者更多。
注：我的flex4.5安装路径中的sdk位置：F:AdobeAdobe Flash Builder 4.5sdks4.5.1binjvm.config在这里调整即可！

??????? Matrix 不是遮罩，mask才是用来做遮罩的。通过使用容器的mask属性来实现遮罩 。

25、设置tooltip字体

? ? 第一种：通过代码

1. StyleManager.getStyleDeclaration("ToolTip").setStyle("fontSize",12);??
2. StyleManager.getStyleDeclaration("ToolTip").setStyle("backgroundColor","#ff0000");?

? ? ?ToolTip{

fontSize: 12;

? ? ?}

26、flex4文本引擎

? ??Text Layout Framework

? ?? http://labs.adobe.com/technologies/textlayout/demos/

? ??http://labs.adobe.com/technologies/textlayout/

27、flex图文混排

应用Flex：
? 1. flex的话可以看看这个博客： http://blog.csdn.net/songhuanren/archive/2008/04/19/2308141.aspx 是用flex 4实现的。
? 2. 再有就是一个组件是谷歌code上边的实现聊天窗口图文混排： http://code.google.com/p/riaidea/wiki/RichTextField 。如果应用到博客等之类上的图文混排可能要修改一下源码。JS：
如果以上都不合适可以试试用js版的！这里有19款js富文本编辑器： http://paranimage.com/19-javascript-rich-text-editor/
嵌入Iframe组件用这个组件去载入js文本编辑器然后flex和js交互读取文本框内内容；
Iframe组件有2个，1： http://code.google.com/p/flex-iframe/
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? 2： http://www.zhuoqun.net/html/y2006/359.html （一个老外写的在flex内显示html，Dreamer这个博客也挺不错很多东西挺实用的）

28、根据组件属性是否改变在下一秒刷新组件