2 Replies Latest reply on Jun 29, 2011 11:03 AM by UbuntuPenguin

    rendering Images from a s:Arraylist and datagroup

    Energetic Pixels

      Ok, I have one last problem that is perplexing me.  I am seeing the following when I run my application:




      In my code I have main.mxml:



                <!--<mx:HTTPService id="mediaData" url="http://www.serco-hrc.com/SNAmedia/pictures.xml" />-->
                <s:ArrayList id="tempData">
                     <fx:String>1 Picture</fx:String>
                     <s:BitmapImage source="SNA_media/pictures/1.jpg"/>
                     <fx:String>2 Picture</fx:String>
                     <s:BitmapImage source="SNA_media/pictures/2.jpg"/>
                     <fx:String>3 Picture</fx:String>
                     <s:BitmapImage source="SNA_media/pictures/3.jpg"/>
                     <fx:String>4 Picture</fx:String>
                     <s:BitmapImage source="SNA_media/pictures/4.jpg"/>
           <s:HGroup left="10" top="78" width="100%">
                <s:Panel id="thumbsPanel" title="Thumbnails">
                     <s:DataGroup id="mediaGroup" dataProvider="{tempData}" itemRenderer="components.NameDisplay">
                               <s:VerticalLayout useVirtualLayout="true" />
                     <s:VScrollBar right="0" height="100%" viewport="{mediaGroup}"/>



      There are other panels within my HGroup that have been commented out and have nothing to do with my issue here.  In my components.NameDisplay:



      <s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                     import spark.skins.spark.DefaultComplexItemRenderer;
                     import spark.skins.spark.DefaultItemRenderer;
                     private function rendererFunction(item:Object):ClassFactory {
                          if (item is String) {
                               return new ClassFactory(NameDisplay);
                          } else {
                               return new ClassFactory(DefaultComplexItemRenderer);
                <s:State name="normal"/> 
                <s:State name="hovered"/> 
           <s:Image width="100" height="100"
                      horizontalAlign="center" verticalAlign="middle"></s:Image>
           <s:Label text="{data}"
                      height="30" width="40"
                      color="black" textAlign="center"




      My images are coming from a Linked folder within my project as in:




      After all this, I thought I did everything correctly.  Why are my images not showing up when I run my application?????



        • 1. Re: rendering Images from a s:Arraylist and datagroup
          Energetic Pixels Level 1

          I finally figured out that I will have to absolute address my images within my s:ArrayList.  I thought I could use a project "linked folder" as a go-between, but that schema is not working as I envisioned. So my arraylist now looks like:


          <s:ArrayList id="tempData">
                         <fx:String>1 Picture</fx:String>
                         <s:BitmapImage source="I:\Documents\development\SERCO\SNA_media\pictures\1.jpg"/>
                         <fx:String>2 Picture</fx:String>
                         <s:BitmapImage source="I:\Documents\development\SERCO\SNA_media\pictures\2.jpg"/>
                         <fx:String>3 Picture</fx:String>
                         <s:BitmapImage source="I:\Documents\development\SERCO\SNA_media\pictures\3.jpg"/>
                         <fx:String>4 Picture</fx:String>
                         <s:BitmapImage source="I:\Documents\development\SERCO\SNA_media\pictures\4.jpg"/>


          Atleast my images are now displaying in the panel. Now if I could figure out why that "[Object Bitmap" text is showing up over the top of my images.


          Any suggestions???  I have not changed anything in my code, yet.



          • 2. Re: rendering Images from a s:Arraylist and datagroup
            UbuntuPenguin Level 4

            I would suggest you use a custom itemrenderer to show your images and the associated label.