0 Replies Latest reply on Jan 8, 2007 11:38 PM by ][odine

    get images into tilelist

    ][odine
      Hey,

      I am trying to make something that will have a list on the left, and a tileList on the right. When a user clicks on a list item, it changes the imageset lets call it, in the tileList. (eg. list item 1 loads imageset1 into the tile list and so forth)

      Now i have been having a few issues with this. First issue, I am using arrays (i think) to hold the sets of images, then when the list item passes the .data, the corosponding set is loaded. Well for one...is that how i should be doing this?

      Second issue, it seems that the images are being loaded in as thumbnails or something...they are about 50% the size i would say of the original, and thats just not on! i cant figure out why!, eventually - i want 2 columns of images at full size (going to be small banners)

      I have just been trying to piece together bits from the help file and such to make some hodge podge app, Im just learning! so...it sort of works, the first two anyway - except as i said, there somming through 50% the size

      *sidenote* if any of you can tell from lookig at my code (attached at the bottom) if i click on either the first or second item it loads 4 images virtically, left aligned into the tileList at about 50% size. and i can click back and forth between them and it changed the images but keeps the size and the layout. if i click the first or second one, then any of the others (with no code attatched to them) then click back on the same one again (first or second) 2 out of the 4 images go full sized, and they arrange themselved 2x2...go figure? i think it may have soething to do with the initCatalog being called twice? i dont know...help?

      Cheers!

      --][--




      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">
      <mx:Model id="myCategories">
      <categories>
      <categories label="Zen" data="zen"/>
      <categories label="Music" data="music"/>
      <categories label="Black And White" data="black and white"/>
      <categories label="Flowers/Nature" data="flowers/nature"/>
      <categories label="Grunge" data="grunge"/>
      <categories label="Animals" data="animals"/>
      <categories label="Multicolored" data="multicolored"/>
      <categories label="Water" data="water"/>
      <categories label="Glitter/Sparkly" data="glitter/sparkly"/>
      <categories label="Fantasy" data="fantasy"/>
      <categories label="Textured" data="textured"/>
      <categories label="Fashion" data="fashion"/>
      <categories label="Patterns" data="patterns"/>
      <categories label="Animated" data="animated"/>
      </categories>
      </mx:Model>
      <mx:Script>
      <![CDATA[
      [Bindable]
      public var selectedItem:Object;

      import mx.collections.*;
      import mx.controls.Image;

      private var zencatalog:ArrayCollection;
      private static var zengroup:Array = [
      "assets/group1/1.gif", "assets/group1/2.gif",
      "assets/group1/3.gif", "assets/group1/4.gif"
      ];
      private var musiccatalog:ArrayCollection;
      private static var musicgroup:Array = [
      "assets/group2/3.gif", "assets/group2/4.gif",
      "assets/group2/2.gif", "assets/group2/1.gif"
      ];
      // Initialize the HorizontalList control by setting its dataProvider
      // property to an ArrayCollection containing the items parameter.
      private function initCatalog(items:Array):void
      {
      zencatalog = new ArrayCollection(items);
      musiccatalog = new ArrayCollection(items);
      }
      private function load(event:Event):void{
      this.selectedItem=List(event.target).selectedItem
      switch(selectedItem.data){
      case 'zen':
      initCatalog(zengroup)
      group_List.dataProvider = zencatalog
      break;
      case 'music':
      initCatalog(musicgroup)
      group_List.dataProvider = musiccatalog
      break;
      }
      }
      ]]>
      </mx:Script>

      <mx:Canvas left="10" top="10" right="10" bottom="10">
      <mx:Panel y="0" width="31%" height="100%" layout="absolute" left="0" id="categoryview">
      <mx:List id="source" height="100%" width="100%" dataProvider="{myCategories.categories}" change="load(event)"/>
      </mx:Panel>
      <mx:Panel y="0" width="68%" height="100%" layout="absolute" right="0" title="{group_List.selectedItem.data}" id="catalogview">
      <mx:TileList right="0" left="0" top="0" bottom="0" itemRenderer="mx.controls.Image" id="group_List" direction="vertical" columnCount="2"/>
      </mx:Panel>
      </mx:Canvas>

      </mx:Application>