dcsimg
A Flash Developer Resource Site

Results 1 to 14 of 14

Thread: [RESOLVED] [F8] Tree --> ScrollPane Combination

  1. #1
    Senior Member
    Join Date
    Sep 2003
    Posts
    356

    [RESOLVED] [F8] Tree --> ScrollPane Combination

    Hi,

    I can get Tree to work with XML using web url's
    I can load scrollpanes through buttons

    But, how do I load a ScrollPane using a tree node??

    What I want to do is... is when someone clicks a node on Tree, it loads a swf into the Scrollpane.

    Simple!!

    Does anyone know how??

    Thanks

    Last edited by FHilton; 02-24-2007 at 05:59 PM.

  2. #2
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    This is what I started with in my XML

    Code:
    <node>
    	<node label="SWF 1" sp.contentPath="1.swf" />
    	<node label="SWF 2" sp.contentPath="2.swf" />
    </node>
    of course it doesn't work.

    Any help would greatly be appreciated!!


  3. #3
    FK'n_dog a_modified_dog's Avatar
    Join Date
    Apr 2003
    Location
    "aaarf"
    Posts
    9,176
    Code:
    // tree component - instance name - theTree
    // scrollpane component - instance name - thePane
    
    var myXML:XML = new XML();
    myXML.ignoreWhite = true;
    myXML.load("images.xml");
    
    myXML.onLoad = function(){
    theTree.dataProvider = this.firstChild;
    theTree.setIsOpen(theTree.getTreeNodeAt(0), true); // set nodes open
    theTree.setIsOpen(theTree.getTreeNodeAt(1), true);
    };
    
    var treeObj:Object = new Object();
    treeObj.change = function(){
    var itemSelected = theTree.selectedItem.attributes;
    thePane.contentPath = itemSelected.data;
    };
    
    theTree.addEventListener("change", treeObj);
    
    /*--images.xml--
    <?xml version="1.0" encoding="UTF-8"?>
    <node>
    
    <child label="Pirate 1">
    <child2 label="image1" data="image1.swf"/ >
    </child>
    
    <child label="Pirate 2">
    <child2 label="image2" data="image2.swf" />
    </child>
    
    </node>
    */
    hth

  4. #4
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    Quote Originally Posted by a_modified_dog
    Code:
    // tree component - instance name - theTree
    // scrollpane component - instance name - thePane
    
    var myXML:XML = new XML();
    myXML.ignoreWhite = true;
    myXML.load("images.xml");
    
    myXML.onLoad = function(){
    theTree.dataProvider = this.firstChild;
    theTree.setIsOpen(theTree.getTreeNodeAt(0), true); // set nodes open
    theTree.setIsOpen(theTree.getTreeNodeAt(1), true);
    };
    
    var treeObj:Object = new Object();
    treeObj.change = function(){
    var itemSelected = theTree.selectedItem.attributes;
    thePane.contentPath = itemSelected.data;
    };
    
    theTree.addEventListener("change", treeObj);
    
    /*--images.xml--
    <?xml version="1.0" encoding="UTF-8"?>
    <node>
    
    <child label="Pirate 1">
    <child2 label="image1" data="image1.swf"/ >
    </child>
    
    <child label="Pirate 2">
    <child2 label="image2" data="image2.swf" />
    </child>
    
    </node>
    */
    hth
    Okay... great... that works!!

    Now, what If I want to load SWF and use nodes as an URL??

    I want to beable to load both using one tree.

    You have been great... thanks


  5. #5
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    Okay... this is my XML...

    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <node>
    	<node label="Flash swf 1">
    		<child2 label="swf 1" data="image1.swf" />
    	</node>
    
    	<node label="Flash swf 2">
    		<child2 label="swf 2" data="image2.swf" />
    	</node>
    
    	<node label="My Bookmarks">
            	<child2 label="Adobe Web site" url="http://www.adobe.com" />
    	</node>
    
    </node>
    I get a strange behavior...

    I can click on "swf 1" and "swf 2" (child nodes) and get the swf to load in the scrollpane.

    However, when I collaspse or just go back and click other places on the tree and then try to click the 2 swf's.... it doesn't work.

    I haven't changed the code in frame 1 (you supplied above)
    Also, I want to beable to launch htm pages too, besides loading swf's.

    Thanks


  6. #6
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    I believe this is where I have to evaluate the selected item and see if it is a data or url that is selected.

    Code:
    var treeObj:Object = new Object();
    treeObj.change = function(){
        var itemSelected = theTree.selectedItem.attributes;
    
        I NEED AN IF STATMENT EVAULATING URL or DATA HERE
    
    }
    What do you think.

  7. #7
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    Well this is what I have.

    Code:
    var treeL:Object = new Object();
    treeL.change = function() {
        var itemSelected = theTree.selectedItem.attributes;
    
        if (itemSelected == itemSelected.attributes.data) {
            thePane.contentPath = itemSelected.data;
        } else if (itemSelected.attributes == itemSelected.attributes.url) {
            getURL(itemSelected, "_self");
        } else {
            thePane.contentPath = "";
       }
    }
    
    theTree.addEventListener("change",treeL);
    But it doesn't work.
    It only works on the first if... it never is true on the else if or else.

    Please help.

  8. #8
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    I did a trace on this and it returns "undefined" when I click a child node "swf 1" or any item in the tree.

    var itemSelected = theTree.selectedItem.attributes;

    Why?

  9. #9
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    I am going to bed.

    My brain is mush trying to fix this.

    Can anybody help??


  10. #10
    FK'n_dog a_modified_dog's Avatar
    Join Date
    Apr 2003
    Location
    "aaarf"
    Posts
    9,176
    try this approach -var treeObj:Object = new Object();
    Code:
    treeObj.change = function(){
    var itemSelected = theTree.selectedItem.attributes;
    theData = itemSelected.data;    trace(theData);
    theURL = itemSelected.url;      trace(theURL);
    if(theURL == undefined){
    thePane.contentPath = theData;
    }
    if(theData == undefined){
    getURL(theURL, "_blank");
    }
    };
    
    theTree.addEventListener("change", treeObj);

  11. #11
    FK'n_dog a_modified_dog's Avatar
    Join Date
    Apr 2003
    Location
    "aaarf"
    Posts
    9,176
    EDIT - additional Boolean var added, prevents error when opening nodes
    change structure of if statements to suit Boolean flag
    Code:
    var treeObj:Object = new Object();
    treeObj.change = function(){
    var OK:Boolean = true;
    var itemSelected = theTree.selectedItem.attributes;
    theData = itemSelected.data;    trace(theData);
    theURL = itemSelected.url;      trace(theURL);
    
    if(theURL == undefined && theData == undefined){
    OK = false;
    thePane.contentPath = null;
    }
    
    if(theData != undefined && OK){
    thePane.contentPath = theData;
    }
    
    if(theURL != undefined && OK){
    getURL(theURL, "_blank");
    }
    
    };
    
    theTree.addEventListener("change", treeObj);

  12. #12
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    Oops... I thought it worked!!!

    Why does clicking on a node return "undefined" (using trace) even when there is a "data" or "url"??

    In the player it works in the IDE, but in a web page it doesn't.

    I am concerned about the "undefined"... it shouldn't be return that except it be a folder.
    Last edited by FHilton; 02-25-2007 at 09:03 AM.

  13. #13
    FK'n_dog a_modified_dog's Avatar
    Join Date
    Apr 2003
    Location
    "aaarf"
    Posts
    9,176
    clicking to open a folder node of the tree fires the treeObj.change function
    as there is no data or url, it returns (as a result of the traces)
    undefined
    undefined

    opening a treeNode containing data, returns
    image1.swf
    undefined

    opening a treeNode containing url, returns
    undefined
    http://www.adobe.com

    hence the need for boolean checks within the if(conditions)

    hth

  14. #14
    Senior Member
    Join Date
    Sep 2003
    Posts
    356
    Man... i figured why it didn't work in the browser.

    I had to close the browser and reopen it. Just refreshing it doesn't clear reiniialize the tree and xml correctly.

    Thanks



    SO IT WORKS!!
    HERE IS THE CODE FOR EVERYONE ELSE

    Code:
    // tree component - instance name = theTree
    // scrollpane component - instance name = thePane
    // create xml file - with file name = "images.xml"
    //<tree>
    //	<folder label="Flash swf 1">
    //		<node label="swf 1" data="image1.swf" />
    //	</folder>
    //	<folder label="Flash swf 2">
    //		<node label="swf 2" data="image2.swf" />
    //	</folder>
    //	<folder label="My Bookmarks">
    //     	<node label="Adobe Web site" url="http://www.adobe.com" />
    //	</folder>
    //</tree>
    
    var xml:XML = new XML();
    xml.ignoreWhite = true;
    
    xml.onLoad = function() {
    	theTree.dataProvider = this.firstChild;
    	theTree.setIsOpen(theTree.getTreeNodeAt(0), true); // set nodes open
    	theTree.setIsOpen(theTree.getTreeNodeAt(1), true);
    	theTree.setIsOpen(theTree.getTreeNodeAt(2), true);
    }
    xml.load("images.xml");
    
    var treeObj:Object = new Object();
    treeObj.change = function(){
    var OK:Boolean = true;
    var itemSelected = theTree.selectedItem.attributes;
    theData = itemSelected.data;    trace(theData);
    theURL = itemSelected.url;      trace(theURL);
    
    if(theURL == undefined && theData == undefined){
    OK = false;
    thePane.contentPath = null;
    }
    
    if(theData != undefined && OK){
    thePane.contentPath = theData;
    }
    
    if(theURL != undefined && OK){
    getURL(theURL, "_blank");
    }
    
    }
    theTree.addEventListener("change", treeObj)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center