3 Replies Latest reply on Sep 26, 2009 10:13 AM by DilipShah

    how to hide a tree component node?

    DilipShah Level 1
      <node type="folder" name="root" visible="true">
         <node type="folder" name="child1" visible="false"/>
         <node type="folder" name="child2" visible="true"/>
      </node>

      to be included in the tree being rendered or not based on the visible attribute.

       

      Any suggestions / pointers?

        • 1. Re: how to hide a tree component node?
          _Natasha_ Level 4

          Create custom dataDescriptor for tree and override function getChildren to filter data with @visible="false"

          • 2. Re: how to hide a tree component node?
            DilipShah Level 1

            Thanks Natasha... that did the trick! I'll post simple code in a day or two.

            • 3. Re: how to hide a tree component node?
              DilipShah Level 1

              Here is the code (altered a bit to simplify)...

               

              Here is the Tree component in the MXML file:
              <mx:Tree id="tree" width="40%" height="500"
                  dataProvider="{model.library}"
                  labelFunction="treeLabel"
                  iconFunction="treeIcon"
                  dragEnabled="true" dropEnabled="true"
                  change="treeChangeHandler(event)"
                  itemRenderer="view.renderer.CustomTreeItemRenderer"
                  dataDescriptor="{new view.dataDescriptor.ResourceTreeDataDescriptor()}"
              />

               

              ResourceTreeDataDescriptor.as file is as follows:
              package view.dataDescriptor
              {
                  import model.OCModelLocator;
                 
                  import mx.collections.ICollectionView;
                  import mx.collections.XMLListCollection;
                  import mx.controls.treeClasses.ITreeDataDescriptor;
                 
                  public class ResourceTreeDataDescriptor implements ITreeDataDescriptor
                  {
                      private var model:OCModelLocator = OCModelLocator.getInstance();

               

                      public function ResourceTreeDataDescriptor()
                      {
                      }
                     
                      /**
                       * Returns children whose 'status' attribute is not 'deleted'.
                       *
                       * Since the data in the model need to be preserved, a copy is made to return to the tree control
                       * with only those elements that need to be displayed.
                       *
                       */
                      public function getChildren(node:Object, model:Object=null):ICollectionView
                      {
                          // generate XMLList collection of immediate elements of the node
                          var nodeElementsOriginal:XMLListCollection = new XMLListCollection(node.elements());
                         
                          // get an empty XMLList ready to add children whose status indicate that they need to be visible
                          var nodeElementList:XMLList = new XMLList();
                         
                          for each (var resource:XML in nodeElementsOriginal) {
                              // as the status indicate, decide to add / ignore the child
                              if (resource.@status != 'deleted') {
                                  nodeElementList += resource;
                              }
                          }
                         
                          // get XMLListCollection from the XMLList
                          var nodeElements:XMLListCollection = new XMLListCollection(nodeElementList);

               

                          return nodeElements;
                      }
                     
                      public function hasChildren(node:Object, model:Object=null):Boolean
                      {
                          if (node.resource != "") {
                              return true;
                          } else {
                              return false;
                          }
                      }
                     
                      public function isBranch(node:Object, model:Object=null):Boolean
                      {
                          if (node.@isBranch == "true") {
                              return true;
                          } else {
                              return false;
                          }
                      }
                     
                      public function getData(node:Object, model:Object=null):Object
                      {
                          return node.resource;
                      }
                     
                      public function addChildAt(parent:Object, newChild:Object, index:int, model:Object=null):Boolean
                      {
                          return false;
                      }
                     
                      public function removeChildAt(parent:Object, child:Object, index:int, model:Object=null):Boolean
                      {
                          return false;
                      }
                  }
              }

               

              You can get some explanation on implemeting ITreeDataDescriptor in Flex 3 Cookbook (O'Reilly publication).