flex中扩展combobox功能

近段时间在忙flex的东西,边学习边使用。里边有个ComboBox,类似html中的select,由于业务的需求在ComboBox的基础上,增加了模糊查询的功能,便于以最快的方式找到需要选中的项,跟大家分享一下,源代码如下:

package mycomponent
{
import mx.controls.ComboBox;
import flash.events.Event;
import flash.events.TextEvent;
import mx.controls.TextInput;
import mx.controls.ComboBase;
import mx.core.IDataRenderer;
import mx.controls.listClasses.IDropInListItemRenderer;
import mx.controls.listClasses.IListItemRenderer;
import mx.core.mx_internal;
import mx.collections.ArrayCollection;

use namespace mx_internal;
/**
  * 该类实现下拉列表的模糊匹配
  */
public class AutoCompleteComboBox extends ComboBox implements IDataRenderer, IDropInListItemRenderer,
                      IListItemRenderer
{
  /**
   * 格式:node节点中至少含有name属性
   *    <nodes>
   *        <node name="" ..../>
   *    </nodes>
   */
 
  public var nodesXmlStr:String = "";
  private var filterNodesXmlObj:XML = <nodes></nodes>; 
  private var selectedFlag:Boolean = true;
  public function AutoCompleteComboBox():void{
   super();
   init();  
  }
  private function init():void{
   this.createChildren();
  
  }
  override protected function textInput_changeHandler(event:Event):void{
   super.textInput_changeHandler(event);
   //trace("###");   
   searchMatchest();
  }
  override public function set selectedIndex(value:int):void{
      if(selectedFlag){
          super.selectedIndex = value;
       }
            selectionChanged = false;
         invalidateDisplayList();
         //trace(selectedIndex);
     }
     override public function set dataProvider(value:Object):void{
      if(selectedFlag){
          selectionChanged = true;
      }
      else{
       selectionChanged = false;
      }
   //trace("######"+XMLList(value).toXMLString());
   super.dataProvider =  new ArrayCollection();
         super.dataProvider = value;

     }
    
  private function searchMatchest():void{
   //trace(nodesXmlStr);
   if(nodesXmlStr!=""){
    selectedFlag = false;
    var inputValue:String = textInput.text;  
    var xmlList:XMLList = XMLList(XML(nodesXmlStr).node);
    var nodeNum:uint = xmlList.length();
    //trace(nodeNum);
    //trace("inputValue="+inputValue);
    if(inputValue==""){
     this.dataProvider = XML(nodesXmlStr).node;
     //trace("all="+nodesXmlStr);
    }
    else{
     filterNodesXmlObj = <nodes></nodes>;
     for(var nodeIndex:uint = 0 ; nodeIndex < nodeNum ; nodeIndex++){
      var xmlObj:XML = XML(xmlList[nodeIndex]);
      //trace(String(xmlObj.attribute("name")).indexOf(inputValue));
      //trace(String(xmlObj.attribute("name")));
      if(String(xmlObj.attribute("name")).indexOf(inputValue)>-1){
       //trace(String(xmlObj.attribute("name")).indexOf(inputValue));
       //trace(String(xmlObj.attribute("name")));
       filterNodesXmlObj.appendChild(xmlObj);   
      }
     }
     this.dataProvider = filterNodesXmlObj.node;
    }
    dropdown.selectedIndex = -1;
    dropdown.verticalScrollPosition = 0 ;
    open();
    selectedFlag = true;
   }
  }
  private function get nodesStr():String{
   return this.nodesXmlStr;
  }
  private function set nodesStr(str:String):void{
   this.nodesXmlStr = str;
  }
}
}

使用方式,在mxml文件的标签里边直接用<mycomponent:AutoCompleteComboBox   nodesXmlStr=""/>即可

注意:nodesXmlStr这个属性一定要设置,设置为AutoComplete的数据源的xml字符串,xml格式在类中已有说明
转自:http://blog.csdn.net/liyong1115/archive/2009/11/07/4782760.aspx

你可能感兴趣的:(xml,.net,Flex,Blog,Flash)