扩展 DropDownList 以包含一个额外的选项答案

【问题标题】：Extending DropDownList to include an extra option扩展 DropDownList 以包含一个额外的选项
【发布时间】：2011-03-27 17:38:46
【问题描述】：

我想扩展 DropDownList 控件以包含用于创建或编辑选项的选项。例如;对于下拉列表中的项目列表，将有另一个选项显示“创建新项目...”或“编辑项目...”，这将是列表中的最后一个选项。当用户选择此选项时， selectedIndex 或 selectedItem 不会改变，并且会采取相应的操作（例如弹出窗口）。这对最终用户来说是一种方便的方式。

现在我希望它能够独立于上下文工作，并且该类必须是可重用的。用户将只指定 optionText 和 optionFunction 来解决这个问题。该类的基本结构如下所示：

public class OptiveDropDownList extends DropDownList
{
    private var _enableOption:Boolean;
    private var _optionText:String;
    private var _originalDataProvider:IList;
    [Bindable] public var optionFunction:Function;

    public function OptiveDropDownList()
    {
        super();
    }

    public function set optionText(value:String):void
    {
        _optionText = value;
        dataProvider = _originalDataProvider;
    }

    public function set enableOption(value:Boolean):void
    {
        _enableOption = value;
        dataProvider = _originalDataProvider;
    }

    public override function set dataProvider(value:IList):void
    {
        _originalDataProvider = value;
        var dp:IList = null;
        if(!value){
            dp=new ArrayCollection(value.toArray());
            if(_enableOption){
                var opt:Object=new Object();
                opt[labelField]=_optionText;
                dp.addItem(opt);
            }
        }
        super.dataProvider = dp;
    }

    [Bindable]
    public override function get dataProvider():IList
    {
        return _originalDataProvider;
    }
}

我希望我的代码清晰易懂，我正在为选项的 dataprovider 添加一个额外的对象。字段名称是不言自明的。

现在我的问题是如何知道数据提供者的项目是否发生了变化？我应该覆盖哪些功能以及如何执行。我曾尝试使用 ChangeWatcher 来观察 dataprovider 的长度属性，但如果只有 dataprovider 中的一个对象发生了变化，它就不起作用。我需要捕捉这些变化并更新视图。

我还需要捕获选择并调用optionFunction，防止默认操作不给索引越界错误。

提前致谢。

【问题讨论】：

标签： apache-flex actionscript-3 flex4

【解决方案1】：

只需将事件侦听器添加到原始 dataProvider 即可。 IList 的所有实现都应该在列表更改时调度 CollectionEvent.COLLECTION_CHANGE（例如添加、删除或列表中的现有对象已更改）。在您的事件处理程序中，您可以相应地更新 DropDownList 的 dataProvider。

通过覆盖mx_internal 方法setSelectedIndex()，您可以根据自己的意愿调整选择。请查看博文“Disable selection on some items in a spark List”以获得一些灵感。

【讨论】：