您的问题是您没有定义可以显示数据的项目渲染器。有关创建自定义 itemrenderer 的信息,请参阅http://help.adobe.com/en_US/Flex/4.0/UsingSDK/WS03d33b8076db57b9-23c04461124bbeca597-8000.html 。
下一步:在您的 ArrayCollection 中,您没有创建新的加载器。这意味着 ArrayCollection 项目 1 指向相同的 laoder 是项目 2。
我添加了一个带有 2 个列表的示例,一个没有渲染器,一个带有自定义渲染器。我没有使用加载器,但是您当然可以创建一个渲染器,它向显示添加一个 laoder,而不是使用 Flex 图像组件。
主要应用:
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
private var _dataProviderList : ArrayCollection = new ArrayCollection(
[
"http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg",
"http://www.joomlaworks.net/images/demos/galleries/abstract/8.jpg"
]
);
]]>
</fx:Script>
<s:layout>
<s:VerticalLayout/>
</s:layout>
<s:List dataProvider="{_dataProviderList}">
</s:List>
<s:List itemRenderer="ImageItemRenderer" dataProvider="{_dataProviderList}">
</s:List>
</s:WindowedApplication>
渲染器
<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
autoDrawBackground="true">
<mx:Image
source="{data}"
width="50" height="50"/>
</s:ItemRenderer>
如果您真的想在 ArrayCollection 中使用 laoder 作为对象,您可以将渲染器编写为:
<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
autoDrawBackground="true">
<fx:Script>
<![CDATA[
[Bindable]
private var _loader : Loader;
private function dataLoaded (evt : Event) : void
{
_loader = (data as Loader)
}
override public function set data(value:Object):void
{
super.data = value;
if (data is Loader) {
// render items may be reuses (http://stackoverflow.com/questions/7328989/itemrenderer-switching-urlloader-images)
(data as Loader).contentLoaderInfo.removeEventListener(Event.COMPLETE, dataLoaded);
// data allready loaded
if ((data as Loader).content) {
_loader = (data as Loader)
}
else {
// wait till data is loaded
(data as Loader).contentLoaderInfo.addEventListener(Event.COMPLETE,dataLoaded);
}
}
}
]]>
</fx:Script>
<mx:Image
source="{_loader}"
width="50" height="50"/>
</s:ItemRenderer>