Flex 다중 선택 ComboBox

말을 많이 하면 묵적이 생기고, 직접 코드를 붙인다.
 
MyClassFactory 클래스는 다음과 같습니다.
	import flash.display.DisplayObject;
	
	import mx.core.ClassFactory;
	import mx.states.OverrideBase;
	
	public class MyClassFactory extends ClassFactory
	{
		public function MyClassFactory(generator:Class=null)
		{
			super(generator);
		}
		private var eventArray:Array=new Array();
		private var _properties:Array=new Array();
		public function addInitEventListener(type:String, listener:Function, useCapture:Boolean=false, priority:int=0,useWeakReference:Boolean=false):void{
			eventArray.push({type:type,listener:listener,useCapture:useCapture,priority:priority,useWeakReference:useWeakReference});
		}
		public function addInitProperties(key:String,value:*):void{
			_properties.push({key:key,value:value});
		}
		
		override public function newInstance():*{
			trace("MyClassFactory.newInstance();");
			var obj:*=super.newInstance();
			var event:Object;
			if(eventArray!=null&&eventArray.length>0&&obj as DisplayObject){
				var i:int=0;
				for(i=0;i<_properties.length;i++){
					event=_properties[i];
					if(event.value is Function){
						obj[event.key]=event.value();
					}else{
						obj[event.key]=event.value;
					}
					
				}
				
				for(i=0;i<eventArray.length;i++){
					event=eventArray[i];
					DisplayObject(obj).addEventListener(event.type,event.listener,event.useCapture,event.priority,event.useWeakReference);
				}
			}
			return obj
		}
		
	}

 
 
MyComboBox 클래스는 다음과 같습니다.
 
	import flash.events.Event;
	import flash.events.MouseEvent;
	import mx.collections.ArrayCollection;
	import mx.controls.ComboBox;
	import mx.controls.List;
	import mx.controls.listClasses.ListBase;
	import mx.core.ClassFactory;
	import mx.events.FlexEvent;
	import mx.events.FlexMouseEvent;
	import mx.events.ListEvent;
	import mx.events.SandboxMouseEvent;
	
	public class MyComboBox extends ComboBox
	{
		public function MyComboBox()
		{
			super();
			this.dropdownFactory=new MyClassFactory(List);
			this.getDropdownFactory().addInitEventListener(ListEvent.CHANGE,dropdown_Change,false,1);
			this.getDropdownFactory().addInitEventListener(MouseEvent.MOUSE_DOWN, dropdown_mouseDownHandler);
			this.getDropdownFactory().addInitEventListener(FlexMouseEvent.MOUSE_DOWN_OUTSIDE, dropdown_mouseOutsideHandler);
			this.getDropdownFactory().addInitEventListener(FlexMouseEvent.MOUSE_WHEEL_OUTSIDE, dropdown_mouseOutsideHandler);
			this.getDropdownFactory().addInitEventListener(SandboxMouseEvent.MOUSE_DOWN_SOMEWHERE, dropdown_mouseOutsideHandler);
			this.getDropdownFactory().addInitEventListener(SandboxMouseEvent.MOUSE_WHEEL_SOMEWHERE, dropdown_mouseOutsideHandler);
			this.getDropdownFactory().addInitProperties("allowMultipleSelection",true);
			this.getDropdownFactory().addInitProperties("selectedItems",getSelectedItems);
		}

		private var _selectedItems:Array;
		private var _selectedIndices:Array;
		private var _separation:String=",";
		[Bindable("change")]
		[Bindable("valueCommit")]
		public function get selectedItems():Array{
			return 	_selectedItems==null?[]:_selectedItems;
		}
		public function set selectedItems(array:Array):void{
			var t:String;
			this._selectedItems=array;
			this.text=selectedLabel;
		}
		[Bindable("change")]
		[Bindable("valueCommit")]
		public function get selectedIndices():Array{
			return _selectedIndices!=null?_selectedIndices:[];
		}
		public function set selectedIndices(array:Array):void{
			this._selectedIndices=array;
		}
		/**
		 * Label  
		 * */
		public function get separation():String{
			return this._separation;
		}
		public function set separation(value:String):void{
			this._separation=value;
		}
		public function getSelectedItems():Array{
			return this.selectedItems;
		}
		/**
		 *  ,Ctrl  
		 * */
		private var ctrlKey:Boolean=false;

		private function dropdown_Change(event:ListEvent):void{
			var listBase:ListBase=event.currentTarget as ListBase;
			this.selectedItems=listBase.selectedItems;
			this.selectedIndices=listBase.selectedIndices;
			
			trace("dropdown_Change-----"+"selectedItems:"+selectedItems.length+"\t"+"selectedIndices:"+selectedIndices.length);
			
		}
		
		private function dropdown_mouseDownHandler(event:MouseEvent):void{
			ctrlKey=event.ctrlKey;
		}
		private function dropdown_mouseDownOutSide(event:FlexMouseEvent):void{
			close();
		}
		
		override public function close(trigger:Event=null):void{
			if(!ctrlKey){
				super.close(trigger);//  Ctrl    
			}
		}
		override public function get selectedLabel():String
		{
			var array:Array=this.selectedItems;
			var result:String="";
			for(var i:int=0;i<array.length;i++){
				result+=itemToLabel(array[i]);
				if(i!=(array.length-1)){
					result+=separation;
				}
			}
			
			return result;
		}
		public function  getDropdownFactory():MyClassFactory{
			return super.dropdownFactory as MyClassFactory;
		}
		/**
		 *  @private
		 */
		private function dropdown_mouseOutsideHandler(event:Event):void
		{
			trace("selectedItems:"+selectedItems.length+"\t"+"selectedIndices:"+selectedIndices.length);
			if (event is MouseEvent)
			{
				var mouseEvent:MouseEvent = MouseEvent(event);
				if (!hitTestPoint(mouseEvent.stageX, mouseEvent.stageY, true))
				{
					super.close(event);
				}
			}
			else if (event is SandboxMouseEvent) 
			{
				super.close(event);
			}
		}
	}

호출 코드는 다음과 같습니다.
				<my:MyComboBox width="180">
					<my:dataProvider>
						<s:ArrayCollection>
							<fx:String> </fx:String>
							<fx:String> </fx:String>
							<fx:String> </fx:String>
							<fx:String> </fx:String>
							<fx:String> </fx:String>
						</s:ArrayCollection>
					</my:dataProvider>
				</my:MyComboBox>

(Ctrl 키를 눌러 선택 항목을 여러 개 선택)

좋은 웹페이지 즐겨찾기