1 Reply Latest reply on Jun 3, 2008 6:37 PM by slaingod

    Click on an Image to see the .flv in popup.

    Shelady
      Hi,
      I have done 90% of this project. All I want now is to swap image with .flv. In the project I have 9 pictures. When I click on either of them, the big picture opens in the pop up window and closes up when I click on it.

      What I want it to click on an image to open up the crosponding .flv rather then big image. Here is my code. Please help out.

      Thanks
      main.mxml
      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
      layout="vertical"
      verticalAlign="middle"
      backgroundColor="white">

      <mx:Style>
      global {
      modal-transparency: 0.9;
      modal-transparency-color: white;
      modal-transparency-blur: 9;
      }
      </mx:Style>

      <mx:Script>
      <![CDATA[
      import mx.effects.Resize;
      import mx.events.ResizeEvent;
      import mx.events.ListEvent;
      import mx.controls.Image;
      import mx.events.ItemClickEvent;
      import mx.managers.PopUpManager;

      private var img:Image;

      private function tileList_itemClick(evt:ListEvent):void {
      img = new Image();
      // img.width = 300;
      // img.height = 300;
      img.maintainAspectRatio = true;
      img.addEventListener(Event.COMPLETE, image_complete);
      img.addEventListener(ResizeEvent.RESIZE, image_resize);
      img.addEventListener(MouseEvent.CLICK, image_click);
      img.source = evt.itemRenderer.data.@fullImage;
      img.setStyle("addedEffect", image_addedEffect);
      img.setStyle("removedEffect", image_removedEffect);
      PopUpManager.addPopUp(img, this, true);
      }

      private function image_click(evt:MouseEvent):void {
      PopUpManager.removePopUp(evt.currentTarget as Image);
      }

      private function image_resize(evt:ResizeEvent):void {
      PopUpManager.centerPopUp(evt.currentTarget as Image);
      }

      private function image_complete(evt:Event):void {
      PopUpManager.centerPopUp(evt.currentTarget as Image);
      }
      ]]>
      </mx:Script>

      <mx:WipeDown id="image_addedEffect" startDelay="100" />

      <mx:Parallel id="image_removedEffect">
      <mx:Zoom />
      <mx:Fade />
      </mx:Parallel>

      <mx:XML id="xml" source="gallery.xml" />
      <mx:XMLListCollection id="xmlListColl" source="{xml.image}" />

      <mx:TileList id="tileList"
      dataProvider="{xmlListColl}"
      itemRenderer="CustomItemRenderer"
      columnCount="4"
      columnWidth="125"
      rowCount="2"
      rowHeight="100"
      themeColor="haloSilver"
      verticalScrollPolicy="on"
      itemClick="tileList_itemClick(event);" />

      </mx:Application>


      CustomItemRendere.mxml
      <?xml version="1.0" encoding="utf-8"?>
      <mx:VBox xmlns:mx=" http://www.adobe.com/2006/mxml"
      horizontalAlign="center"
      verticalAlign="middle">

      <mx:Image source="{data.@thumbnailImage}" />

      <mx:Label text="{data.@title}" />

      </mx:VBox>


      gallery.xml
      <?xml version="1.0" encoding="utf-8"?>
      <gallery>
      <image title="Flex"
      thumbnailImage="assets/fx_appicon-tn.gif"
      fullImage="assets/fx_appicon.jpg" />
      <image title="Flash"
      thumbnailImage="assets/fl_appicon-tn.gif"
      fullImage="assets/fl_appicon.jpg" />
      <image title="Illustrator"
      thumbnailImage="assets/ai_appicon-tn.gif"
      fullImage="assets/ai_appicon.jpg" />
      <image title="Dreamweaver"
      thumbnailImage="assets/dw_appicon-tn.gif"
      fullImage="assets/dw_appicon.jpg" />
      <image title="ColdFusion"
      thumbnailImage="assets/cf_appicon-tn.gif"
      fullImage="assets/cf_appicon.jpg" />
      <image title="Flash Player"
      thumbnailImage="assets/fl_player_appicon-tn.gif"
      fullImage="assets/fl_player_appicon.jpg" />
      <image title="Fireworks"
      thumbnailImage="assets/fw_appicon-tn.gif"
      fullImage="assets/fw_appicon.jpg" />
      <image title="Lightroom"
      thumbnailImage="assets/lr_appicon-tn.gif"
      fullImage="assets/lr_appicon.jpg" />
      <image title="Photoshop"
      thumbnailImage="assets/ps_appicon-tn.gif"
      fullImage="assets/ps_appicon.jpg" />
      </gallery>