Heim > php教程 > PHP开发 > Ideen und Umsetzung der TitleWindow-Wertübertragung in Flex

Ideen und Umsetzung der TitleWindow-Wertübertragung in Flex

高洛峰
Freigeben: 2016-12-27 17:13:53
Original
1097 Leute haben es durchsucht

1. Designideen

(1) Erstellen Sie ein neues DataGrid und fügen Sie drei Schaltflächen zur letzten Spalte hinzu: Hinzufügen, Ändern und Löschen

(2) Klicken Sie auf die Schaltfläche „Neu“. kann der Tabelle eine neue Zeile hinzufügen

(3) Klicken Sie auf die Schaltfläche „Ändern“, um einige Attribute der Zeile in der Tabelle zu ändern; und es wird diese Zeile aus der Tabelle löschen.

2. Implementierungsschritte

(1) Erstellen Sie eine neue Anwendung, DataGrid.mxml

DataGrid.mxml:

(2) Erstellen eine neue Anwendung Eine neue Fensterkomponente, ChildWindow.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> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</fx:Declarations> 

<fx:Script> 
<![CDATA[ 
import mx.collections.ArrayCollection; 

[Bindable] 
//表格数据源绑定 
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:"孙阳",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:"孙阳",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="学号" 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; 

/*添加按钮事件函数*/ 
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; 
} 

/*修改按钮事件函数*/ 
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>
Nach dem Login kopieren

ChildWindow.mxml:

(3) Erstellen Sie eine neue Modifikationsschnittstellenkomponente, 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; 

/*关闭按钮函数*/ 
protected function closeHandler(event:CloseEvent):void 
{ 
PopUpManager.removePopUp(this); 
} 

/*取消按钮函数*/ 
protected function cancelHandler(event:MouseEvent):void 
{ 
PopUpManager.removePopUp(this); 
} 

]]> 
</fx:Script> 
<fx:Declarations> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</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="学号:"> 
<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>
Nach dem Login kopieren

UpdateWindow .mxml:

3. Designergebnisse
<?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; 

/*关闭按钮函数*/ 
protected function closeHandler(event:CloseEvent):void 
{ 
PopUpManager.removePopUp(this); 
} 

/*取消按钮函数*/ 
protected function cancelHandler(event:MouseEvent):void 
{ 
PopUpManager.removePopUp(this); 
} 

]]> 
</fx:Script> 
<fx:Declarations> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</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="学号:"> 
<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>
Nach dem Login kopieren

(1) Während der Initialisierung

Ideen und Umsetzung der TitleWindow-Wertübertragung in Flex Weitere Ideen und Implementierung im Zusammenhang mit dem TitleWindow-Wert Weitergabe von Flex Bitte beachten Sie die PHP-Chinese-Website für Artikel!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Empfehlungen
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage