Apache flex Spark数据网格问题

Spark DataGrid的奇怪问题：

如果网格中的数据行数为偶数，则当网格中的数据发生更改时，一切都会呈现良好

如果行数为奇数，达到一定数量，则中间的行在数据更改时将无法正确渲染

在下面的代码中，我设置了一个问题的示例，并使用MX/Halo数据网格（有效）和Spark数据网格（无效）。请注意，两个网格中的第三列都有一个火花按钮的项目渲染器。MX网格使用与spark网格相同的操作脚本代码。当特定行的“状态”列显示为“已释放”时，应禁用两个网格的每一行中的按钮

MX网格工作正常，但无论出于何种原因，奇数行上的火花网格始终启用中间行的按钮，而在更改状态列时应禁用该按钮。如果spark栅格中有偶数行，则其工作正常

下面是代码示例：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:s="library://ns.adobe.com/flex/spark"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               width="921" height="668" minWidth="955" minHeight="600"
               creationComplete="buildAnalytes(nsCount.value)">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;

            [Bindable]private var analytes:ArrayCollection;

            private function buildAnalytes(count:int):void {
                analytes = new ArrayCollection();

                for (var i:int = 0;i<count;i++) {
                    var analyte:Object = new Object();

                    analyte.analyte = "ANA" + (i+1);
                    analyte.result = i + 100;
                    analyte.status = "Pending";

                    analytes.addItem(analyte);
                }
            }

            private function release():void {
                var analyte:Object;

                for each (analyte in analytes) {
                    analyte.status = "Released";
                }

                analytes.refresh();
            }

        ]]>
    </fx:Script>

    <s:Panel id="panelResults" x="45" y="20" width="570" height="300" title="Results -- Halo (MX) DataGrid">
        <mx:DataGrid id="gridResultsMX" width="100%" editable="true" height="100%" dataProvider="{analytes}">
            <mx:columns>
                <mx:DataGridColumn width="100" dataField="analyte" headerText="Analyte" editable="false"/>
                <mx:DataGridColumn width="100" dataField="result" headerText="Result" editable="true"/>
                <mx:DataGridColumn width="100" dataField="comments" headerText="Comments" editable="false">
                    <mx:itemRenderer>
                        <fx:Component>
                            <mx:HBox width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
                                <s:Button width="90" height="15" label="Comments"
                                          enabled="{data.status != 'Released'}"
                                          />    
                            </mx:HBox>
                        </fx:Component>
                    </mx:itemRenderer>  
                </mx:DataGridColumn>

                <mx:DataGridColumn dataField="status" headerText="Status" editable="false"/>
            </mx:columns>
        </mx:DataGrid>
    </s:Panel>

    <s:Panel id="panelResults2" x="44" y="341" width="570" height="300" title="Results -- Spark DataGrid">
        <s:DataGrid id="gridResultsSpark" visible="true" x="0" y="0" width="100%"
                    height="100%" 
                    dataProvider="{analytes}" editable="true" fontSize="10">

            <s:columns>
                <s:ArrayList>
                    <s:GridColumn width="100" dataField="analyte" editable="false" headerText="Analyte"></s:GridColumn>
                    <s:GridColumn width="200" dataField="result" editable="true" headerText="Result"></s:GridColumn>

                    <s:GridColumn width="90" editable="false" headerText="Comments">
                        <s:itemRenderer>
                            <fx:Component>
                                <s:GridItemRenderer textAlign="center">
                                    <mx:HBox width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
                                        <s:Button width="70" height="15" label="Comments"
                                                  enabled="{data.status != 'Released'}"
                                                  />    
                                    </mx:HBox>
                                </s:GridItemRenderer>
                            </fx:Component>
                        </s:itemRenderer>                           
                    </s:GridColumn>

                    <s:GridColumn dataField="status" editable="false" headerText="Status"></s:GridColumn> 
                </s:ArrayList>
            </s:columns>
        </s:DataGrid>
    </s:Panel>

    <s:NumericStepper x="663" y="317" minimum="1" value="4" maximum="25" id="nsCount"/>
    <s:Button x="724" y="318" label="Build Analytes" click="buildAnalytes(nsCount.value)"/>

    <s:Button x="830" y="318" label="Release" click="release()"/>
</s:Application>

还有其他人见过这个吗？在我的代码中看到任何可以解释它的东西了吗

---

任何帮助或想法都将不胜感激。哦，这是FlashBuilder 4.6，使用4.6 SDK。

为了避免这个问题，您可以像下面这样编辑您的

发行版

函数：

...

private function release():void {

    var temp_analytes:ArrayCollection = new ArrayCollection();
    var obj:Object

    for each (var analyte:Object in analytes) {

        obj = {
            analyte : analyte.analyte,
            result : analyte.result,
            status : "Released" 
        }
        temp_analytes.addItem(obj);

    }

    analytes = temp_analytes;               
    analytes.refresh();

}

...

这段代码100%适用于我（在Flex4.5和4.6上测试）

我希望这能对您有所帮助。

不要忘记重写GridItemRenderer中的set data函数。在这里，您可以根据数据属性（状态）更改组件（按钮）的属性（已启用）。这解决了你的问题。现在，您的GridColumn如下所示：

<s:GridColumn width="90" editable="false" headerText="Comments">
    <s:itemRenderer>
        <fx:Component>
            <s:GridItemRenderer textAlign="center">
                <mx:HBox width="100%" height="100%" horizontalAlign="center" verticalAlign="middle">
                     <fx:Script><![CDATA[
                         override public function set data(value:Object):void{
                            if(value){
                              super.data = value;
                              myButton.enabled = data.status != 'Released';
                            }
                         }
                      ]]></fx:Script>
                      <s:Button id = "myButton" width="70" height="15" label="Comments"/>
                </mx:HBox>
            </s:GridItemRenderer>
        </fx:Component>
    </s:itemRenderer>
</s:GridColumn>

---

再说一遍，你为什么要用而不是用？

非常感谢——干得好！啊，很好很优雅的解决方案——真的谢谢你。就HBox而言，你是对的，应该是HGRoup，尽管上述情况无论如何都会发生。非常感谢！