ItemRenderer通过AdvancedDataGrid上的ItemEditor显示

时间:2011-04-05 13:44:25

标签: flex actionscript datagrid mxml advanceddatagrid

我对Flex很新,所以我很可能错过了一些明显的东西,但在第一个示例代码中,一切都按预期工作。不编辑单元格时,它会将居中日期显示为纯文本。编辑时,它显示DateField编辑器。第二个例子就我所知道的完全一样,除了它是AdvancedDataGridColumn这个事实。将该代码与AdvancedDataGrid一起使用,当我进入编辑模式时,我可以在DateField编辑器后面(文本输入和日历图标之间)看到正常项目渲染器中的文本。我在这里做错了吗?我怎么能隐藏它?提前谢谢。

示例1:

<mx:DataGridColumn id="endColumn"
                   dataField="endDate"
                   headerText="End"
                   editorDataField="selectedDate"
                   editable="true"
                   labelFunction="{this.formatDate}"
                   width="80"
                   textAlign="center" >
    <mx:itemEditor>
        <fx:Component>
            <mx:DateField yearNavigationEnabled="true" formatString="DD/MM/YY" />
        </fx:Component>
    </mx:itemEditor>
</mx:DataGridColumn>

示例2:

<mx:AdvancedDataGridColumn id="endColumn"
                           dataField="endDate"
                           headerText="End"
                           editorDataField="selectedDate"
                           editable="true"
                           labelFunction="{this.formatDate}"
                           width="80"
                           textAlign="center" >
    <mx:itemEditor>
        <fx:Component>
            <mx:DateField yearNavigationEnabled="true" formatString="DD/MM/YY" />
        </fx:Component>
    </mx:itemEditor>
</mx:AdvancedDataGridColumn>

1 个答案:

答案 0 :(得分:1)

dateInput和图标之间的空格通常是透明的。我不确定为什么mx:DataGrid隐藏了呈现的文字而mx:AdvancedDataGrid没有隐藏。

无论如何,这是解决问题的简单方法。只需以您喜欢的颜色绘制itemEditors背景。以下应该有效。

<mx:itemEditor>
    <fx:Component>
        <mx:DateField yearNavigationEnabled="true" formatString="DD/MM/YY">
            <fx:Script>
                <![CDATA[
                    protected override function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
                    {
                        graphics.beginFill(0xFFFFFF); // white
                        graphics.drawRect(0, 0, unscaledWidth, unscaledHeight);
                        graphics.endFill();

                        super.updateDisplayList(unscaledWidth, unscaledHeight);
                    }
                ]]>
            </fx:Script>
        </mx:DateField>
    </fx:Component>
</mx:itemEditor>