0 Replies Latest reply on Mar 10, 2007 8:17 AM by shotbyshawn

    from DataGrid to HorizontalList

    shotbyshawn
      I've been able to cobble together from the help files what I need, excluding one problem - it's vertical, but I need it horizontal.

      I THINK the solution would be to rejig it, again according to an Adobe example, with the HBox from the help files. Would someone be able to let me know how I make this set of data etc available to the second code I'll post. Here is what I have working right now, going vertically , when I need it horizontal:

      Working wrong orientation example

      Here is the code for it:

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application
      xmlns:mx=" http://www.adobe.com/2006/mxml"

      viewSourceURL="src/ItemRendererInline/index.html"
      width="100%" height="100%"
      horizontalAlign="center" verticalAlign="middle">
      <mx:Model id="catherine" source="model/catherine.xml" />


      <mx:DataGrid
      rowCount="1" variableRowHeight="true"
      dataProvider="{catherine.piece}"
      showHeaders="false" width="100%" height="100%">

      <mx:columns>

      <!-- Drop-in item renderer: Image control -->
      <mx:DataGridColumn
      dataField="piclink" headerText="Image"
      width="150"

      >
      <mx:itemRenderer>
      <mx:Component>
      <mx:VBox
      width="100%" height="140"

      horizontalAlign="center" verticalAlign="middle"
      >
      <mx:Image source="{'assets/'+data.piclink}"/>

      <!--<mx:Label text="{data.piclink}" />-->
      </mx:VBox>
      </mx:Component>
      </mx:itemRenderer>

      </mx:DataGridColumn>



      </mx:columns>

      </mx:DataGrid>


      </mx:Application>



      What I've found that would probably be a better solution, but I don't understand all the complexities, is right from the help files:

      <?xml version="1.0"?>
      <!-- dpcontrols/HorizontalListDemo.mxml -->
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
      backgroundAlpha="0" creationComplete="srv.send()">

      <mx:Script>
      <![CDATA[
      import mx.utils.ArrayUtil;
      ]]>
      </mx:Script>


      <mx:HTTPService id="srv" url="assets/catalog.xml" useProxy="false"/>

      <mx:ArrayCollection id="catalogAC"
      source="{mx.utils.ArrayUtil.toArray(srv.lastResult.catalog.product)}"/>

      <mx:HorizontalList dataProvider="{catalogAC}"
      width="100%" itemRenderer="Thumbnail"/>
      </mx:Application>


      This is straight from the examples. What I need is my xml file with any number of images to be the provider, and it needs to work as a horizontal layout with nothing more than the images themselves being displayed...like my crooked example in the link. I think...I tried turning the DataGrid 90 degrees, but that's a workaround and I can't actually get it to work properly.

      Any suggestions?

      If eye candy helps, it's meant to be the 'thumbnail' area in my site (currently cobbled together with static crap, and I don't care at this stage if I lose the visual effect - thumbnails plus the scrollbar are fine, under galleries, at the bottom of the page:

      site in progress

      I'd sincerely appreciate any help. This is the XML file, one of many eventually, obviously:

      catherine.xml

      Thanks all.