Question

我正在尝试在Flex移动网格中渲染图像，但我无法显示MobileGridBitmapCellRenderer。没有可见的图像。

有人看错了吗？这是我的代码：

<ns:MobileGrid  id="myDataGrid" textAlign="left" width="100%" height="100%" borderVisible="true" dataProvider="{pDataCollection}"
                   sortChange="myDataGrid_sortChangeHandler(event)" scrollSnappingMode="leadingEdge" change="myDataGrid_changeHandler(event)"
                   touchInteractionEnd="myDataGrid_touchInteractionEndHandler(event)">
        <ns:columns>
            <ns:MobileGridColumn dataField="id" width="8%">
                <ns:itemRenderer>
                    <fx:Component>
                        <ns:MobileGridBitmapCellRenderer source="@Embed('images/espn-profile-pics/tiny4821.png')"  width="100%" />

                    </fx:Component>
                </ns:itemRenderer>
            </ns:MobileGridColumn>
            <!--ns:MobileGridColumn dataField="player">
            <ns:itemRenderer>
            <fx:Component>
            <ns:MobileGridTextCellRenderer labelField="player"/>
            </fx:Component>
            </ns:itemRenderer>
            </ns:MobileGridColumn-->
            <ns:MobileGridColumn dataField="player" width="22%"/>
            <ns:MobileGridColumn  dataField="year" width="9%"/>
            <ns:MobileGridColumn  dataField="team" width="9%" />
        </ns:columns>       
    </ns:MobileGrid>

然而，MobileGridTextCellRenderer工作得很好。我已经阅读了以下文档，但我仍然没有得到它。

http://apache-flex-users.2333346.n4.nabble.com/MobileGrid-Usage-Example-td5308.html http://flex.apache.org/asdoc/spark/components/itemRenderers/IMobileGridCellRenderer.html http://flex.apache.org/asdoc/spark/components/itemRenderers/MobileGridBitmapCellRenderer.html

如果我为itemRanderer尝试此代码：

  <ns:itemRenderer>
    <fx:Component>
            <s:Image source="@Embed('images/espn-profile-pics/tiny4821.png'" width="100%" />
     </fx:Component>
</ns:itemRenderer>

我收到运行时错误：

错误：MobileGridColumn项呈示器必须实现spark.components.itemRenderers.IMobileGridCellRenderer

Answer 1

  <ns:itemRenderer>
    <fx:Component>
            <s:Image source="@Embed('images/espn-profile-pics/tiny4821.png'" width="100%" />
     </fx:Component>
</ns:itemRenderer>

此代码的问题是Image不是有效的ItemRenderer，您需要将Image包装在某些内容中，例如:(编辑：代码更新）

<ns:MobileGridColumn dataField="id" width="8%">
                <ns:itemRenderer>
                    <fx:Component>
                        <ns:MobileGridTextCellRenderer>
                            <s:Image source="@Embed('images/espn-profile-pics/tiny4821.png'" width="100%" />
                        </ns:MobileGridTextCellRenderer>
                    </fx:Component>
                </ns:itemRenderer>
            </ns:MobileGridColumn>

Answer 2

通过使用MobileGridBitmapCellRenderer iconFunction，我可以按照this page

中所述嵌入图像

有几个问题仍然存在。

比例模式＆＃34;重复＆＃34;是我能看到图像的唯一模式。
我想使用MobileGrid数据源中的动态图像。这时我必须使用AS3中的嵌入来声明一个图标。
我想在同一个单元格中组合图像和文本。

理想情况下，我可以简单地指定source属性。

Flex移动网格单元格渲染器 - 图像

2 个答案: