|
|
|||||
Регистрация: Dec 2010
Сообщений: 23
|
Multiselect ComboBox
Доброе время суток!
Флекс знаю мало и почти с ним не работаю. Был нужен ComboBox с возможностью выбора нескольких значений, нашел готовый код интернете, например здесь http://blog.comtaste.com/2008/09/ext...x_to_impl.html Код: package { import flash.events.Event; import flash.events.KeyboardEvent; import mx.controls.ComboBox; import mx.events.ListEvent; public class MultiSelectComboBox extends ComboBox { private var ctrlKeyPressed:Boolean = false; //Control Key Pressed /** * This function checks whether the CtrlKey is pressed. * If CtrlKey is pressed then, * multiple selection is enabled for the ComboBox dropdown. **/ override protected function keyDownHandler( event:KeyboardEvent ):void { super.keyDownHandler( event ); this.ctrlKeyPressed = event.ctrlKey; if( this.ctrlKeyPressed == true ) { dropdown.allowMultipleSelection = true; } } /** * This function prevents the ComboBox from closing if CtrlKey is pressed * Else it fires a Change event to update selectedItems array on close * * If CtrlKey is not pressed then, * ComboBox dropdown is closed and change event is dispatched. * * 'dropdown' in a ComboBox is a List component **/ override protected function keyUpHandler( event:KeyboardEvent ):void { super.keyUpHandler( event ); this.ctrlKeyPressed = event.ctrlKey; if ( this.ctrlKeyPressed == false ) { this.close(); var changeEvent:ListEvent = new ListEvent( ListEvent.CHANGE ); this.dispatchEvent( changeEvent ); this.selectedIndex = -1; } } /** * This function prevents the ComboBox from closing if CtrlKey is pressed on a Close Event **/ override public function close( trigger:Event=null ):void { if( this.ctrlKeyPressed == false ) { super.close( trigger ); this.selectedIndex = -1; } } /** * 'selectedItems' Setter **/ public function set selectedItems( value:Array ):void { if( this.dropdown ) { this.dropdown.selectedItems = value; } } /** * 'selectedItems' Getter **/ [Bindable("change")] public function get selectedItems( ) : Array { if ( this.dropdown ) return this.dropdown.selectedItems else return null; } /** * 'selectedIndices' Setter **/ public function set selectedIndices( value:Array ) : void { if ( this.dropdown ) this.dropdown.selectedIndices = value; } /** * 'selectedIndices' Getter **/ [Bindable("change")] public function get selectedIndices( ) : Array { if ( this.dropdown ) return this.dropdown.selectedIndices; else return null; } /** * 'MultiSelectComboBox' constructor **/ public function MultiSelectComboBox() { super(); } } } Нашел вот эти вещи, но не знаю что с ними делать: override public function itemToLabel(item:Object, ...rest):String { var label : String = ""; if( !selectedItems || selectedItems.length) { return super.itemToLabel(item); } else { for each( var object : Object in selectedItems ) { label += super.itemToLabel(object) + ", "; } } return label.substring(0,label.length - 2); } override protected function commitProperties():void { var label : String = ""; super.commitProperties(); for each( var object : Object in selectedItems ) { label += super.itemToLabel(object) + ", "; } textInput.text = label.substring(0,label.length - 2); } |
|
|||||
Регистрация: Dec 2006
Сообщений: 1,764
|
__________________
а за окном атлантический океан! |
|
|||||
Регистрация: Dec 2010
Сообщений: 23
|
Спасибо, но это совершенно не то что мне нужно. Меня полностью устаивает тот код который я выложил, кроме того, что этот Multiselect Combobox не отображает выбранные элементы через запятую. Я не нашел чтобы это было реализовано в коде по ссылке.
|
|
|||||
Регистрация: Sep 2010
Сообщений: 36
|
Могу дать свой ...
Но у меня комбо бокс с чеками ... и в зависимости что ты хочешь с ними дальше делать ! ... apikaster@gmail.com и проверь ... Не цепляешь ли ты в спарк на ЭмИкс ... а насчет спарка .... Думаю можно сделать ... На спарках много времени не займет ... Последний раз редактировалось Apikaster; 04.08.2011 в 18:01. |
|
|||||
Регистрация: Dec 2010
Сообщений: 23
|
ничего не понял. код который я выложил рабочий, все ок. едиственное чего мне не хвататет это чтоб при закрытии ComboBox-а в нем отображались выбранные значения через запятую. Кто-нибудь знает как добавить эту фнкциональность?
|
|
|||||
Цитата:
Написать свой скин для openButton, основывающийся на ComboBoxButtonSkin или дополнить существующий Последний раз редактировалось djyamato; 05.08.2011 в 22:21. |
|
|||||
Регистрация: Dec 2010
Сообщений: 23
|
А вы не можете написать подробнее? Я spark никогда не пользовался и мне, к сожалению, это мало о чем говорит.
Добавлено через 9 минут Может можно как-то попроще сделать, через labelField может? Просто мне срочно нужно, а я не ориентируюсь в этом совсем. |
|
|||||
в спарке не нашел как сделать multyselect для дроп дауна, да и ОООЧЕНЬ сомневаюсь что это пряморукий способ, но работает
Заменил в DropDownList группу dataGroup на List компонент (Ой, чую попинают меня щас..., хотя, это даже к лучшему, попинайте и укажите на грубости, пожалуйста) вот код <?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:com="com.*"> <fx:Declarations> <s:ArrayCollection id="listDP"> <fx:Object label="item1"/> <fx:Object label="item2"/> <fx:Object label="item3"/> <fx:Object label="item4"/> <fx:Object label="item5"/> <fx:Object label="item6"/> </s:ArrayCollection> </fx:Declarations> <com:CustomDropDown dataProvider="{listDP}" left="5" right="15" requireSelection="false" skinClass="skins.CustomDropDownSkin"/> </s:Application> <?xml version="1.0" encoding="utf-8"?> <s:DropDownList xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="dropdownlist1_creationCompleteHandler(event)"> <fx:Metadata> </fx:Metadata> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <fx:Script> <![CDATA[ import mx.events.FlexEvent; import spark.components.List; import spark.events.DropDownEvent; import spark.events.IndexChangeEvent; private var ctrlKeyPressed:Boolean = false; //Control Key Pressed protected var _selectedIndices:Vector.<int>=new Vector.<int>(); protected var _list:List; override protected function keyDownHandler( event:KeyboardEvent ):void { super.keyDownHandler( event ); this.ctrlKeyPressed = event.ctrlKey; if( this.ctrlKeyPressed == true ) { ctrlKeyPressed=true; } } override protected function keyUpHandler(event:KeyboardEvent):void { ctrlKeyPressed=false; } protected function dropdownlist1_creationCompleteHandler(event:FlexEvent):void { addEventListener(CustomDropDownListEvent.LIST,listReadyHandler,true); } protected function listReadyHandler(event:CustomDropDownListEvent):void { _list=event.messageData.data; _list.selectedIndices=_selectedIndices; _list.addEventListener(Event.CHANGE,listChangeHandler); } protected function listChangeHandler(event:Event):void { if(ctrlKeyPressed) { labelDisplay.text=""; for(var i:int=0;i<_list.selectedIndices.length;i++) { if(i<_list.selectedIndices.length-1) { labelDisplay.text+=_list.dataProvider.getItemAt(_list.selectedIndices[i]).label+" , "; } else { labelDisplay.text+=_list.dataProvider.getItemAt(_list.selectedIndices[i]).label; } } _selectedIndices=_list.selectedIndices; } else { _selectedIndices.length=0; _selectedIndices.push(_list.selectedIndex); labelDisplay.text=_list.dataProvider.getItemAt(_selectedIndices[0]).label; closeDropDown(false); } } ]]> </fx:Script> </s:DropDownList> <?xml version="1.0" encoding="utf-8"?> <s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:fb="http://ns.adobe.com/flashbuilder/2009" alpha.disabled=".5"> <fx:Metadata> [HostComponent("com.CustomDropDown")] </fx:Metadata> <fx:Script fb:purpose="styling"> <![CDATA[ import com.CustomDropDownListEvent; static private const contentFill:Array = ["bgFill"]; override public function get contentItems():Array {return contentFill}; override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void { if (getStyle("borderVisible") == false) { if (border) border.visible = false; if (background) { background.left = background.top = background.right = background.bottom = 0; } } else { if (border) border.visible = true; if (background) { background.left = background.top = background.right = background.bottom = 1; } } if (dropShadow) dropShadow.visible = getStyle("dropShadowVisible"); openButton.setStyle("cornerRadius", getStyle("cornerRadius")); if (borderStroke) { borderStroke.color = getStyle("borderColor"); borderStroke.alpha = getStyle("borderAlpha"); } super.updateDisplayList(unscaledWidth, unscaledHeight); } ]]> </fx:Script> <s:states> <s:State name="normal" /> <s:State name="open" /> <s:State name="disabled" /> </s:states> <s:PopUpAnchor id="popUp" displayPopUp.normal="false" displayPopUp.open="true" includeIn="open" left="0" right="0" top="0" bottom="0" itemDestructionPolicy="auto" popUpPosition="below" popUpWidthMatchesAnchorWidth="true"> <s:Group id="dropDown"> <s:RectangularDropShadow id="dropShadow" blurX="20" blurY="20" alpha="0.45" distance="7" angle="90" color="#000000" left="0" top="0" right="0" bottom="0"/> <s:Rect id="border" left="0" right="0" top="0" bottom="0"> <s:stroke> <s:SolidColorStroke id="borderStroke" weight="1"/> </s:stroke> </s:Rect> <s:Rect id="background" left="1" right="1" top="1" bottom="1" > <s:fill> <s:SolidColor id="bgFill" color="0xFFFFFF" /> </s:fill> </s:Rect> <s:List id="list" creationComplete="{dispatchEvent(new CustomDropDownListEvent(CustomDropDownListEvent.LIST,list))}" change="{dispatchEvent(new CustomDropDownListEvent(CustomDropDownListEvent.SELECTION_CHANGE,{index:list.selectedIndex,object:list.selectedItem}))}" selectedIndices="{hostComponent.selectedIndices}" dataProvider="{hostComponent.dataProvider}" allowMultipleSelection="true" left="0" top="0" right="0" bottom="0" hasFocusableChildren="false"/> </s:Group> </s:PopUpAnchor> <s:Button id="openButton" left="0" right="0" top="0" bottom="0" focusEnabled="false" tabEnabled="false" skinClass="spark.skins.spark.DropDownListButtonSkin" /> <s:Label id="labelDisplay" verticalAlign="middle" maxDisplayedLines="1" mouseEnabled="false" mouseChildren="false" left="7" right="30" top="2" bottom="2" width="75" verticalCenter="1" /> </s:SparkSkin> package com { import flash.events.Event; public class CustomDropDownListEvent extends Event { public var messageData:Object; public static const LIST:String="list"; public static const SELECTION_CHANGE:String="selectionChange"; public function CustomDropDownListEvent(type:String, data:Object=null) { super(type,data); var messObj:Object=new Object(); messObj.data=data; this.messageData=messObj; } } } Последний раз редактировалось djyamato; 15.08.2011 в 16:49. |
|
|||||
Регистрация: Dec 2010
Сообщений: 23
|
Спасибо Вам djyamato, за помощь! Ваш компонент не использовал, обощелся без мультиселекта. Жаль что никто не пояснил как же все таки правильно сделать такой компонент.
|
Часовой пояс GMT +4, время: 21:23. |
|
« Предыдущая тема | Следующая тема » |
|
|