2 Replies Latest reply on Mar 21, 2011 4:03 PM by tjay99

    States and XML mix

    tjay99

      Hi Everyone,

       

      I am hoping someone can help, as this code is now above my skill level.

       

      Currently I have these two mxml files running fine:

       

       

      ====================

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" horizontalAlign="center" horizontalCenter="0" verticalScrollPolicy="off" horizontalScrollPolicy="off" scroll="false" layout="absolute" applicationComplete="init()" focusRect="false" showStatusBar="false" showTitleBar="false" showFlexChrome="false" borderStyle="none" creationComplete="readXMLContent();">

       

      <mx:Script>
          <![CDATA[

       

      private function init():void
      {
          systemManager.stage.displayState=flash.display.StageDisplayState.FULL_SCREEN_INTERACTIVE
          }
          ]]>
      </mx:Script>

       

          <mx:Script>
              <![CDATA[
                  import mx.controls.Alert;
                  import mx.utils.ObjectProxy;
                  import mx.rpc.events.ResultEvent;
                  [Bindable]
                 
                  public var xml:XML = new XML(); 
                 
                  private var userManualObj:ObjectProxy;
                  private function loadModelData(event:ResultEvent):void
                  {
                      userManualObj=event.result.UserManual;
                  }
                  private function readXMLContent():void
                  {
                                 
                      var reportDir:File = File.userDirectory.resolvePath("myassets");
                      var xmlFile:File;
                      var fileStream:FileStream = new FileStream();
                      xmlFile = reportDir.resolvePath("screen.xml");
                      if(xmlFile.exists && xmlFile.size > 0)// Checking if the UserGuide.xml file already exists and the file is not empty
                      {
                      var stream:FileStream = new FileStream();
                  //var xml:XML = new XML();
                      stream.open(xmlFile, FileMode.READ);
                      xml = XML(stream.readUTFBytes(stream.bytesAvailable));
                      var strXml:String = xml.toXMLString();
                      //Alert.show(strXml);
                      //trace(strXml);
                      stream.close();
                      }
                  }                                   
                             
              ]]>
          </mx:Script>

       


              
               <mx:XMLListCollection id="xmlCollection" source="{xml.content.item.file}" />  
                    
                   <mx:TileList
                       height="100%"
                       width="100%"
              id="tileListCtrl"
              dataProvider="{xmlCollection}"
              itemRenderer="ImageRenderer"
              columnCount="1"
              rowCount="1"
              scroll="false"
              borderStyle="none" themeColor="#000000" borderColor="#ff0000"
               paddingBottom="0"
                 paddingLeft="0"
                  paddingRight="0"
                   paddingTop="0"
                   horizontalScrollPolicy="off"
                   verticalScrollPolicy="off"
                           />

       

      </mx:WindowedApplication>

       

       

      =============

       

       

      <?xml version="1.0" encoding="utf-8"?>    
      <mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" verticalScrollPolicy="off" horizontalScrollPolicy="off" borderStyle="none" scroll="false" backgroundColor="#000000" horizontalAlign="center" initialize="vbox1_initializeHandler(event);">    
          <mx:Script>  
              <![CDATA[  
              import mx.events.FlexEvent;
              protected function vbox1_initializeHandler(event:FlexEvent):void
      {
      //images directory  
      var reportDir:File = File.userDirectory.resolvePath("myassets");  
      var imagePath:File;    
      //image name from xml file     
      imagePath = reportDir.resolvePath(data.@showimage);  
      // we got the complete system path   
      myImage.source = imagePath.url;  
       
      //when we trace the path looks like   
      //file:///C:/Users/Administrator/Desktop/myassets/myImage.JPG
      }       
              ]]>  
          </mx:Script>  
         
         

       

          <mx:Image id="myImage" width="100%" height="100%" verticalCenter="0" horizontalCenter="0" horizontalAlign="center" verticalAlign="middle"/>

       


      </mx:VBox>

       

       

      =========================

       

       

      But I need to add the following functionality to determine whether <mx:Image> or <mx.VideoDisplay> needs to be used:

       

       

      =========================

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
          currentState="videoState" creationComplete="init()">

          <mx:Script>
              <![CDATA[
                  import mx.controls.Alert;

                  private function init():void
                  {
                      fileSystemTree.directory = File.desktopDirectory;
                  }

                  private function browseDir(e:Event):void
                  {
                      var dir:File = new File();
                      dir.browseForDirectory("Select directory");
                      dir.addEventListener(Event.SELECT, onDirSelect);
                  }

                  private function onDirSelect(event:Event):void
                  {
                      fileSystemTree.directory = event.currentTarget as File;
                  }

                  private function onChange(e:Event):void
                  {
                      var file:File = e.currentTarget.selectedItem as File;
                      if(!file.isDirectory)
                      {

                          var viewer:Object;
                          switch(file.extension.toLowerCase())
                          {
                              case "flv":
                                  currentState = "videoState";
                                  viewer = videoDisplay;
                                  break;
                              case "png":                       
                              case "jpg":
                                  currentState = "imageState";
                                  viewer = image;
                                  break;
                              default:
                                  Alert.show("Unsupported file " + file.nativePath, "Error");
                                  return;
                          }

                          viewer.source = file.url;
                      }
                  }

              ]]>
          </mx:Script>

          <mx:HDividedBox width="100%" height="100%" paddingLeft="10" paddingRight="10" paddingBottom="10" paddingTop="10">
              <mx:VBox width="200" height="100%">
                  <mx:Button label="Change Directory" click="browseDir(event)" />
                  <mx:FileSystemTree id="fileSystemTree" width="100%" height="100%"
                      change="onChange(event)" />
              </mx:VBox>

              <mx:Canvas width="100%" height="100%" id="content" />

          </mx:HDividedBox>

          <mx:states>
              <mx:State name="videoState">
                  <mx:AddChild relativeTo="{content}">
                      <mx:VideoDisplay id="videoDisplay" width="100%" height="100%" />
                  </mx:AddChild>
              </mx:State>
              <mx:State name="imageState">
                  <mx:AddChild relativeTo="{content}">
                      <mx:Image id="image" width="100%" height="100%" />
                  </mx:AddChild>
              </mx:State>
          </mx:states>

      </mx:WindowedApplication>

       

      ==============================

       

       

      I really don't know where to start, as I am not using <mx:WIndowApplication> instead I am using <mx:VBox> to currently display media. This was the only way I could get everyone to work how I wanted to.

       

      If anyone can provide code snippets, it would be greatly appreciated.

       

      Thanks

       

      Tim

        • 1. Re: States and XML mix
          rtalton Level 4

          Looks like you are trying to merge two different AIR projects together. Try reading the help docs for custom components to see how to set up a component with the logic you need to do this.

          • 2. Re: States and XML mix
            tjay99 Level 1

            Hi,

             

            I get the general idea about components, but I am trying to merge only part of the last script with my original. Basically this part:

             

             

             

            ===========

             

              switch(file.extension.toLowerCase())
                                 {
                                    case "flv":
                                         currentState = "videoState";
                                        viewer =  videoDisplay;
                                        break;
                                     case "png":                       
                                    case  "jpg":
                                        currentState =  "imageState";
                                        viewer =  image;
                                        break;
                                     default:
                                        Alert.show("Unsupported file " +  file.nativePath, "Error");
                                         return;
                                }

             

                                viewer.source =  file.url;
                            }
                        }

             

                    ]]>
                 </mx:Script>

             

                <mx:HDividedBox width="100%" height="100%"  paddingLeft="10" paddingRight="10" paddingBottom="10"  paddingTop="10">
                    <mx:VBox width="200"  height="100%">
                        <mx:Button label="Change Directory"  click="browseDir(event)" />
                        <mx:FileSystemTree  id="fileSystemTree" width="100%" height="100%"
                             change="onChange(event)" />
                    </mx:VBox>

             

                     <mx:Canvas width="100%" height="100%" id="content" />

             

                 </mx:HDividedBox>

             

                <mx:states>
                    <mx:State  name="videoState">
                        <mx:AddChild  relativeTo="{content}">
                            <mx:VideoDisplay  id="videoDisplay" width="100%" height="100%" />
                         </mx:AddChild>
                    </mx:State>
                    <mx:State  name="imageState">
                        <mx:AddChild  relativeTo="{content}">
                            <mx:Image id="image"  width="100%" height="100%" />
                        </mx:AddChild>
                     </mx:State>
                 </mx:states>

             

            </mx:WindowedApplication>

             

            ================

             

             

             

             

             

            so I can still use the XML loading section.

             

            Are you able to write something for me by any chance, to at least get me moving in the right direction?

             

             

            Thanks

             

            Tim