如何动态覆盖数据网格组件的列项渲染器答案

【问题标题】：How to override the column item renderers for the datagrid component dynamically如何动态覆盖数据网格组件的列项渲染器
【发布时间】：2011-02-24 20:59:02
【问题描述】：

我有一个名为 viewBase 的视图组件，我在其中定义了一个高级数据网格，其中包含一些用于数据网格列的项目渲染器。现在我有一个要求，我需要使用相同的视图 viewBase 组件，但不需要使用任何项目渲染器。

谁能告诉我如何覆盖在视图组件中声明的 itemrenderers？

【问题讨论】：

我们可以看一下代码吗？
我不明白你在问什么。代码可以帮助我们理解。 itemRenderer 是 DataGrid 列上的一个属性，因此您可以覆盖它来执行其他操作。但是，itemRenderer 也可以引用用于创建 DataGrid 列的组件，在这种情况下您不会覆盖它——但您可以扩展它。

标签： apache-flex actionscript-3

【解决方案1】：

如果您有一个带有 AdvancedDataGrid 的组件 ViewBase，您需要使其成为动态的渲染器之一，您可以像下面的示例中那样进行操作（threatLevel 的渲染器是动态的）： mx:Script>

        import mx.collections.ArrayCollection;
        import mx.controls.advancedDataGridClasses.AdvancedDataGridItemRenderer;
        [Bindable]
        public var monitoringArrayCollection : ArrayCollection;
        [Bindable]
        public var threatRendererClass : Class = AdvancedDataGridItemRenderer;

/mx:脚本>

<mx:AdvancedDataGrid dataProvider="{monitoringArrayCollection}">
    <mx:columns>
        <mx:AdvancedDataGridColumn dataField="firstName" />
        <mx:AdvancedDataGridColumn dataField="lastName" />
        <mx:AdvancedDataGridColumn dataField="threatLevel" itemRenderer="{new ClassFactory(threatRendererClass)}" />
    </mx:columns>
</mx:AdvancedDataGrid>

那么，不同渲染器的组件使用示例如下：

<mx:VBox>
    <components:ViewBase />
    <components:ViewBase threatRendererClass="{ThreatRenderer}" />      
</mx:VBox>

其中ThreatRenderer是自定义渲染器，例如：

public class ThreatRenderer extends UIComponent implements IDataRenderer, IListItemRenderer
{
    private var _data : Object;
    private var _dataChanged : Boolean = false;

    public function get data():Object
    {
        return _data;
    }

    public function set data(value:Object):void
    {
        _data = value;
        _dataChanged = true;
        invalidateDisplayList();
    }

    protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
    {
        super.updateDisplayList(unscaledWidth, unscaledHeight);
        if (!_dataChanged || !data) return;
        var g : Graphics = this.graphics;
        g.clear();
        g.beginFill(0xFF0000, 1);
        g.drawRect(0, 0, unscaledWidth*Number(data.threatLevel)/100, unscaledHeight);
        _dataChanged = false;
    }

}

【讨论】：