您的位置:首页 > 其它

FLEX DataGrid背景颜色调试 应用label改变column中文字的颜色

2009-11-06 16:05 603 查看
PriceColor.Mxml文件如下所示:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">

<mx:Script>
<![CDATA[
import mx.controls.dataGridClasses.DataGridColumn;
import mx.utils.ObjectUtil;

private function price_labelFunc(item:Object, column:DataGridColumn):String {
return currencyFormatter.format(item.@price);
}

private function price_sortCompareFunc(itemA:Object, itemB:Object):int {
return ObjectUtil.numericCompare(itemA.@price, itemB.@price);
}
]]>
</mx:Script>

<mx:XML id="itemsXML">
<items>
<item name="Item 1" price="1.32" />
<item name="Item 2" price="-12.23" />
<item name="Item 3" price="4.96" />
<item name="Item 4" price="-0.94" />
</items>
</mx:XML>

<mx:Style>
.centered {
text-align: center;
}
</mx:Style>

<mx:CurrencyFormatter id="currencyFormatter"
precision="2"
useNegativeSign="false" />

<mx:DataGrid id="dataGrid" dataProvider="{itemsXML.item}">
<mx:columns>
<mx:DataGridColumn dataField="@name"
headerText="Name:"
headerStyleName="centered" itemRenderer="PriceLabel"/>

<mx:DataGridColumn dataField="@price"
headerText="Price:"
textAlign="right"
headerStyleName="centered"
labelFunction="price_labelFunc"
sortCompareFunction="price_sortCompareFunc"
itemRenderer="PriceLabel" />
</mx:columns>
</mx:DataGrid>

</mx:Application>

PirceLabel.as文件如下所示:

package {
import mx.controls.Label;
import mx.controls.listClasses.*;
import mx.controls.Alert;

public class PriceLabel extends Label {

private const POSITIVE_COLOR:uint = 0x000000; // Black
private const NEGATIVE_COLOR:uint = 0xFF0000; // Red

override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
super.updateDisplayList(unscaledWidth, unscaledHeight);

/* Set the font color based on the item price. */
setStyle("color",(data.@price<=0)?NEGATIVE_COLOR:POSITIVE_COLOR);
//Alert.show("123545677");
}
}
}

曾经认为改变DataGrid中的Column中的颜色得通过调用DataGridItemRenderer来实现,后来发现不然,通过继承label也可以实现字体颜色变化

其实树节点字体颜色变化也是通过label标签实现的,如下所示:

package
{
import mx.controls.treeClasses.TreeItemRenderer;
import mx.controls.treeClasses.TreeListData;

public class TreeChangeColor extends TreeItemRenderer
{
public function TreeChangeColor()
{
super();
}
override protected function updateDisplayList(unscaledWidth:Number,unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
var __treelistData:TreeListData=listData as TreeListData;

label.x+=1;
if(__treelistData!=null){
if(__treelistData.item.@level==2){
label.setColor(0XFA5A32);
}else{
label.setColor(getStyle("color"));
}
}
}
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: