Flex itemRenderer根据单元格内容动态加粗

时间:2013-10-07 20:51:19

标签: flash flex actionscript datagrid flex4

Flex 4帮助我需要一个itemRenderer来将datagrid整行的fontWeight的setStyle动态地根据该行中任何单元格的单元格内容进行粗体显示。因此,例如,如果我的整个数据网格中的单元格内容等于字符串“ALL”,我希望数据网格中具有该单元格的整个行为“粗体”。注意:这不是XML数据。

Render

protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void {
            super.updateDisplayList(unscaledWidth,unscaledHeight);
            if (data.toString() == "ALL"){
                setStyle("fontWeight","bold");
            }else{
                setStyle("fontWeight","normal");
            }

        }

MXML Code
<mx:VBox width="100%" id="statsGridBox"   height="40%" >
<mx:DataGrid id="statsGrid" width="100%" height="100%" itemRenderer="com.jpmc.ctrbs.dashboard.alarms.renderers.FontWeightRowRender"/>
</mx:VBox>

3 个答案:

答案 0 :(得分:2)

首先,如果您希望突出显示仅在单元格级别发生,请将您的代码放在itemrender“FontWeightRowRender”中。

在渲染器中,您可以执行以下操作:

            override public function set data(value:Object):void {              
            super.data = value;

            if (String(value) == "ALL") {
                boldText.visible = true;
                normalText.visible = false;                 
            } else {
                boldText.visible = false;
                normalText.visible = true;
            }
        }

<s:Group>       
    <s:Label id="boldText" text="{label}" width="100%" fontWeight="bold"/>
    <s:Label id="normalText" text="{label}" width="100%" fontWeight="normal"/>
</s:Group>  

更新:突出显示行的示例

            override public function set data(value:Object):void {              
            super.data = value;
                            if (!value) return;             

            if (MyValueObject(value).isBoldRow()) {
                boldText.visible = true;
                normalText.visible = false;                 
            } else {
                boldText.visible = false;
                normalText.visible = true;
            }
        }

MyValueObject.as

     public function isBoldRow():Boolean {
          if ((this.attrib1 == "ALL") || (this.attrib7 === "ALL"))
           return true;
           return false; 
      }

答案 1 :(得分:1)

你应该将你的setStyle代码放在你的单元格渲染器的[overriden] set data方法中。然后样式在数据更改时设置,而不是在重绘渲染器时(当您遇到更改数据时可能不会发生这种情况)。

在渲染器中:

override public function set data(value:Object):void
{
    super.data = value;
    if (data && data.toString()=="ALL")
        setStyle("fontWeight","bold");
    else
        setStyle("fontWeight","normal");
}

答案 2 :(得分:0)

StephenNYC的答案最终有效,但最后我认为我使用mx:AdvancedDataGrid并使用styleFunction =“myStyleFunc”更改fontWeight更容易。

MXML

<mx:AdvancedDataGrid id="statsGrid" width="100%" height="100%" styleFunction="myStyleFunc" />

脚本

<fx:Script>
<![CDATA[
private function myStyleFunc(data:Object,col:AdvancedDataGridColumn):Object {
                if(data) {
                    for( var propertyName : * in data){
                        if (data[propertyName] == "ALL") { 
                            return {fontWeight:"bold"}; 
                        }
                    }
                }
                return {fontWeight:"normal"};      
            }
        ]]>
    </fx:Script>