One day a wanted to incorporate one nice flex photo album for my daughter's site, so i started googling for ready to use open source solutions. The first idea was to use the Flex Book. It's something REALLY REALLY great. BUT! I wanted to have the application so, that it to be configurable. Basically to have the swf and giving the configuration file and the xml with photos definitions, the swf to create the book based on all that. This wasn't too easy, but little by little i started to get the desired result.... till the moment i wanted to have the WIDTH and HEIGHT values set from the configuration file. For some reason it did not work. No errors. Just the book did not show up. After few hours of fighting with it and trying to get in contact with the creator of that excellent component without any success, i gave up (for now).

So, i had to look for some other nice component. And i found the DisplayShelfcomponent. It went MUCH more smoothly. I don't pretend to have it done the best way (especially when i had to move into an Array the photos data read from the XML into an ArrayCollection), but it worked well. And the result of the first version can be seen here.



And if anyone is interested in the actual code i came to, here it is:



<?xml version="1.0" encoding="utf-8"?>
<mx:Application backgroundAlpha="0" backgroundColor="#fdfbfc" initialize="init();" creationComplete="imgData.send();" xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:local="*" height="100%" width="100%" layout="vertical">
   <mx:Script>
      <![CDATA[
         import mx.rpc.events.ResultEvent;
         import mx.collections.ArrayCollection;
         import mx.controls.Alert;
         import mx.core.IUIComponent;

         [Bindable]
         private var imgsXML:String;
         [Bindable]
         private var imgs:ArrayCollection;
         [Bindable]
         private var dataSet:Array;
         private var imgsNumb:Number;
         
         private function init():void
         {
            imgsXML = Application.application.parameters.loc + '?' + Math.random()
         }

         private function imgDataHandler(event:ResultEvent):void
         {
            imgs=event.result.images.image;
            dataSet = new Array();
            imgsNumb = event.result.images.image.length;
            for(var i:uint; i < imgsNumb; i++)
            {
               dataSet[i] = imgs[i].src;
            }
         }
]]>
   </mx:Script>
   <mx:HTTPService id="imgData" url="{imgsXML}" result="imgDataHandler(event)"/>

   <local:DisplayShelf id="shelf" horizontalCenter="0" verticalCenter="0"
      borderThickness="10" borderColor="#FFFFFF" dataProvider="{dataSet}" enableHistory="false" width="100%"/>
</mx:Application>