itemRenderer在DataGrid中应用，ComBobox过滤内容

最新推荐文章于 2017-03-24 17:04:00 发布
最新推荐文章于 2017-03-24 17:04:00 发布 · 147 阅读
文章标签：
#XML
flash她妹flex 专栏收录该内容
37 篇文章
订阅专栏
本文介绍了一个使用 Flex 框架实现的数据绑定与过滤的例子。通过定义 ArrayCollection 对象并将其绑定到 DataGrid 控件中，实现了数据的动态展示与交互。此外，还展示了如何通过 ComboBox 实现对绑定数据的过滤功能。
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" initialize="initApp();">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            [Bindable]
            public var testAC:ArrayCollection=new ArrayCollection([
                                                                   {Name:"aaa",
                                                                           Start:100,        Time:155,
                                                                           Start2:170, Time2:300 },
                                                                   {Name:"bbb",
                                                                           Start:120,        Time:130,
                                                                           Start2:140, Time2:160 },
                                                                   {Name:"ccc",
                                                                           Start:50,        Time:75,
                                                                           Start2:140, Time2:160 },
                                                                   {Name:"eee",
                                                                           Start:90,        Time:110,
                                                                           Start2:160, Time2:180 },
                                                                   {Name:"ddd",
                                                                           Start:10,         Time:45,
                                                                           Start2:70, Time2:85},
                                                                   {Name:"fff",  
                                                                           Start:0,        Time:10,
                                                                           Start1:20,        Time1:30,
                                                                           Start2:40,        Time2:50,
                                                                           Start3:70,        Time3:80,
                                                                           Start4:90,        Time4:100,
                                                                           Start5:110,        Time5:120,
                                                                           Start6:160,        Time6:170,
                                                                           Start7:180, Time7:1000 
                                                                   }
                                                                ]);

            [Bindable]
            public var expenses:ArrayCollection = new ArrayCollection([
                                                                   {Name:"SUB_5",
                                                                           Start:100,        Time:155,
                                                                           Start2:170, Time2:300 },
                                                                   {Name:"SUB_4",
                                                                           Start:120,        Time:130,
                                                                           Start2:140, Time2:160 },
                                                                   {Name:"SUB_3",
                                                                           Start:50,        Time:75,
                                                                           Start2:140, Time2:160 },
                                                                   {Name:"SUB_2",
                                                                           Start:90,        Time:110,
                                                                           Start2:160, Time2:180 },
                                                                   {Name:"SUB_1",
                                                                           Start:10,         Time:45,
                                                                           Start2:70, Time2:85},
                                                                   {Name:"MAIN",  
                                                                           Start:0,        Time:10,
                                                                           Start1:20,        Time1:30,
                                                                           Start2:40,        Time2:50,
                                                                           Start3:70,        Time3:80,
                                                                           Start4:90,        Time4:100,
                                                                           Start5:110,        Time5:120,
                                                                           Start6:160,        Time6:170,
                                                                           Start7:180, Time7:1000 
                                                                   }
                                                                ]);
            private function showAC():void{
				trace(expenses);                                              
            }



    //Combobox的过滤        
            private function initApp():void
            {
//                expenses.filterFunction = filterExpenses;
//                expenses.refresh();
//                trace(expenses);
            }

//            private function filterExpenses(item:Object):Boolean
//            {
//                if(item.Start < 100 || item.Start > 300)
//                {
//                    return false;
//                }
//                return true;
//            } 
        ]]>
    </mx:Script>

    <mx:DataGrid id="_grid" width="100%" dataProvider="{expenses}">
    	<mx:columns>
	    	<mx:DataGridColumn dataField="start">
		    	<mx:itemRenderer>
		    		<mx:Component>
			    		<mx:ComboBox  dataProvider="{outerDocument.testAC}" labelField="Name" change="test()">
				    		<mx:Script>
				    			<![CDATA[
				    				private function test():void{
				    					trace(outerDocument.expenses);
				    					trace("------data修改后-----------");
				    					var obj:Object = data;
				    					data.Name=this.selectedItem.Name; //若改变data.Name改变为了"ccc",则绑定_grid的expenses中的Name属性也会跟着变化
				    					trace(outerDocument.expenses); 
				    				}
				    			]]>
				    		</mx:Script>
			    		</mx:ComboBox>
		    		</mx:Component>
		    	</mx:itemRenderer>
	    	</mx:DataGridColumn>

	    	<mx:DataGridColumn dataField="Name">
		   		<mx:itemRenderer>
	    			<mx:Component>
		    			<mx:HBox>
	    					<mx:Script>
	    						<![CDATA[
			    					 override public function set data( value:Object ) : void {
		                                super.data = value;
		                                if( value.Name=="MAIN") setStyle("backgroundColor",0xff99ff); //根据表格内容改变背景色，可以做报警数据
		                                else setStyle("backgroundColor",0xffffff);
		                            }
	    						]]>
	    					</mx:Script>							
							<mx:Text width="100%" text="{data.Name}"/>
		    			</mx:HBox>
	    			</mx:Component>
	    		</mx:itemRenderer>
	    	</mx:DataGridColumn>
    	</mx:columns>
    </mx:DataGrid>
    <mx:Button click="showAC()"/>
</mx:Application>