flex复选框和下拉列表的几种用法整理

admin Flex

2023-12-05 0 259

这几天接触了flex的很多控件，让我印象最深刻的就是控件的数据绑定几乎所有控件都可以这样做，基本上来说原理和html一样，我自己闲暇时间就整理了有关复选框可下拉的几种用法，下面就给大家分享一下。1.复选框这里我主要研究的该控件的全选，全不选，反选以及选中的操作，原理也就是也能用selected这个属性，true表示选中，只需遍历就能实现，此处我使用的是动态的复选框，页面代码如下复制代码代码如下: <mx:VBox top=\”50\”> <mx:VBox> <mx:Canvas width=\”100%\” height=\”100%\” > <mx:Repeater id=\”rep\” dataProvider=\”{array}\”> <mx:CheckBox id=\”checkbox\” label=\”{rep.currentItem.name}\” x=\”{rep.currentItem.x}\” data=\”{rep.currentItem.id}\”/> </mx:Repeater> </mx:Canvas> </mx:VBox> <mx:VBox> </mx:VBox> </mx:VBox> <s:Button x=\”90\” y=\”81\” label=\”全选\” click=\”checkAll()\”/> <s:Button x=\”168\” y=\”81\” label=\”全不选\” click=\”checkNotAll()\”/> <s:Button x=\”246\” y=\”81\” label=\”反选\” click=\”reverse()\”/> 刚看到可能比较陌生下面我把Array的定义贴出来复制代码代码如下: public var array:Array=new Array({\”name\”:\”语文\”,\”id\”:\”chinese\”,\”x\”:\”80\”},{\”name\”:\”数学\”,\”id\”:\”math\”,\”x\”:\”160\”},{\”name\”:\”英语\”,\”id\”:\”english\”,\”x\”:\”240\”}); 这种处理一般是用于动态的数据，静态的就直接写了，下面是我的ActionScript 复制代码代码如下: //全选 private function checkAll():void{ for(var i:int=0;i<array.length;i++){ checkbox[i].selected=true; all=all+checkbox[i].data+\”,\”; } Alert.show(\”选择了：\”+all.substr(0,all.lastIndexOf(\”,\”))); all=\”\”; } //全不选 private function checkNotAll():void{ for(var i:int=0;i<array.length;i++){ checkbox[i].selected=false; } } //反选 private function reverse():void{ for(var i:int=0;i<array.length;i++){ if(checkbox[i].selected){ checkbox[i].selected=false; }else{ checkbox[i].selected=true; } } } 很简单吧，下面是下拉的使用，我的做法是先初始化下拉把数据绑定上去，之后根据需要修改下拉显示的内容，只需合理运用好下拉的selectedItem就可以修改下拉选中的值了复制代码代码如下: <mx:ComboBox id=\”subject\” x=\”78\” y=\”149\” labelField=\”name\” dataProvider=\”{array}\”/> 下面是页面加载的初始化方法 <PRE class=java name=\”code\”>public function init(event:Event):void{ for(var i:int=0;i<array.length;i++){ if(\”数学\”==array[i].name){ subject.selectedIndex=i; checkbox[i].selected=true; } } }</PRE> 这里我顺便把数学的复选框弄成了默认选中 看起来代码有点乱，下面我把整个页面代码都贴出来 <PRE class=html name=\”code\”><?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\” initialize=\”init(event)\”> <fx:Declarations> <!– Place non-visual elements (e.g., services, value objects) here –> </fx:Declarations> <fx:Script> <![CDATA[ import mx.controls.Alert; public var all:String=\”\”; public var array:Array=new Array({\”name\”:\”语文\”,\”id\”:\”chinese\”,\”x\”:\”80\”},{\”name\”:\”数学\”,\”id\”:\”math\”,\”x\”:\”160\”},{\”name\”:\”英语\”,\”id\”:\”english\”,\”x\”:\”240\”}); public function init(event:Event):void{ for(var i:int=0;i<array.length;i++){ if(\”数学\”==array[i].name){ subject.selectedIndex=i; checkbox[i].selected=true; } } } //全选 private function checkAll():void{ for(var i:int=0;i<array.length;i++){ checkbox[i].selected=true; all=all+checkbox[i].data+\”,\”; } Alert.show(\”选择了：\”+all.substr(0,all.lastIndexOf(\”,\”))); all=\”\”; } //全不选 private function checkNotAll():void{ for(var i:int=0;i<array.length;i++){ checkbox[i].selected=false; } } //反选 private function reverse():void{ for(var i:int=0;i<array.length;i++){ if(checkbox[i].selected){ checkbox[i].selected=false; }else{ checkbox[i].selected=true; } } } ]]> </fx:Script> <mx:VBox top=\”50\”> <mx:VBox> <mx:Canvas width=\”100%\” height=\”100%\” > <mx:Repeater id=\”rep\” dataProvider=\”{array}\”> <mx:CheckBox id=\”checkbox\” label=\”{rep.currentItem.name}\” x=\”{rep.currentItem.x}\” data=\”{rep.currentItem.id}\”/> </mx:Repeater> </mx:Canvas> </mx:VBox> <mx:VBox> </mx:VBox> </mx:VBox> <s:Button x=\”90\” y=\”81\” label=\”全选\” click=\”checkAll()\”/> <s:Button x=\”168\” y=\”81\” label=\”全不选\” click=\”checkNotAll()\”/> <s:Button x=\”246\” y=\”81\” label=\”反选\” click=\”reverse()\”/> <mx:ComboBox id=\”subject\” x=\”78\” y=\”149\” labelField=\”name\” dataProvider=\”{array}\”/> </s:Application> </PRE> <PRE></PRE> <PRE></PRE> <IMG alt=\”\” src=\”http://img.blog.csdn.net/20130706214231250?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvY2hlbndpbGwz/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center\”>