Flex 多选下拉列表滚动

Question

我在 flex 中工作，我制作了一个自定义下拉菜单，其中有复选框以允许用户 select 多个选项。我用了 this template.

但是这没有滚动功能，因为如果您出于某种原因允许滚动，复选框就会开始混乱。例如，如果您有选项 1 到 8，但只显示 1 到 5。你 select 选项 1 然后向下滚动到 select 选项 7。当你向上滚动时，复选框开始切换，就像选项 3 突然显示 selected。继续上下滚动，复选框 selection 会自行更改。我认为这是一个渲染问题，实际的 selection 数据根本没有改变（它只知道选项 1 和选项 7 是 selected）。关于如何解决此问题的任何想法？

    public function onOpen(event:DropDownEvent):void 
    {//load the checkboxes and set the mouse tracker
        activateAllCheckBoxes();
        this.scroller.verticalScrollBar.addEventListener(Event.CHANGE, list_verticalScrollBar_change);
        callLater(observeMouse);
    }   

    private function list_verticalScrollBar_change(evt:Event):void 
    {
        //currentlySelectedCheckBoxes = selectedCheckboxes;
        UpdateCheckBoxesWhenScrolling();
        selectedIndex = -1;
    }

    protected function UpdateCheckBoxesWhenScrolling():void
    {
        for (var c:int = 0; c < dataGroup.numElements; c++) {
            var obj:DropDownCheckBox = dataGroup.getElementAt(c) as DropDownCheckBox;
            if(obj!=null)
            {
                var judgDebtorFromCheckBox:JudgDebtor = (obj.data) as JudgDebtor;
                if(FindInCurrentList(judgDebtorFromCheckBox.JudgmentDebtorId)>0)
                {
                    obj.checkbox.selected = true;
                }
                else
                {
                    obj.checkbox.selected = false;
                }
            }
        }
    }

    private function FindInCurrentList(ID:int):int
    {
        for(var i:int=0;i<currentlySelectedCheckBoxes.length;i++)
        {
            var JD:JudgDebtor = currentlySelectedCheckBoxes.getItemAt(i) as JudgDebtor;
            if(JD.JudgmentDebtorId == ID)
                return 1;
        }
        return -1;
    }

所以在上面的代码中，我在下拉列表中注册了一个滚动事件侦听器。它将更新具有复选框的下拉条目，并使用名为：currentlySelectedCheckBoxes 的数组集合。我调试了 UpdateCheckBoxesWhenScrolling 函数，它工作正常，换句话说，它将检查那些 selected 但出于某种原因它仍然显示错误的结果，例如列表中的 11 个条目，只有第二个是 selected 我向下滚动，看不到第二个条目，但突然间最后一个条目显示它已被选中。

Answer 1

发生这种情况是因为下拉列表在您滚动时重复使用了渲染器。例如，如果您检查了第一个项目并滚动，则该渲染器将被重用以显示在您滚动时变得可见的项目。所以最后一项显示为已选中。为避免弄乱选择，您必须在您使用的渲染器中执行以下操作

override public function set data(value:Object):void
{
     super.data = value;

     //inspect the property which indicates whether to select the checkbox or not
     //and set the value of selected property accordingly
}

希望对您有所帮助

Flex 多选下拉列表滚动

Flex multiple selection drop down list with scrolling

apache-flex

checkbox

drop-down-menu