Flex中TitleWindow傳值思路及實(shí)現(xiàn)
更新時(shí)間：2014年05月12日 10:59:00 作者：
這篇文章主要介紹了Flex中TitleWindow傳值思路及實(shí)現(xiàn),需要的朋友可以參考下
1、設(shè)計(jì)思路
（1）新建一個(gè)DataGrid，在其中最后一列加入三個(gè)按鈕：新增、修改和刪除；
（2）點(diǎn)擊新增按鈕，可以將表格新增一行；
（3）單擊“修改”按鈕，可以修改表格中該行的一些屬性；
（4）單擊“刪除”按鈕，會(huì)將表格中該行刪除。
2、實(shí)現(xiàn)步驟
（1）新建一個(gè)應(yīng)用程序，DataGrid.mxml
DataGrid.mxml：
<?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">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
//表格數(shù)據(jù)源綁定
private var grid:ArrayCollection = new ArrayCollection([
{number:"2014010101",name:"張三",sex:"男",age:"19"},
{number:"2014010102",name:"李思",sex:"女",age:"20"},
{number:"2014010103",name:"蔡華",sex:"男",age:"21"},
{number:"2014010104",name:"牛耳",sex:"女",age:"22"},
{number:"2014010105",name:"兆司",sex:"男",age:"18"},
{number:"2014010106",name:"胡柳",sex:"女",age:"19"},
{number:"2014010107",name:"劉斯",sex:"男",age:"20"},
{number:"2014010108",name:"孫陽(yáng)",sex:"女",age:"22"},
{number:"2014010109",name:"鄭武",sex:"男",age:"21"},
{number:"2014010110",name:"王雪",sex:"女",age:"20"},
{number:"2014010111",name:"胡柳",sex:"女",age:"19"},
{number:"2014010112",name:"劉斯",sex:"男",age:"20"},
{number:"2014010113",name:"孫陽(yáng)",sex:"女",age:"22"},
{number:"2014010114",name:"鄭武",sex:"男",age:"21"},
{number:"2014010115",name:"王雪",sex:"女",age:"20"}
]);
]]>
</fx:Script>
<mx:VBox width="100%" height="100%" paddingBottom="100" paddingLeft="100" paddingRight="100" paddingTop="100">
<mx:DataGrid id="dataGrid" dataProvider="{grid}" rowCount="{grid.length+1}" width="100%" textAlign="center">
<mx:columns>
<mx:DataGridColumn headerText="學(xué)號(hào)" dataField="number" id="stuNumber"/>
<mx:DataGridColumn headerText="姓名" dataField="name"/>
<mx:DataGridColumn headerText="性別" dataField="sex"/>
<mx:DataGridColumn headerText="年齡" dataField="age"/>
<mx:DataGridColumn headerText="操作">
<mx:itemRenderer>
<fx:Component>
<mx:HBox width="100%" paddingLeft="40">
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
/*添加按鈕事件函數(shù)*/
protected function addHandler(event:MouseEvent):void
{
var childWindow:ChildWindow = ChildWindow(PopUpManager.createPopUp(this,ChildWindow,true));
var point:Point = new Point(100,100);
childWindow.x = point.x + 400;
childWindow.y = point.y + 50;
}
/*修改按鈕事件函數(shù)*/
protected function updateHandler(event:MouseEvent):void
{
var updateWindow:UpdateWindow = UpdateWindow(PopUpManager.createPopUp(this,UpdateWindow,true));
var point:Point = new Point(100,100);
updateWindow.x = point.x + 400;
updateWindow.y = point.y + 50;
updateWindow.stuNo = event.currentTarget.selectedItem.content;
}
]]>
</fx:Script>
<mx:LinkButton label="新增" click="addHandler(event)"/>
<s:Label width="10"/>
<mx:LinkButton label="修改" click="updateHandler(event)"/>
<s:Label width="10"/>
<mx:LinkButton label="刪除"/>
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:VBox>
</s:Application>
（2）新建一個(gè)新增窗口組件，ChildWindow.mxml
ChildWindow.mxml：
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
close="closeHandler(event)" title="新增窗口">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
/*關(guān)閉按鈕函數(shù)*/
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
/*取消按鈕函數(shù)*/
protected function cancelHandler(event:MouseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<mx:VBox width="100%" height="100%" horizontalAlign="center">
<mx:Form borderStyle="solid" borderColor="#CCCCCC" width="100%">
<mx:FormHeading label="新增界面" fontSize="14"/>
<mx:FormItem label="學(xué)號(hào)：">
<s:TextInput id="stuNo" width="200"/>
</mx:FormItem>
<mx:FormItem label="姓名：">
<s:TextInput id="stuName" width="200"/>
</mx:FormItem>
<mx:FormItem label="性別：">
<s:TextInput id="stuSex" width="200"/>
</mx:FormItem>
<mx:FormItem label="年齡：">
<s:TextInput id="stuAge" width="200"/>
</mx:FormItem>
</mx:Form>
<mx:HBox width="100%" height="25">
<s:Label width="60"/>
<s:Button label="新增"/>
<s:Label width="48"/>
<s:Button label="取消" click="cancelHandler(event)"/>
</mx:HBox>
</mx:VBox>
</s:TitleWindow>
（3）新建一個(gè)修改界面組件，UpdateWindow.mxml
UpdateWindow.mxml：
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
close="closeHandler(event)" title="修改窗口">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
/*關(guān)閉按鈕函數(shù)*/
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
/*取消按鈕函數(shù)*/
protected function cancelHandler(event:MouseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<mx:VBox width="100%" height="100%" horizontalAlign="center">
<mx:Form borderStyle="solid" borderColor="#CCCCCC" width="100%">
<mx:FormHeading label="修改界面" fontSize="14"/>
<mx:FormItem label="學(xué)號(hào)：">
<s:TextInput id="stuNo" width="200"/>
</mx:FormItem>
<mx:FormItem label="姓名：">
<s:TextInput id="stuName" width="200"/>
</mx:FormItem>
<mx:FormItem label="性別：">
<s:TextInput id="stuSex" width="200"/>
</mx:FormItem>
<mx:FormItem label="年齡：">
<s:TextInput id="stuAge" width="200"/>
</mx:FormItem>
</mx:Form>
<mx:HBox width="100%" height="25">
<s:Label width="60"/>
<s:Button label="修改"/>
<s:Label width="48"/>
<s:Button label="取消" click="cancelHandler(event)"/>
</mx:HBox>
</mx:VBox>
</s:TitleWindow>
3、設(shè)計(jì)結(jié)果
（1）初始化時(shí)
（1）新建一個(gè)DataGrid，在其中最后一列加入三個(gè)按鈕：新增、修改和刪除；
（2）點(diǎn)擊新增按鈕，可以將表格新增一行；
（3）單擊“修改”按鈕，可以修改表格中該行的一些屬性；
（4）單擊“刪除”按鈕，會(huì)將表格中該行刪除。
2、實(shí)現(xiàn)步驟
（1）新建一個(gè)應(yīng)用程序，DataGrid.mxml
DataGrid.mxml：
復(fù)制代碼 代碼如下:
<?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">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
//表格數(shù)據(jù)源綁定
private var grid:ArrayCollection = new ArrayCollection([
{number:"2014010101",name:"張三",sex:"男",age:"19"},
{number:"2014010102",name:"李思",sex:"女",age:"20"},
{number:"2014010103",name:"蔡華",sex:"男",age:"21"},
{number:"2014010104",name:"牛耳",sex:"女",age:"22"},
{number:"2014010105",name:"兆司",sex:"男",age:"18"},
{number:"2014010106",name:"胡柳",sex:"女",age:"19"},
{number:"2014010107",name:"劉斯",sex:"男",age:"20"},
{number:"2014010108",name:"孫陽(yáng)",sex:"女",age:"22"},
{number:"2014010109",name:"鄭武",sex:"男",age:"21"},
{number:"2014010110",name:"王雪",sex:"女",age:"20"},
{number:"2014010111",name:"胡柳",sex:"女",age:"19"},
{number:"2014010112",name:"劉斯",sex:"男",age:"20"},
{number:"2014010113",name:"孫陽(yáng)",sex:"女",age:"22"},
{number:"2014010114",name:"鄭武",sex:"男",age:"21"},
{number:"2014010115",name:"王雪",sex:"女",age:"20"}
]);
]]>
</fx:Script>
<mx:VBox width="100%" height="100%" paddingBottom="100" paddingLeft="100" paddingRight="100" paddingTop="100">
<mx:DataGrid id="dataGrid" dataProvider="{grid}" rowCount="{grid.length+1}" width="100%" textAlign="center">
<mx:columns>
<mx:DataGridColumn headerText="學(xué)號(hào)" dataField="number" id="stuNumber"/>
<mx:DataGridColumn headerText="姓名" dataField="name"/>
<mx:DataGridColumn headerText="性別" dataField="sex"/>
<mx:DataGridColumn headerText="年齡" dataField="age"/>
<mx:DataGridColumn headerText="操作">
<mx:itemRenderer>
<fx:Component>
<mx:HBox width="100%" paddingLeft="40">
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
/*添加按鈕事件函數(shù)*/
protected function addHandler(event:MouseEvent):void
{
var childWindow:ChildWindow = ChildWindow(PopUpManager.createPopUp(this,ChildWindow,true));
var point:Point = new Point(100,100);
childWindow.x = point.x + 400;
childWindow.y = point.y + 50;
}
/*修改按鈕事件函數(shù)*/
protected function updateHandler(event:MouseEvent):void
{
var updateWindow:UpdateWindow = UpdateWindow(PopUpManager.createPopUp(this,UpdateWindow,true));
var point:Point = new Point(100,100);
updateWindow.x = point.x + 400;
updateWindow.y = point.y + 50;
updateWindow.stuNo = event.currentTarget.selectedItem.content;
}
]]>
</fx:Script>
<mx:LinkButton label="新增" click="addHandler(event)"/>
<s:Label width="10"/>
<mx:LinkButton label="修改" click="updateHandler(event)"/>
<s:Label width="10"/>
<mx:LinkButton label="刪除"/>
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
</mx:VBox>
</s:Application>
（2）新建一個(gè)新增窗口組件，ChildWindow.mxml
ChildWindow.mxml：
復(fù)制代碼 代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
close="closeHandler(event)" title="新增窗口">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
/*關(guān)閉按鈕函數(shù)*/
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
/*取消按鈕函數(shù)*/
protected function cancelHandler(event:MouseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<mx:VBox width="100%" height="100%" horizontalAlign="center">
<mx:Form borderStyle="solid" borderColor="#CCCCCC" width="100%">
<mx:FormHeading label="新增界面" fontSize="14"/>
<mx:FormItem label="學(xué)號(hào)：">
<s:TextInput id="stuNo" width="200"/>
</mx:FormItem>
<mx:FormItem label="姓名：">
<s:TextInput id="stuName" width="200"/>
</mx:FormItem>
<mx:FormItem label="性別：">
<s:TextInput id="stuSex" width="200"/>
</mx:FormItem>
<mx:FormItem label="年齡：">
<s:TextInput id="stuAge" width="200"/>
</mx:FormItem>
</mx:Form>
<mx:HBox width="100%" height="25">
<s:Label width="60"/>
<s:Button label="新增"/>
<s:Label width="48"/>
<s:Button label="取消" click="cancelHandler(event)"/>
</mx:HBox>
</mx:VBox>
</s:TitleWindow>
（3）新建一個(gè)修改界面組件，UpdateWindow.mxml
UpdateWindow.mxml：
復(fù)制代碼 代碼如下:
<?xml version="1.0" encoding="utf-8"?>
<s:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300"
close="closeHandler(event)" title="修改窗口">
<s:layout>
<s:BasicLayout/>
</s:layout>
<fx:Script>
<![CDATA[
import mx.events.CloseEvent;
import mx.managers.PopUpManager;
/*關(guān)閉按鈕函數(shù)*/
protected function closeHandler(event:CloseEvent):void
{
PopUpManager.removePopUp(this);
}
/*取消按鈕函數(shù)*/
protected function cancelHandler(event:MouseEvent):void
{
PopUpManager.removePopUp(this);
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 將非可視元素（例如服務(wù)、值對(duì)象）放在此處 -->
</fx:Declarations>
<mx:VBox width="100%" height="100%" horizontalAlign="center">
<mx:Form borderStyle="solid" borderColor="#CCCCCC" width="100%">
<mx:FormHeading label="修改界面" fontSize="14"/>
<mx:FormItem label="學(xué)號(hào)：">
<s:TextInput id="stuNo" width="200"/>
</mx:FormItem>
<mx:FormItem label="姓名：">
<s:TextInput id="stuName" width="200"/>
</mx:FormItem>
<mx:FormItem label="性別：">
<s:TextInput id="stuSex" width="200"/>
</mx:FormItem>
<mx:FormItem label="年齡：">
<s:TextInput id="stuAge" width="200"/>
</mx:FormItem>
</mx:Form>
<mx:HBox width="100%" height="25">
<s:Label width="60"/>
<s:Button label="修改"/>
<s:Label width="48"/>
<s:Button label="取消" click="cancelHandler(event)"/>
</mx:HBox>
</mx:VBox>
</s:TitleWindow>
3、設(shè)計(jì)結(jié)果
（1）初始化時(shí)
相關(guān)文章
datagrid不可編輯行有關(guān)問(wèn)題的控制方法
datagrid不可編輯行一個(gè)更簡(jiǎn)單的辦法，editable=“true”，然后直接把itemEditBegin給停掉阻止createItemEditor的調(diào)用2014-01-01
獲取到AdvancedDataGrid選中行的全部數(shù)據(jù)
通過(guò)AdvancedDataGrid的id來(lái)獲取selectedItem和selectedItems屬性，下面有個(gè)不不錯(cuò)的示例大家可以參考下2014-02-02
Flex 自定義DataGrid實(shí)現(xiàn)根據(jù)條目某一屬性值改變背景顏色
本節(jié)主要介紹了Flex DataGrid根據(jù)條目某一屬性值改變背景顏色，此DataGrid為自定義拓展的,需要的朋友可以參考下2014-07-07
Flex彈出窗口請(qǐng)求Action函數(shù)示例
這篇文章主要介紹了Flex彈出窗口請(qǐng)求Action函數(shù),需要的朋友可以參考下2014-05-05
flex壓縮圖片exif信息(作者/相機(jī))丟失問(wèn)題解決
使用flex的jpegencoder對(duì)圖片進(jìn)行壓縮的時(shí)候，exif信息會(huì)丟失這一點(diǎn)確實(shí)令人郁悶啊,此問(wèn)題應(yīng)當(dāng)如何解決呢？經(jīng)研究jpeg的文檔，最終解決這個(gè)問(wèn)題,曬出來(lái)與大家分享希望可以幫助到你們2013-02-02
flex4獲取當(dāng)前窗口的長(zhǎng)度與寬度的方法
讓新窗口看上去像新的一頁(yè)，于是就投機(jī)想讓PopUp的窗口界面大小自適應(yīng)屏幕，下面是flex4 獲取當(dāng)前窗口的長(zhǎng)度與寬度示例，需要的朋友可以參考下2014-07-07
flex中validateall()方法實(shí)現(xiàn)多Item驗(yàn)證且結(jié)果統(tǒng)一提示
在本文將為大家介紹下flex中validateall()方法如何實(shí)現(xiàn)多Item驗(yàn)證且結(jié)果統(tǒng)一提示，具體如下，感興趣的朋友可以參考下2013-09-09
Flex實(shí)現(xiàn)雙軸組合圖的設(shè)計(jì)思路及代碼
組合圖是有柱狀圖和折線圖組合的，柱狀圖顯示的數(shù)據(jù)是依據(jù)左邊的豎直軸，折線圖的數(shù)據(jù)依據(jù)右邊的豎直軸，詳細(xì)實(shí)現(xiàn)請(qǐng)看本文，希望對(duì)大家有所幫助2013-09-09
Flex讀取txt文件中的內(nèi)容報(bào)錯(cuò)原因分析及解決
這篇文章主要介紹了Flex讀取txt文件中的內(nèi)容報(bào)錯(cuò)原因分析及解決,需要的朋友可以參考下2014-05-05
本節(jié)主要介紹了flex actionScript讀取文件實(shí)現(xiàn)代碼，需要的朋友可以參考下2014-07-07