Flex：使用ArrayCollection过滤Tree

最新推荐文章于 2016-08-24 09:01:34 发布

iteye_2857

最新推荐文章于 2016-08-24 09:01:34 发布

阅读量168

点赞数

分类专栏： flex

本文链接：https://blog.csdn.net/iteye_2857/article/details/82205443

版权

flex 专栏收录该内容

16 篇文章

订阅专栏

Flex中的 Tree 是很难被过滤的，因为它们包含继承的关系。一个可行的方法是使用ArrayCollection作为dataProvider，而且这个ArrayCollection的每一个节点都有一个children属性，每个children也是ArrayCollection.

过滤Tree的一个棘手的问题是，必须确保从子节点到跟节点都被过滤。所以，在下面的例子中，我写了一个function，它将循环每一个节点及其所有的子节点。

过滤的发生是自上而下的，这就意味着一个节点的所有的子节点总是在它自身之前被过滤。这一点很重要，因为通常过滤器将删除所有不匹配某一标准的所有东西。

<?xml version="1.0" encoding="utf-8"?>

<!--http://yecon.blog.hexun.com/30299161_d.html -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" viewSourceURL="srcview/index.html">
   
    <mx:Script>
        <![CDATA[
            import vo.Person;
import mx.collections.ArrayCollection;

[Bindable]
            private var people:ArrayCollection = new ArrayCollection([
                new Person("Grandma Susan", new ArrayCollection([
                    new Person("John", new ArrayCollection([
                        new Person("Timmy"),
new Person("Sammy"),
new Person("Alan")
                    ])),
new Person("Tiffany", new ArrayCollection([
                        new Person("Billy"),
new Person("Adam"),
new Person("Graham"),
new Person("Vennesa")
                    ])),
new Person("Michael", new ArrayCollection([
                        new Person("Jannette"),
new Person("Alan", new ArrayCollection([
                            new Person("Alice"),
new Person("Jane")
                        ]))
                    ])),
new Person("Peter"),
new Person("Cindy", new ArrayCollection([
                        new Person("Paul"),
new Person("David"),
new Person("Joseph"),
new Person("Cameron"),
new Person("Debra"),
new Person("Polly")
                    ]))
                ])) 
]);

private function refreshData():void{
                //reset the root node to its original unfiltered data
                people[0].children = new ArrayCollection(people[0].children.source);
//start the recursion at the root node
                refreshRecursiveChildren(people.source[0]);
//update the Tree after the data has been filtered
                personsTree.invalidateList();
}//end refreshData function
            
private function refreshRecursiveChildren(person:Person):void{
                if(person.children){
                    //loop through each child and filter its children
                    for each(var _person:Person in person.children.source){
                        refreshRecursiveChildren(_person);
}
                    //reset each "children" ArrayCollection to its original unfiltered data
                    person.children = new ArrayCollection(person.children.source);
//set the filterfunction for the newly updated node
                    person.children.filterFunction = filterData;
//run the fitlerFunction
                    person.children.refresh();
}
            }//end refreshRecursiveChildren function
            
public function filterData(item:Object):Boolean{
                //get the string to filter the nodes by
                var searchString:String = iNameFilter.text;
//if string is found in node return true.
                //since the recursive filtering takes place from bottom up, if
                //a collection still has children after filtering, also return true
                if(searchString.length == 0 || item.name.toLowerCase().indexOf(searchString.toLowerCase()) >= 0)
                    return true;
else if(item.children != null && item.children.length > 0)
                    return true;

return false;
}//end filterData function
        
]]>
    </mx:Script>
    
    <mx:VBox width="100%" height="100%" paddingTop="10" paddingBottom="10" paddingLeft="5" paddingRight="5">
        <mx:Tree id="personsTree" dataProvider="{people}" labelField="name" width="100%" height="100%" />
        <mx:HBox>
            <mx:Label text="Filter the Tree:" />
            <mx:TextInput id="iNameFilter" change="refreshData()" />
        </mx:HBox>
    </mx:VBox>

</mx:Application>

//vo.Person.as

package vo{

	//http://yecon.blog.hexun.com/30299161_d.html
    
    import mx.collections.ArrayCollection;

public class Person{
        
        public var name:String;
public var children:ArrayCollection;

public function Person(_name:String, _children:ArrayCollection = null){
            this.name = _name;
if(_children != null)
                this.children = _children;
}//end Person constructor

    }//end Person class
    
}//end package declaration