如何在数据网格中设置特定单元格的背景颜色。我通过项目渲染器尝试过。但是项目渲染器的问题是,直到数据没有填充到数据网格中,背景颜色才会起作用。即使数据网格中没有数据,我也希望突出显示单元格或单元格集。
请在下面找到我的代码:
MAin.mxml
<?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"
creationComplete="onComplete()">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import flashx.textLayout.formats.BackgroundColor;
import mx.controls.advancedDataGridClasses.AdvancedDataGridColumn;
private var dataArr:Array=new Array({data1:"Value"},{data1:"Value"},{data1:"Value"},{data1:"Value"},{data1:"Value"},{data1:"Value"})
private function onComplete():void{
var colsArr:Array=new Array();
var column1:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column1.headerText="Header1";
//column1.setStyle("backgroundColor","0xcccccc");
column1.dataField="data1";
colsArr.push(column1);
var column2:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column2.headerText="Header2";
//column2.setStyle("backgroundColor","0xcccccc");
column2.dataField="data2";
colsArr.push(column2);
var column3:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column3.headerText="Header3";
//column3.setStyle("backgroundColor","0xcccccc");
column3.dataField="data3";
colsArr.push(column3);
var column4:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column4.headerText="Header4";
//column4.setStyle("backgroundColor","0xcccccc");
column4.dataField="data4";
colsArr.push(column4);
var column5:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column5.headerText="Header5";
column5.dataField="data5";
colsArr.push(column5);
var column6:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column6.headerText="Header6";
column6.dataField="data6";
colsArr.push(column6);
var column7:AdvancedDataGridColumn=new AdvancedDataGridColumn();
column7.headerText="Header7";
column7.dataField="data7";
colsArr.push(column7);
sampleDG.columns=colsArr;
sampleDG.rowCount=colsArr.length;
}
private function myStyleFunction(data:Object, col:AdvancedDataGridColumn):Object{
if(col.headerText=="Header1" || col.headerText=="Header2" || col.headerText=="Header3"){
return {backgroundColor:0xcccccc, color:0xff0000};
}else{
return {backgroundColor:0xffffff, color:0xff0000};
}
return {};
}
]]>
</fx:Script>
<mx:AdvancedDataGrid id="sampleDG" rowCount="3" width="350" horizontalScrollPolicy="on" height="300"
cachePolicy="on" styleFunction="myStyleFunction" itemRenderer="com.ADGItemRenderer"/>
</s:Application>
ADGItemRenderer:
package com.ssc.pna.secmaster.renderer
{
import com.ssc.pna.components.MktDGColumn;
import mx.charts.styles.HaloDefaults;
import mx.controls.advancedDataGridClasses.AdvancedDataGridItemRenderer;
import mx.controls.advancedDataGridClasses.AdvancedDataGridListData;
import mx.controls.listClasses.BaseListData;
import mx.styles.CSSStyleDeclaration;
import mx.styles.IStyleManager2;
import mx.styles.StyleManager;
[Style(name="rowColor", type="uint", format="Color", inherit="yes")]
public class ADGItemRenderer extends AdvancedDataGridItemRenderer
{
/**
* @private
*/
public var dataType:Object;
public var precision:Object;
private static var stylesInited:Boolean = initStyles();
/**
* @private
*/
private static function initStyles():Boolean
{
return true;
}
public function ADGItemRenderer()
{
super();
background = true;
backgroundColor=0xFFFFCC;
}
override public function validateNow():void
{
//listData=listData;
var _listDataDummy:BaseListData=listData;
backgroundColor = 0xFFFFCC;
super.validateNow();
}
}
}
即使没有数据,我也想更改前三列中所有单元格的背景颜色(正如我在上面的代码中尝试的那样)。最初我尝试使用 SetStyle 在列级别设置颜色,但遇到了一些问题。所以想改变方法。下面的链接将为您提供有关该问题的详细信息: