Now, Let's talk about Flex3/Moxie! - Part Ⅰ

自從Ted上周說要發布一些Flex3/Moxie的細節，我就在一直關注，今天終于讓我看到了傳說中的Flex3/Moxie哦！一直以來，個人總覺得一個好的FLEX高手并不一定能制造出一個好的作品，很大一部分原因是在給用戶豐富體驗的同時不能給客戶帶來視覺沖擊，所以一直曾考慮應該專門招一名美工設計師來完成最后的美化工作。Flex3/Moxie畢竟是出自設計世家Adobe的東西，Ted's Monday讓我們繼續看到了Better Design:

Skin Importer:
可以從圖片文件夾，SWC,SWF導入到Flex3/Moxie Project。今天你導了么？

Design View Zoom/Pan:
這東西能讓你放大版面，做更好的布局工作。今天你對齊了么？

Design Mode support for ItemRenderers:
顧名思義，Design Mode支持了List,HorizontalList,TileList,Tree,DataGrid等的itemRenderers，并支持靜態數據在上面的顯示。今天你愛騰了么？

Advanced Constraints:
mx:ConstraintRow & mx:ConstraintColumn將會是新的玩意，會讓東西布局可以再細分化。今天你還是瘋（分）的么？

CS3 Suite integration:
Flash CS3 Skinning
Illustrator CS3 Skinning
PhotoShop CS3 Skinning
Fireworks CS3 Skinning
FireWorks CS3 - Flex components & Save as MXML/CSS
Flash CS3 - Flex Component Kit (Container support coming)
Skin Importer - See Above
又是廣告？今天你看了么？

CSS Outline:
CSS大綱，一個Application下面有怎么樣的CSS，一個BUTTON下面有怎么樣的CSS，完全可以看到。今天你還要偷窺么？

CSS Design View:
除了CSS Outline，還是有這個CSS的Design View，要注意的是，這可是個狠角色哦，這樣的話就不用每次要跑Flex 2 Style Explorer調這些破玩意啦。今天你調戲過Flex了么？

在Better Design的同時我可不太希望看到它的臃腫化，而且我還在繼續期待FLEX3（Moxie）在MemoryLeak的改進！

ActionScript3 Tip Of the Day Update!(Version 20070518)

以前就介绍过ActionScript3 Tip Of the Day，只要过了英语四级就不会有难度，这次的更新不仅是内容上的扩张和补充，最重要的是，作者已经为我们清楚得分好了章节，所以有些内容也是有重复的。

AS3 Tip Of the Day(2007.05.18Update)_DOC.rar

如果链接失效请访问http://pickup.mofile.com/1461452372613338

AS3 Tip Of the Day(2007.05.18Update)_PDF.rar

如果链接失效请访问http://pickup.mofile.com/9569555724114061

Announce: senocular has the real copyWrite!

通过DataField来正确处理DataGrid的ColumnIndex的变化

由于客户需求的不确定，我们常常会修改DataGrid里面的内容，时而多一列时而少一列，因此它引发了DataGrid的ColumnIndex的变化。
当我们在AcitonScript代码中对columnIndex进行判断时，常常会忘记改变columnIndex从而引发bug。


sample.mxml

<mx:DataGrid id="PersonInfoDG" dataProvider="{PersonInfo_ARRAY}">
<mx:columns>
<mx:Array>
<mx:DataGridColumn headerText="First Name" dataField="firstName"/>
<mx:DataGridColumn headerText="Last Name" dataField="lastName"/>
</mx:Array>
</mx:columns>
</mx:DataGrid>


sample.as

[Bindable]
private var PersonInfo_ARRAY:Array =
[{firstName:"aaa", lastName:"bbb"},
{firstName:"ccc", lastName:"ddd"}];

private function initListener():void {
PersonInfoDG.addEventListener(ListEvent.ITEM_DOUBLE_CLICK, doDoubleClick);
}

private function doDoubleClick(event:ListEvent):void {
if (event.rowIndex > 0) {
if(event.columnIndex == 1) {
Alert.show("It's Last Name Column!")
}
}
}




增加了Address字段

sample.mxml

<mx:DataGrid creationComplete="initListener()" id="PersonInfoDG" dataProvider="{PersonInfo_ARRAY}"
doubleClickEnabled="true">
<mx:columns>
<mx:Array>
<mx:DataGridColumn headerText="First Name" dataField="firstName"/>
<mx:DataGridColumn headerText="Address" dataField="address"/>
<mx:DataGridColumn headerText="Last Name" dataField="lastName"/>

</mx:Array>
</mx:columns>
</mx:DataGrid>


sample.as

[Bindable]
private var PersonInfo_ARRAY:Array =
[{firstName:"aaa", lastName:"bbb", address:"AB Road"},
{firstName:"ccc", lastName:"ddd", address:"CD Road"}];
private function initListener():void {
PersonInfoDG.addEventListener(ListEvent.ITEM_DOUBLE_CLICK, doDoubleClick);
}

private function doDoubleClick(event:ListEvent):void {
if (event.rowIndex > 0) {
if(event.columnIndex == 1) {
Alert.show("It's Last Name Column!")//It's Wrong! It has change to 2
}
}
}

那我们怎么样才能今可能得减少这种错误呢？我们发现，在columnIndex在跟着不断变化的同时，我们所要表示的内容一般是不变的。是的，我们可以通过字段dataField来进行判断，而且不会有影响。

private function doDoubleClick(event:ListEvent):void {
if (event.rowIndex > 0) {
for(var i:Number; i < PersonInfoDG.columns.length; i++) {
if(PersonInfoDG.columns[i].dataField == "lastName" && i == event.rowIndex) {
Alert.show("It's Last Name Column!")//It's Right! :)

Break;
}
}
}
}

What about .air mean?

Apollo's file's name just like apollo.air.
But What about .air mean?
I mean that:

mx_internal_uid的在数据传递时的重复解决方法

关于这个【mx_internal_uid】的问题，一直抽空想写出来，乘着今天日本那边休息，还是把它给记录下来吧，希望对其他的FLEX爱好者在碰到此类问题的时候有所帮助。

我们首先了解一下【mx_internal_uid】的概念：

uid : String---The unique identifier for this object

UID它一共有32位,其中通过 ActionScript's Math.random()来产生24位,后面的8位是current date-time来决定的 ，所以只要不要有中彩票的运气（24位的Math.random()，足球彩票才14场猜0.1.3...），再加上时间不停止，所以它无论如何也是在这世界上是唯一的 。

当我们对2个DataGrid进行传递信息直接的通信时候，我们会常常这么做：

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

<mx:Script>

<![CDATA[

import mx.utils.UIDUtil;

import mx.collections.ArrayCollection;

[Bindable]

public var dataArr:Array = [{label:"Red", data:"#FF0000"},

{label:"Green", data:"#00FF00"},

{label:"Blue", data:"#0000FF"}

];

[Bindable]

public var problemArr:Array = new Array();

private function addFromTopDG():void {

problemArr.push(fromDG.selectedItem);
//problemArr.push(ObjectUtil.copy(fromDG.selectedItem));

toDG.dataProvider = problemArr;


}

]]>

</mx:Script>

<mx:DataGrid id="fromDG" width="600" height="200" dataProvider="{dataArr}">

<mx:columns>

<mx:Array>

<mx:DataGridColumn width="300" dataField="mx_internal_uid"/>

<mx:DataGridColumn dataField="label"/>

<mx:DataGridColumn dataField="data"/>

</mx:Array>

</mx:columns>

</mx:DataGrid>

<mx:Button label="Add from Top_DG" click="addFromTopDG()"/>

<mx:DataGrid id="toDG" width="600" height="200" dataProvider="{problemArr}">

<mx:columns>

<mx:Array>

<mx:DataGridColumn width="300" dataField="mx_internal_uid"/>

<mx:DataGridColumn dataField="label"/>

<mx:DataGridColumn dataField="data"/>

</mx:Array>

</mx:columns>

</mx:DataGrid>

</mx:Application>

这时候我们会发现很奇怪的事情发生了，当我们对fromDG数据连续传输到toDG的时候，toDG的数据如果是相同的情况（如很多个Red），我们发现对数据我们用鼠标无法聚焦，仔细一看，原来是【mx_internal_uid】一样呀，从中，我们可以了解以下信息：

1.因为引用关系一直存在，所以传过来的东西是一直一样的。如果把toDG放在一个TitleWindow里传一次再关一次，即削除引用关系，它是没有问题的。

2.就算是ObjectUtil.copy(obj)，只要在引用关系还存在的情况下，它copy出来的uid竟然是一样的。那么这样的话Adobe要不要考虑一下重写这个方法呢？毕竟我要的只是里面的值一样而不要把UID一起传过来啊。

解决方法：

合理利用UIDUtil这个类为我们创造合理的UID。


private function addFromTopDG():void {

var obj:Object = ObjectUtil.copy(fromDG.selectedItem);

obj.mx_internal_uid = UIDUtil.createUID();

//这里千万不要直接fromDG.selectedItem.mx_internal_uid = UIDUtil.createUID();

//因为上面说过这样引用关系还存在。

(toDG.dataProvider as ArrayCollection).addItem(obj);

obj = null;//这个就靠自己的CODE 风格啦，不要也没关系



恩，这样问题就解决啦。

Flex SDK is Opening Source!

剛吃完飯，就去Flex Team逛了一會，發現了個猛報道。Adobe正在準備對Flex SDK開源！OMG!何等得舉動啊？Flex SDK將以Mozilla Public License (MPL)的形式，能讓FlexCoders下載，繼承開發或者上傳代碼。它會讓更多的人參與到Flex的開發來，而且會有更多的FlexComponent和FlexApplication，我們會更加的看到很多象Doug 這樣的“瘋子”。

我們將要看到的開源：
-Component Source（其實已經大部分的開源）
-MXMLC
-FDB
-AS3 Compiler

還是沒有開源：
-Flash Player
-Flex Builder
-LiveCycle Data Services
-Charting Component

Adobe Labs的Flex:Open Source

Flex:Open Source DiscussionGroup.

Flex Open Source FAQ

正面面对Microsoft SilverLight(WPF/E)！

首先转一下来自Matrix的新闻：

微软正式发布Flash杀手 命名为SilverLight

matrix 发表于 2007-04-17 08:42:35 作者:Matrix 来源:SilverLight


摘要:

微软日前在美国拉斯维加斯召开的全美广播协会会议上，宣布了其为Windows、Web以及设备上创建富媒体、丰富交互性的战略。并正式将WPF/E命名为Microsoft SilverLight。

　 　SilverLight是Windows PresentATIon Foundation的一个子产品，其利用了跨浏览器Web技术进行设计，以实现多操作系统，甚至是移动设备上的无缝运行。和Flash一样，WPF/E 是作为一个浏览器的插件，可以显示矢量图形、动画和视频。

Silverlight集成了多种现有Web技术和设备，它可以在Windows、Mac平台上运行，支持IE、Firefox，甚至Apple的Safari Web浏览器。而无需对现有的网站设计进行移植，甚至包括利用Adobe
Flash设计的内容。

　　至于SilverLight与Flash的区别，微软的一位高层人士曾这样描述：一个WPF/E程序“并不是传递给Flash播放器的一个编译好的二进制文件。”相反，所有的代码都是基于标准的，且图像都使用了XAML。

　　同时，与Flash的内容不方便搜索引擎收录不同，SilverLight是以DOM型式公开它的元素树，内容能很好被搜索引擎收录。

　　附：SilverLight产品介绍

　　1、Silverlight通过小巧的浏览器插件将视频、交互性内容以及其他应用融合在一起。该解决方案集成了强大的图像及图层技术，支持任何尺寸图像的无缝整合，并提供适合广播的图层技术，可以在图像上添加按钮、标题或是其他交互性内容。

　　2、 Silverlight允许利用WMV标准从高清设备向移动设备提供高质量视频和音频。此外，该工具通过Expression
Media Encoder以及Tarari公司的内建平台，支持15X的快速视频编码及硬件加速。

　　3、Silverlight支持多种平台，使用户能够方便的进行代码重用，并通过不同平台无缝的连接到Web。

　　4、Silverlight集成了多种现有Web技术和设备，这意味着它可以在任何服务器和发布平台上使用，而无需对现有的网站设计进行移植，甚至包括利用Adobe Flash设计的内容。

5、Silverlight采用了已在.NET 3.0和Vista中使用的XAML语言，这使得Web内容和桌面内容的开发语言一致，从而降低了开发费用。Silverlight还兼容大量其他标准和 现有技术，包括ASP.NET、AJAX以及.NET 3.0，这使得开发者可以根据现有标准，或是采用微软已成熟技术来开发基于Web的内容。

6、 此外，Silverlight为设计者和开发者提供大量的开发工具和开发环境支持。对设计者来说，Expression Design和Expression Blend软件可以创建可重用界面，Expression Web使得在符合W3C标准的网站开发中可以使用XHTML、XML、XSLT、CSS以及ASP.NET等工具。对开发者来说，基于Visual Studio的Web开发支持包括ASP.NET AJAX在内的技术，并支持JavaScript，C#，VB，Ruby以及Python等多种开发语言。

　　7、 Silverlight浏览器插件的安装程序简单，体积约为2Mb。当用户遇到使用Silverlight开发的网页时，可以迅速的安装这一插件。 Silverlight内建的视频及动画广告解决方案灵活性很高，当传输广播类型的视频或是动画广告时，不会影响视频的质量。而这一问题是现有技术普遍遇到的问题。

　　8、通过获艾美奖的Windows Media技术，传输流量可降低46%，并且和现有的Windows Media流量配置方案兼容。如果采用下一代Windows Server系统中的IIS媒体包，流量还将进一步下降。

　　9、Silverlight支持内容接入保护技术。无论在Windows还是Mac平台上，Silverlight都支持多种商业模型，包括订阅、租用、付费浏览或是预览等。

这不难发现SilverLight(WPF/E)利用Microsoft原本拥有的优势。

个人认为最帅的优势是在于SilverLight是以DOM型式公开它的元素树，内容能很好被搜索引擎收录，这方面我期待着Apollo对它的强有力的回应！

这几点优势就能挑战Flash/Flex/Apollo吗？

P.S: .air?air Jordan?air = atmosphere?no,no,no!air = ria = RIA = Rich Internet Applications!