Question

我有一些分层数据，我想在Flex Spark DataGrid中显示，看起来像这样：

|------|---------------------------|
| row1 | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
|  in  | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| outer|---------------------------|
| grid | a component that spans    |
|      | over multiple columns here|
|----------------------------------|
| row2 | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
|  in  | 1 | 2 | 3 | 4 | 5 | 6 | 7 |
| outer|---------------------------|
| grid | a component that spans    |
|      | over multiple columns here|
|----------------------------------|

我要做的是使用一个包含内部DataGrid的自定义GridItemRenderer。基本概念看起来像这样：

<s:DataGrid dataProvider="{outerDataProvider}" width="100%" height="100%" variableRowHeight="true">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="name">
                <s:itemRenderer>
                    <fx:Component>
                        <s:DefaultGridItemRenderer />
                    </fx:Component>
                </s:itemRenderer>
            </s:GridColumn>
            <s:GridColumn>
                <s:itemRenderer>
                    <fx:Component>
                        <s:GridItemRenderer>
                            <s:states>
                                <s:State name="normal" />
                                <s:State name="toggled" />
                            </s:states>
                            <s:layout>
                                <s:VerticalLayout />
                            </s:layout>
                            <s:HGroup>
                                <s:DataGrid dataProvider="{data.innerDataProvider}"  columns="{outerDocument.myDynamicGeneratedColumns}">
                                </s:DataGrid>
                                <s:Group>
                                    <s:ToggleButton label="Toggle" />
                                </s:Group>
                            </s:HGroup>

                            <MyComponent width="100%" height="50" includeIn="toggled" />
                        </s:GridItemRenderer>
                    </fx:Component>
                </s:itemRenderer>
            </s:GridColumn>
        </s:ArrayList>
    </s:columns>
</s:DataGrid>

添加内部DataGrid时，我遇到了一些严重的性能问题。垂直滚动速度非常慢。

我一直在努力了解要优化的内容，但我不确定从哪里开始。内部DataGrid需要有一个动态数量的列，我想这是需要完成某些事情的部分之一。

做这样的事情是完全错误的吗？我可以使用除DataGrid之外的其他组件来获得内部网格结构并获得更好的性能吗？

网格基本上是包含图像的网格，具体取决于每行内的值。

有关DataGrid提示的任何建议或链接？

Answer 1

如何使用带有TileLayout的列表作为内部网格。这肯定会表现得更好：

    <s:List>
        <s:layout>
            <s:TileLayout/>
        </s:layout>
    </s:List>

GridItemRenderer中的Flex DataGrid

1 个答案: