DataGrid 中的 itemRenderer

Question

我的 DataGrid 中有一个 itemRenderer，它将根据我的 XML 中大约 8 个不同节点的值显示彩色框（如颜色键）。我“认为”我想出了解决方案，当您第一次启动应用程序时，应该显示的彩色框可以显示，而那些不应该显示的则不要。但是当您滚动 dataGrid 时，它们都会发生变化。我已经尝试了几种不同的方法，自定义 MXML 组件、动作脚本，无论你命名它，它总是做同样的事情。有人可以看看这段代码，让我知道我做错了什么吗？

MXML：

<mx:DataGrid width="100%" height="100%" dataProvider="{gridData}"
             horizontalGridLines="true" horizontalGridLineColor="#666666">
    <mx:columns>
        <mx:DataGridColumn headerText="Publication title" dataField="pubTitle" showDataTips="true" dataTipField="dateEssentials"/>
        <mx:DataGridColumn headerText="Primary function" dataField="functionPrimary" width="150"/>
        <mx:DataGridColumn headerText="Lead writer" dataField="writerLead" width="150"/>
        <mx:DataGridColumn headerText="Primary channel" dataField="primaryChannel" width="150"/>
        <mx:DataGridColumn headerText="Primary date" dataField="primaryDate" width="100"
                           labelFunction="dgDateFormatter" sortCompareFunction="dgDateSorter"/>
        <mx:DataGridColumn dataField="dateEssentials" itemRenderer="scripts.DGImageRenderer"
                           width="150" resizable="false"/>
    </mx:columns>
</mx:DataGrid>

渲染器：

import mx.events.FlexEvent;
        override public function set data(value:Object):void {
            if (value != null) {
                super.data = value;
                trace(data.pubTitle);
                if (data.dateEyhpNews != null){
                    EyhpNews.visible = true;
                    trace("EYHP NEWS = " + data.dateEyhpNews);
                }
                if (data.dateEyhpSpotlight != null){
                    EyhpSpotlight.visible = true;
                    trace("EYHP SPOTLIGHT = " + data.dateEyhpSpotlight);
                }
                if (data.dateGsChs != null){
                    gsChs.visible = true;
                    trace("GS CHS = " + data.dateGsChs);
                }
                if (data.dateItsCHS != null){
                    itsChs.visible = true;
                    trace("ITS CHS = " + data.dateItsCHS);
                }
                if (data.dateProcChs != null){
                    procChs.visible = true;
                    trace("PROC CHS = " + data.dateProcChs);
                }
                if (data.dateEssentials != null){
                    essentials.visible = true;
                    trace("ESSENTIALS = " + data.dateEssentials);
                }
                if (data.dateEmail != null){
                    email.visible = true;
                    trace("EMAIL = " + data.dateEmail);
                }
                if (data.dateOther1 != null){
                    other1.visible = true;
                    trace("OTHER 1 = " + data.dateOther1);
                }
                if (data.dateOther2 != null){
                    other2.visible = true;
                    trace("OTHER 2 = " + data.pubTitle);
                }
                if (data.dateOther3 != null){
                    other3.visible = true;
                    trace("OTHER 3 = " + data.pubTitle);
                }
                trace(data.pubTitle);
            }
            dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
        }

<s:HGroup width="100%" height="100%" verticalAlign="middle" paddingLeft="5" paddingRight="5" >
    <mx:Box id="EyhpNews" visible="false" backgroundColor="0x0000FF" width="8" height="8" toolTip="EYHP News" />
    <mx:Box id="EyhpSpotlight" visible="false" backgroundColor="0xCC3300" width="8" height="8" toolTip="EYHP Spotlight" />
    <mx:Box id="gsChs" visible="false" backgroundColor="0x006699" width="8" height="8" toolTip="Global Services CHS" />
    <mx:Box id="itsChs" visible="false" backgroundColor="0xCC6600" width="8" height="8" toolTip="IT Services CHS" />
    <mx:Box id="procChs" visible="false" backgroundColor="0x993399" width="8" height="8" toolTip="Procurement CHS" />
    <mx:Box id="essentials" visible="false" backgroundColor="0x009933" width="8" height="8" toolTip="Essentials" />
    <mx:Box id="email" visible="false" backgroundColor="0xFF6666" width="8" height="8" toolTip="Email" />
    <mx:Box id="other1" visible="false" backgroundColor="0xFF6666" width="8" height="8" toolTip="Other 1" />
    <mx:Box id="other2" visible="false" backgroundColor="0xFF6666" width="8" height="8" toolTip="Other 2" />
    <mx:Box id="other3" visible="false" backgroundColor="0xFF6666" width="8" height="8" toolTip="Other 3" />
</s:HGroup>

Answer 1

我认为滚动时数据网格可能是reusing 项目渲染器。当它确实更改了项目渲染器的数据值时，它已经有一些可见的框，并且您使其他新框可见。所以你应该做的是确保旧的盒子不再可见。

例如，您可以这样做：

EyhpNews.visible = data.dateEyhpNews != null;
EyhpSpotlight.visible = data.dateEyhpSpotlight != null;
// ...