添加％符号并为其着色

Question

我有一个包含数字的数据网格列。我该怎么办：

1. add a '%' sign at the end of each number in the column 

和

2. make the color either red or green depending on if the number is less than or greater than 0, respectively. 

我已经能够做到1或者其他不能同时采用。这里是我有＃2，但不是＃1：

// my datagrid column: 
<mx:AdvancedDataGridColumn dataField="change" itemRenderer="itemrenderers.ColorRenderer" /> 

// my item renderer: 
package itemrenderers 
{ 
import mx.controls.Label; 
import mx.controls.dataGridClasses.DataGridListData; 
public class ColorRenderer extends Label { 
    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
    { 
     super.updateDisplayList(unscaledWidth, unscaledHeight); 
     if (data && data[DataGridListData(listData).dataField] < 0) 
     { 
      setStyle("color", 0xA41330); //red 
     } 
     else 
     { 
      setStyle("color", 0x59A336); //green 
     } 
    } 
} 
} 

Answer 1

如果您的代码正确着色标签，这应该工作。

// my datagrid column: 
<mx:AdvancedDataGridColumn dataField="change" itemRenderer="itemrenderers.ColorRenderer" /> 

// my item renderer: 
package itemrenderers 
{ 
import mx.controls.Label; 
import mx.controls.dataGridClasses.DataGridListData; 
public class ColorRenderer extends Label { 
    override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void 
    { 
     super.updateDisplayList(unscaledWidth, unscaledHeight); 
     if (data && data[DataGridListData(listData).dataField] < 0) 
     { 
      setStyle("color", 0xA41330); //red 
     } 
     else 
     { 
      setStyle("color", 0x59A336); //green 
     } 
     text = (data[DataGridListData(listData).dataField] as String) + "%"; 
    } 
} 
} 

Answer 2

试着把这个方法放在你的项目渲染器类中。它应该满足您的要求：

override public function set data(value:Object):void { 
    super.data = value; 
    if (value) { 
     var fieldValue:Number = 
      value[DataGridListData(listData).dataField] as Number; 
     text = String(fieldValue) + "%"; 
     if (fieldValue < 0){ 
      setStyle("color", 0xA41330); //red 
     }else{ 
      setStyle("color", 0x59A336); //green 
     } 
    } 
} 

问候。

Answer 3

使用datagrid列stylefunction和labelfunction。使用stylefunction可以切换颜色并使用labelfunction，您可以为数据添加％字符。