在flex 4.15中设置Apache DataGrid的样式

时间:2016-09-16 22:51:35

标签: apache flex datagrid adobe

我想知道,我如何更改数据网格项的背景颜色! 我使用外部CSS和flex 4.6我使用:

s|ItemRenderer
{
  contentBackgroundColor: #FF0000;
}

但是我必须升级到apache flex 4.15并且它不再起作用了......我找不到哪个组件我想要设计风格。在文档中,我找不到可用的样式列表T_T。

如果您有链接或回答thx!

1 个答案:

答案 0 :(得分:0)

在adobe Flex的文档中,它说:

  

项呈示器与DataGrid控件的列相关联。然后,项呈示器控制列中每个单元格的外观。但是,每个项呈示器都可以访问DataGrid控件的整行的数据项。使用项呈示器的data属性来访问数据项。

尝试通过对所有列使用ItemRenderer来实现这一点,您可以使用MXML方式或通过将MXL与Action脚本代码混合使用,例如应用已知列的样式:

<mx:DataGrid x="29" y="303" width="694" height="190" dataProvider="{testData.book}" variableRowHeight="true">
<mx:columns>
    <mx:DataGridColumn headerText="Title" dataField="title">
        <mx:itemRenderer>
            <mx:Component>
                <mx:HBox paddingLeft="2">
                    <mx:Script>
                    <![CDATA[
                        override public function set data( value:Object ) : void {
                            super.data = value;
                            var today:Number = (new Date()).time;
                            var pubDate:Number = Date.parse(data.date);
                            if( pubDate > today ) setStyle("backgroundColor",0xff99ff);
                            else setStyle("backgroundColor",0xffffff);
                        }
                    ]]>
                    </mx:Script>
                    <mx:Image source="{data.image}" width="50" height="50" scaleContent="true" />
                    <mx:Text width="100%" text="{data.title}" />
                </mx:HBox>
            </mx:Component>
        </mx:itemRenderer>
    </mx:DataGridColumn>
</mx:columns>

或在单独的动作脚本类中,通过将提到的脚本标记的内容排除到动作脚本类来扩展列的类型并覆盖设置数据方法,如:

public class CheckBoxHeaderRenderer extends CheckBox
{
    override public function set data(value:Object):void
{
    _data = value as CheckBoxHeaderColumn;
    selected = _data.selected;
    //type your condition here using the property of your dataField
    if(data.property=="value"){
    this.styleName="yourClassCSSName"
    }
}

你的CSS类就像:

    .yourClassCSSName{
contentBackgroundColor: #FF0000;
}

更多: Understanding Flex itemRenderers

Creating item renderers and item editors for the Spark DataGrid control