首頁 php教程 PHP开发 Flex中TitleWindow傳值思路及實現

Flex中TitleWindow傳值思路及實現

Dec 27, 2016 pm 05:13 PM

1、設計想法 

(1)新建一個DataGrid,在其中最後一列加入三個按鈕:新增、修改、刪除; 

(2)點選新增按鈕,可將表格新增一行; 

(2)點選新增按鈕,可將表格新增一行; 

( 3)點選「修改」按鈕,可以修改表格中該行的一些屬性; 

(4)點選「刪除」按鈕,會將表格中該行刪除。

2、實作步驟 

(1)新建一個應用程序,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> 
<!-- 将非可视元素(例如服务、值对象)放在此处 --> 
</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>
登入後複製

(2)新建一個新增視窗元件,ChildWindowmxml 🠎rexml: (3)新建一個修改介面元件,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; 

/*关闭按钮函数*/ 
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>
登入後複製

3、設計結果 

(1)初始化時 WindowM關注PHP中文網!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1655
14
CakePHP 教程
1414
52
Laravel 教程
1307
25
PHP教程
1255
29
C# 教程
1228
24