flash builder4里面comboBox的问题

flash builder4 就是flex builder3升级后的说法- -感觉更统一了。

 

直接说官方给出的最新解释吧：

ComboBox 控件是 DropDownListBase 控件的子类。与 DropDownListBase 控件类似，当用户从 ComboBox 控件的下拉列表中选择某项时，数据项将显示在控件的提示区域中。

这两个控件之间的一个区别是，ComboBox 控件的提示区域是使用 TextInput 控件实现的，而 DropDownList 控件是通过 Label 控件实现的。因此，用户可以编辑控件的提示区域，以输入非预定义选项之一的值。

例如，DropDownList 控件仅允许用户从控件的预定义项列表中进行选择。ComboBox 控件允许用户既可以从预定义项中选择，也可以在提示区域中输入新项。您的应用程序可以识别已输入一个新项，（可选）并将其添加到控件的项列表中。

ComboBox 控件还可以当用户在提示区域中输入字符时搜索项列表。当用户输入字符时，将打开控件的下拉区域，然后滚动到项列表中最接近的匹配项并加亮。

注意：基于 Spark List 的控件（Spark ListBase 类及其子类，如 ButtonBar、ComboBox、DropDownList、List 和 TabBar）不支持将 BasicLayout 类作为 layout 属性的值。不要将 BasicLayout 与基于 Spark List 的控件一起使用。

 

照这个说法

可以直接这样做：

<?xml version="1.0" encoding="utf-8"?>
<!--  控制 ComboBox 的一个实例 -->
<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">
                  
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
           
            [Bindable]//链接数据的标记
            public var complexDP:ArrayCollection = new ArrayCollection(
                [    {ingredient:"Salmon", category:"Meat"},
                    {ingredient:"Potato", category:"Starch"},
                    {ingredient:"Cucumber", category:"Vegetable"},
                    {ingredient:"Steak", category:"Meat"},
                    {ingredient:"Rice", category:"Starch"},
                    {ingredient:"Cumin", category:"Spice"}
                ]               
            );

            <!-- 输入自定义字符串的方法myLabelToItemFunction -->                       
            private function myLabelToItemFunction(input:String):*
            {
                <!-- 返回数据到dataProvider -->
                return {ingredient:input, category:"mystery"};
            }           
        ]]>
    </fx:Script>
   
    <s:Panel title="Spark ComboBox Example" width="75%" height="75%">   
        <s:layout>
            <s:VerticalLayout paddingTop="10" paddingLeft="10"/>
        </s:layout>
   
        <!-- 这个标签用来返回cb的值 -->
        <s:Label text="Index : {cb.selectedIndex}
                        Item : {cb.selectedItem.ingredient}
                        Type : {cb.selectedItem.category}"/>

        <!-- 在ComboBox 里面自定义labelToItem -->
        <s:ComboBox
            id="cb"
            dataProvider="{complexDP}"
            width="150"
            labelToItemFunction="{myLabelToItemFunction}"
            selectedIndex="0"
            labelField="ingredient"/>              
    </s:Panel>   
</s:Application>

照上面这么写没问题 不过既然官方都说了。

 

以后用comboBox还是直接用DropDownList吧

官方解释：

DropDownList 控件包含下拉列表，用户可从中选择单个值。其功能与 HTML 中 SELECT 表单元素的功能非常相似。

DropDownList 控件由锚点按钮、提示区域和下拉列表组成，使用锚点按钮可打开和关闭下拉列表。提示区域显示一个提示 String，或者显示下拉列表中的选定项目。

打开下拉列表时：

• 单击锚点按钮会关闭下拉列表并提交当前选定的数据项目。
• 在下拉列表之外单击会关闭下拉列表并提交当前选定的数据项目。
• 在某个数据项目上单击会选中该项目并关闭下拉列表。
• 如果 requireSelection 属性为 false，则按下 Ctrl 键的同时单击某个数据项目会取消选中该项目并关闭下拉列表。

注意：基于 Spark List 的控件（Spark ListBase 类及其子类，如 ButtonBar、ComboBox、DropDownList、List 和 TabBar）不支持将 BasicLayout 类作为 layout 属性的值。不要将 BasicLayout 与基于 Spark List 的控件一起使用。

顺便给个官方的实例：

 

<?xml version="1.0" encoding="utf-8"?>
<!-- Simple example to demonstrate the Spark DropDownList control -->
<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">

    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import spark.events.IndexChangeEvent;

         [Bindable]
            public var myDP:ArrayCollection = new ArrayCollection(
                [ {product:"Flex", price:100},
                  {product:"Air", price:200},
                  {product:"Catalyst", price:300},
                  {product:"FlashBuilder", price:400} ]);

            private function updateSelection(e:IndexChangeEvent):void
            {
                currSel.text = "Current Product = " + myDDL.selectedItem.product;
                currPrc.text = "Price = $" + myDDL.selectedItem.price;
            }
        ]]>
    </fx:Script>

    <s:Panel width="75%" height="75%" title="My DropDownList Example"
        horizontalCenter="0" verticalCenter="0">

        <s:VGroup left="10" right="10" top="10" bottom="10">

            <!-- Text components used to display current selection and price -->
            <s:Label id="currSel" text="Current Product = -"/>
            <s:Label id="currPrc" text="Price = $ -"/>

            <!-- DropDownList will call the updateSelection function when the
            selectionChanged event is dispatched -->
            <s:DropDownList id="myDDL" prompt="Select One"
                width="200" dataProvider="{myDP}"
                labelField="product"
                change="updateSelection(event);"/>

        </s:VGroup>

    </s:Panel>

</s:Application>

一目了然 哈哈