DataGrid根据数据变化动态变色.docVIP

在很多实时数据更新系统如股票，我们需要在数据变化时，有闪烁效果，比如股票升了，用红色闪以下，跌了用绿色闪一下。这里提供一个例子，是用Labe作为DataGridItemRenderer，当数据变大时用红色字体闪一下，变小时用绿色闪一下。效果图如下，简单的用Button修改数据源。 源代码如下： ?xml version=1.0 encoding=utf-8? mx:Application xmlns:mx=/2006/mxml layout=absolute mx:Script ![CDATA[ import mx.controls.Alert; import mx.validators.ValidationResult; import mx.collections.ArrayCollection; [Bindable] private var dp:ArrayCollection=new ArrayCollection([{col1:1,col2:2,col3:3},{col1:21,col2:22,col3:23},{col1:31,col2:32,col3:33}] ); private function changeRow1():void { dp.getItemAt(0)[col1] = Math.round(Math.random()*100); dp.getItemAt(0)[col2] = Math.round(Math.random()*100); dp.getItemAt(0)[col3] = Math.round(Math.random()*100); dp.refresh(); } private function changeRow2():void { dp.getItemAt(1)[col1] = Math.round(Math.random()*100); dp.getItemAt(1)[col2] = Math.round(Math.random()*100); dp.getItemAt(1)[col3] = Math.round(Math.random()*100); dp.refresh(); } private function changeRow3():void { dp.getItemAt(2)[col1] = Math.round(Math.random()*100); dp.getItemAt(2)[col2] = Math.round(Math.random()*100); dp.getItemAt(2)[col3] = Math.round(Math.random()*100); dp.refresh(); } ]] /mx:Script mx:VBox width=100% height=100% mx:DataGrid dataProvider={dp} mx:columns mx:DataGridColumn dataField=col1 mx:itemRenderer mx:Component mx:Label mx:Script ![CDATA[ private var lastData:Number; private var frameCount :Number=-1; override public function set data(value:Object):void{ super.data = value; if(value != null){ if(lastData value[col1]){ //lastData是临时数据，存储老的数据 frameCount =15;//控制闪烁持续时间变量 this.setStyle(color,0xFF0000);//红色 addEventListener(enterFrame, enterFrameHandler); }else if( lastData value[col1]){ frameCount =15;//控制闪烁持续时间变量 this.setStyle(color,0x00FF00