1 Reply Latest reply on Jan 14, 2007 7:29 AM by peterent

    How to display Image by using Array?

    weiwuliang
      Hi all, I know to how to display the image in MXML by using AS 3.0
      like this:
      <?xml version="1.0"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" width="100" height="80" borderStyle="solid">
      <mx:Script>
      <![CDATA[
      [Embed(source="logo.gif")]
      [Bindable]
      public var imgCls:Class;
      ]]>
      </mx:Script>
      <mx:Image source="{imgCls}"/>
      <!--OR-->
      <mx:Image source="@Embed('assets/Nokia_6630.png')"/>
      </mx:Application>

      But the thing is I am building a list for display the images, the values is come from the Array. I am trying a different way for display it but no working, here is my code:

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml">
      <mx:Script>
      <![CDATA[
      public var PICTURE_ARRAY:Array = [{label:"FileA", icon:"@Embed('upload/myjpg.jpg')"},
      {label:"FileC", icon:"@Embed('upload/myjpg.jpg')"},
      {label:"FileB", icon:"@Embed('upload/myjpg.jpg')"}]
      ]]>
      </mx:Script>
      <mx:Tile id="pictureSelection" height="180" width="500" borderStyle="solid">
      <mx:Repeater id="picRP" dataProvider="{PICTURE_ARRAY}">
      <mx:VBox horizontalAlign="center" verticalAlign="middle" verticalGap="0" borderStyle="none" width="100" height="100">
      <mx:Image width="80" height="80" source="{picRP.currentItem.icon}" toolTip="{picRP.currentItem.icon}"/>
      <!--
      I also tryed this as well:
      set the icon value as picture location like: "A.jpg" or "B.jpg"
      then
      <mx:Image width="80" height="80" source="@Embed('upload/{picRP.currentItem.icon}')" />
      -->
      <mx:Label text="{picRP.currentItem.label}" width="100" textAlign="center"/>
      </mx:VBox>
      </mx:Repeater>
      </mx:Tile>
      </mx:Application>

      Can anyone tell how to display the array value into Image tag? Thanks
        • 1. Re: How to display Image by using Array?
          peterent Level 2
          In your data you have this:
          {label:"FileC", icon:"@Embed('upload/myjpg.jpg')"},

          change it to this:
          {label:"FileC", icon:"upload/myjpg.jpg"}, // this is just the filename, not embedded

          In your Repeater you have this Image tag:
          <mx:Image width="80" height="80" source="{picRP.currentItem.icon}" toolTip="{picRP.currentItem.icon}"/>

          which is fine, except for the toolTip. The toolTip uses a string, not an image. If you want to show an image in the toolTip, you'll need to write your own toolTip class.

          Now the source property of the image will be given the URL to the image which will then be requested from the server and downloaded at runtime - it is not embedded.

          If you need to embed the images, then your dataProvider should have the variable name associated with the embedded image.