Flex 学习小结（10）

1 在viewstack的导航中，如果用代码来切换选项卡时，可以不用selectedIndex,
而用selectedChild，比如选用lable="welcome"的pannel

<mx:Button label="welcome" click="viewstack.selectedChild=welcome"/>

2 rollover,rollout的效果
<mx:Image x="75" y="85" width="271" height="170" source="@Embed('assets/jacobs.jpg')"

rollOver="currentState='bookdetails'" rollOut="currentState=''"/>

3 <mx:SetEventHandler name="rollOut" target="{jason}" handler="currentState=''"/>
<mx:SetProperty target="{jason}" name="scaleX" value=".50"/>
<mx:SetProperty target="{jason}" name="scaleY" value=".50"/>
</mx:State>
这里对rollOut这个事件进行了自定义，target指定针对jason这个控件，处理的事件是改变其state(在

handler里处理），而<mx:SetProperty 真针对指定的目标控件，改变其属性，这里分别是scaleX,scaleY,改

变起长和宽
4 动画过度效果中，
<mx:Parallel targets="{[book,bookLink,title,isbn]}">
这里，指定[]内的组件都同时使用过渡效果

5 应用程序向组件传递参数：
先来看个组件：
<mx:Script>
<![CDATA[
[Bindable]
public var firstname:String;
[Bindable]
public var lastname:String;

]]>
</mx:Script>
<mx:Label text="{firstname}" id="txtfirstname"/>
<mx:Label id="txtlastname" text="{lastname}"/>
应用程序：
<mx:Script>
<![CDATA[

[Bindable]
public var name1:String="john";
[Bindable]
public var name2:String="smith";
]]>
</mx:Script>
<component:MyForm2 id="names" firstname="{name1}" lastname="{name2}" width="193"

height="141"/>
6 自定义事件：
<![CDATA[


private function clickHanler():void
{
var myEvent:Event=new Event("nameDataShared");
dispatchEvent(myEvent);
}
]]>
</mx:Script>
<mx:Metadata>
[Event(name="nameDataShared")]
</mx:Metadata>
<mx:Label text="name dispatcher" width="339" height="61"/>
<mx:Button label="Button" click="clickHanler()"/>
注意，这里定义了button的click的自定义事件，在<mx:Metadata>中，指定了这个click的事件的名
叫nameDataShared，并且在 clickHanler()中实例化这个事件，并用dispatchEvent把事件分发出去，
再来看调用：

private function sharedNameDataHander(evt:Event):void
{
shared="hello abc";
}
]]>
</mx:Script>
<component:Dispatcher x="57" y="75" nameDataShared="sharedNameDataHander(event)">
这里的nameDataShared="sharedNameDataHander(event)">，其实的作用就是相当于onclick了，
尝试把=号左边的nameDataShared换成onclick,你就明白了

7 httpservice连接xml，读取并显示到datagrid中去

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

creationComplete="bookData.send()">
<mx:HTTPService id="bookData" url="assets/books.xml"/>
<mx:DataGrid x="119" y="104" dataProvider="{bookData.lastResult.books.stock}">

</mx:DataGrid>

8 格式化某一裂的日期,比如要格式化datagrid中的日期一列，可以这样：
<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;

private function dateFormat(dateItem:Object,dateColumn:DataGridColumn):String{
return publishDate.format(dateItem[dateColumn.dataField]);
}
]]>
</mx:Script>
<mx:HTTPService id="bookData" url="assets/books2.xml"/>
<mx:DateFormatter id="publishDate" formatString="YYYY-MM-DD"/>
<mx:DataGrid x="10" y="92" dataProvider="{bookData.lastResult.books.stock}"

width="950">
<mx:columns>

<mx:DataGridColumn dataField="name" headerText="name"/>
<mx:DataGridColumn dataField="author" headerText="author name"/>
<mx:DataGridColumn dataField="publish_date" headerText="publishdate"

labelFunction="dateFormat"/>

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

9 在datagrid中嵌入控件
<mx:DataGridColumn dataField="review" headerText="review" editable="true"

itemEditor="mx.controls.TextArea"/>
如果要每行的该列都显示控件，itemEditor改为itemRenderer,假如要在datagrid
的某列中加入一个mx component ，则要改为：
<mx:DataGridColumn dataField="review" headerText="review" editable="true"

itemRenderer="ReviewForm" rendererIsEditor="true"/>，其中rendererIsEditor设置为
true，说明不单是读数据，还是要写数据。

10 datagrid中，当轮流点每行时，触发change事件，可以这样
change="changeHandler(event)">
private function changeHandler(evt:Event):void
{
bookname.text=evt.target.selectedItem.book_name;
authorname.text=evt.target.selectedItem.author;
coverpicture.source=evt.target.selectedItem.cover;

}
11 TREE的读取XML展开，并读取选择的结点展示的例子：
<mx:Script>
<![CDATA[
import mx.rpc.events.ResultEvent;

[Bindable]
private var treeXML:XMLList;
[Bindable]
private var selectedData:XML;

private function resultHandler(evt:ResultEvent):void
{
var result:XML=evt.result as XML;
treeXML=result..title as XMLList;

}
private function changeHandler(evt:Event):void
{
selectedData=myTree.selectedItem as XML;

}
]]>
</mx:Script>
<mx:HTTPService id="treeData" url="assets/bookTree.xml" resultFormat="e4x"

result="resultHandler(event)"/>
<mx:HBox x="0" y="31" width="900" >
<mx:Panel layout="absolute" id="leftPannel" title="swsdfdf">
<mx:Tree id="myTree" dataProvider="{treeXML}" labelField="@name"

change="changeHandler(event)"/>
</mx:Panel>
<mx:Panel height="{leftPannel.height}" id="rightPannel">
<mx:Form width="400">

<mx:FormItem label="book name">

<mx:Label text="mailto:%7BselectedData.@name%7D%22/>

</mx:FormItem>
</mx:Form>
</mx:Panel>
</mx:HBox>