halo的grid DataGridColumn itemRenderer 混用 spark 组件

Halo的gridDataGridColumnitemRenderer与spark组件混用技巧

最新推荐文章于 2025-05-26 21:00:00 发布

原创最新推荐文章于 2025-05-26 21:00:00 发布 · 239 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#大数据

Adobe 专栏收录该内容

69 篇文章

订阅专栏

本文详细介绍了在Halo中如何正确地在DataGridColumn itemRenderer中使用图片，并强调了避免在DataGridColumn节点中定义dataField映射的重要性，通过实例演示了如何使用spark组件实现图片显示。

halo的grid DataGridColumn itemRenderer 混用 spark 组件

一般在 halo DataGridColumn itemRenderer 中使用图片在数据源中定义好了

例如：

<fx:Declarations>
<s:ArrayCollection id="slideShowData"> <fx:Array> <fx:Object name="Flash Player" bu="Platform" icon="@Embed(source='assets/icons/1.png')" /> </fx:Array>
</s:ArrayCollection>
</fx:Declarations>

1.itemRenderer 使用halo组件

注意：一定不要在 DataGridColumn 节点中定义 dataField映射的列，否则图片不出来（笔者亲自测试过）

例如：<mx:DataGridColumn headerText="Business Unit" dataField="icon">
<mx:itemRenderer>。。。。

<mx:DataGridColumn headerText="Business Unit" >
<mx:itemRenderer>
<fx:Component> 
<mx:Image source="{data.icon}" width="50" height="50" />
 </fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>

强制使用 spark 在 itemRenderer中使用image的话是一个错误：如图：

需要这样做：代码如下：

<mx:DataGridColumn headerText="Business Unit" >
<mx:itemRenderer>
<fx:Component>
<s:MXDataGridItemRenderer>
<s:Image source="{data.icon}" width="50" height="50" />
</s:MXDataGridItemRenderer>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>