Flex中图片绑定的一点感触

????? 昨天由于工作的需要，要在FelxViewer原有框架的基础上添加一个widget。Widget主要是显示一些图例和文字。于是我在widget中放置了一个DataGrid，DataGrid有两列，一列放置图片，一列显示文字。

下面是在Flex4中，dataGrid里面放置Image的mxml代码。

?????<mx:DataGridColumn headerText="图例" dataField="image">
??????<mx:itemRenderer>
???????<fx:Component>
????????<mx:Image? width="100" height="50" source="{data.image1}">
????????</mx:Image>
???????</fx:Component>
??????</mx:itemRenderer>
?????</mx:DataGridColumn>

刚开始的时候，我直接在source中设置的图片的路径，可惜就是不显示图片。于是我怀疑自己路径写错了。从双引号改为单引号，能想的办法都想了。后来从网上看到一个老外说图片的路径最好用bindable和embed绑定，不然的话可能会显示不出来。实验了一下果然如此。

???[ Bindable]
???[Embed(source="assets/images/globe.png")]
???public var imgObject:Class;
???
???[Bindable]
???[Embed(source="assets/images/cn.png")]

???public var imgObject2:Class;?private var dataProvider:ArrayCollection;
??????protected function LegendWdg_creationCompleteHandler(event:FlexEvent):void
???{
????dataProvider=new ArrayCollection([{image1:imgObject,content:"图例一"},{image1:imgObject2,content:"图例二"}]);
????legendDG.dataProvider=dataProvider;
???}

还有一点需要说明。因为我是一个菜鸟，之前没在Flex中用过datagrid。刚开始的时候我以为就只要设置好dataProvider=dataProvider; 就可以了呢。没有写source="{data.image1}"。导致我费了一些时间。写了dataProvider=dataProvider这句话只代表把数据放置到data中，还需要在source中设置一下。