flex 简单例子(含实例效果图 源码)

要过节了,工作任务也完成了,闲来没事,研究svg，感觉市场上对svg支持度不高,导致了这项技术不能够被IT群众充分的接纳，一个没有人支持的技术,她必然也不会有很大的前景。研究来研究去,还是觉得flex比较好玩。

温故而知新,简简单单的写了一个例子。以后会在注图形化处理方面多写些例子.

 

 

 

源码:

 <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" verticalAlign="top" applicationComplete="init()"> <mx:Script> <!--[CDATA[ import mx.events.ItemClickEvent; import mx.collections.ArrayCollection; import mx.controls.Alert; [Bindable] public var dataColl:ArrayCollection=new ArrayCollection(); //ID编号 var k=1; //联系人对象 var userobj:Object; //性别默认状态 var sexobj:String="男"; //右键删除菜单 var menucont:ContextMenu; //初始化行数 var p:int=0; public function init():void{ menucont=new ContextMenu(); addMenuItems(); } //添加右键菜单项 public function addMenuItems():void{ var item:ContextMenuItem = new ContextMenuItem("删除"); menucont.customItems.push(item); item.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT, menuItemHandler); menucont.hideBuiltInItems(); userdata.contextMenu = menucont; } //菜单右键事件处理 public function menuItemHandler(event:ContextMenuEvent):void{ var CaptionString:String=event.target.caption; if(CaptionString=="删除"){ //确定鼠标所在行数 var findex:Number = Math.floor(userdata.contentMouseY/userdata.rowHeight)-1 + userdata.verticalScrollPosition; if (findex<0 || findex>=userdata.verticalScrollPosition+userdata.rowCount-1) //行号小于0时和大于datagrid行总数时的 错误处理 { Alert.show("请选择要删除的行","提示"); } else { p=findex; dataColl.removeItemAt(p); Alert.show("删除成功","提示"); } } } public function checkuser(event:MouseEvent):void{ var gname=uname.text; var gphone=uphone.text; if(gname!="" && gphone!=""){ dataprovider(); }else{ Alert.show("请输入用户名或电话号码","提示"); } } //单选按钮触发事件 public function changsex(event:ItemClickEvent):void{ if(event.currentTarget.selectedValue=="f"){ sexobj= "女"; }else{ sexobj= "男"; } } //重置 public function resetvalue(event:MouseEvent):void{ uname.text=""; uphone.text=""; male.selected=true; } //创建联系人信息 public function dataprovider():Object{ userobj=new Object(); userobj["uid"]=k; userobj["uname"]=uname.text; userobj["uphone"]=uphone.text; userobj["usex"]=sexobj; dataColl.addItem(userobj); k++; return userobj; } ]]--> </mx:Script> <mx:Form> <mx:Text text="联系簿" fontWeight="bold" fontSize="14" textAlign="center" width="233" color="#1B78C6"/> <mx:FormItem label="姓名" fontSize="12" fontWeight="bold" horizontalAlign="left"> <mx:TextInput id="uname"/> </mx:FormItem> <mx:RadioButtonGroup id="sexgroup" itemClick="changsex(event)"/> <mx:FormItem label="性别" horizontalAlign="center" fontSize="12" fontWeight="bold"> <mx:HBox> <mx:RadioButton id="male" label="男性" groupName="sexgroup" selected="true" value="m"/> <mx:RadioButton id="female" label="女性" groupName="sexgroup" value="f"/> </mx:HBox> </mx:FormItem> <mx:FormItem label="电话号码" fontWeight="bold" fontSize="12" horizontalAlign="center"> <mx:TextInput id="uphone"/> </mx:FormItem> <mx:HBox width="232" height="35" verticalAlign="middle" horizontalAlign="center"> <mx:Button id="go" label="添加" fontSize="12" fontWeight="normal" click="checkuser(event)" textAlign="center" height="30" width="60"/> <mx:Button id="reset" label="重置" fontWeight="normal" fontSize="12" height="30" width="60" click="resetvalue(event)"/> </mx:HBox> </mx:Form> <mx:DataGrid dataProvider="{dataColl}" width="400" id="userdata" fontSize="12" borderStyle="inset" fontWeight="bold" textAlign="center" alternatingItemColors="[#F1B6B6, #F2EB37]" height="210" editable="true"> <mx:columns> <mx:DataGridColumn headerText="ID" dataField="uid"/> <mx:DataGridColumn headerText="联系人" dataField="uname"/> <mx:DataGridColumn headerText="性别" dataField="usex"/> <mx:DataGridColumn headerText="电话号码" dataField="uphone"/> </mx:columns> </mx:DataGrid> </mx:Application>