注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

zhouhaigang.love的博客

喜欢冬日黄昏那冻住的山

 
 
 

日志

 
 

combobox的多选  

2009-04-30 15:04:28|  分类: java |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

[注:转载自http://blog.comtaste.com/2008/09/extending_the_combobox_to_impl.html]

当ComboBox需要能多项选择的时候,问题就来了。不过不用着急,我们可以轻易的扩展ComboBox来达到这样的目的。最关键的是ComboBox的一个属性allowMultipleSelection要设置成true。

combobox的多选 - zhouhaigang.love - zhouhaigang.love的博客

上面的这个例子需要用户按着CTRL键才能实现多项选择。实际上更加强大点我们可以在每个选项前面加个CheckBox,不过这个工作量就稍微大一些了。

直接来看例子代码:

//ComboBoxs.as

package

{

import flash.events.Event;

import flash.events.KeyboardEvent;

 

 

import mx.controls.ComboBox;

import mx.events.FlexEvent;

import mx.events.ListEvent;

 

public class ComboBoxs extends ComboBox

 

{

private var ctrlKey:Boolean = false;

 

public function ComboBoxs()

 

{

super();

}

 

override public function close(trigger:Event=null) : void

 

{

if ( !ctrlKey )

super.close( trigger );

 

}

 

override protected function keyDownHandler(event:KeyboardEvent) : void

 

{

super.keyDownHandler( event );

 

ctrlKey = event.ctrlKey;

 

 

if ( ctrlKey )

dropdown.allowMultipleSelection = true;

 

}

 

override protected function keyUpHandler(event:KeyboardEvent) : void

 

{

super.keyUpHandler( event );

 

ctrlKey = event.ctrlKey;

 

if ( !ctrlKey )

{

close();

var changeEvent:ListEvent = new ListEvent( ListEvent.CHANGE )

 

dispatchEvent( changeEvent );

}

}

 

public function set selectedItems( value:Array ) : void

 

{

if ( dropdown )

dropdown.selectedItems = value;

 

}

 

[Bindable("change")]

public function get selectedItems( ) : Array

 

{

if ( dropdown )

return dropdown.selectedItems;

 

else

return null;

}

 

public function set selectedIndices( value:Array ) : void

 

{

if ( dropdown )

dropdown.selectedIndices = value;

 

}

 

[Bindable("change")]

public function get selectedIndices( ) : Array

 

{

if ( dropdown )

return dropdown.selectedIndices;

 

else

return null;

}

 

}

}

 

//使用例子sample.mxml

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

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:local="*" backgroundColor="#FFFFFF">

      <mx:Script>

            <![CDATA[

                  import mx.collections.XMLListCollection;

                  private var list:XML = <root><item label='item1'/><item label='item2'/><item label='item3'/>

                                                            <item label='item4'/><item label='item5'/></root>;

                 

                  [Bindable]

                  private var dp:XMLListCollection = new XMLListCollection(list.item);

                 

                  private function changeHandler():void{

                        var text:String = "Selected items: ";

                        var selected:Array = box.selectedItems as Array;

                        for each( var item in selected){

                              text += " "+item.@label;

                        }

                        textShow.text = text;

                  }

            ]]>

      </mx:Script>

      <mx:Panel title="Multiple select ComboBox Sample" width="100%" height="100%">

            <mx:Label text="Please use Ctr+click to select the items"/>

            <local:ComboBoxs id="box" dataProvider="{dp}" labelField="@label" change="changeHandler()"/>

            <mx:Text id="textShow"/>     

      </mx:Panel>

</mx:Application>

  评论这张
 
阅读(448)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017