通过多项选择找出 Spark 列表中取消选择的项目

发布于 2024-09-12 10:43:20 字数 430 浏览 7 评论 0原文

在 Spark 列表中,我可以使用 change 事件来找出已选择或取消选择的项目。 分派的 IndexChangeEvent 对象具有保存此信息的属性 newIndexoldIndex

但在允许多重选择的情况下,这不再起作用,因为 newIndexoldIndex 可以引用仍然选定的元素的索引。

解决方案是将 selectedIndices 向量复制到另一个变量,并在选择更改后将此变量与 selectedIndices 进行比较,但这似乎有些复杂。

有谁知道是否有一种简单的方法可以获取用户取消选择而其他元素仍处于选中状态的索引/项目?

In a spark list I could use the change event to find out which item has been selected or deselected.
The dispatched IndexChangeEvent object has the properties newIndex and oldIndex holding this information.

But with multiple selection allowed this doesn't work anymore because newIndex and oldIndex could refer to indices of still selected elements.

A solution would be to copy the selectedIndices vector to another variable and compare this variable with selectedIndices after a change in selection, but this seems to be somewhat complex.

Does anyone know if there is an easy way two get the index/item a user is deselecting while other elements are still selected?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

£冰雨忧蓝° 2024-09-19 10:43:20

您将需要存储选定的索引并比较差异。

private static function findMissing(ar1:Array, ar2:Array):Array
{
    var missing:Array = [];
    for each(var item:Object in ar1)
    {
        if(ar2.indexOf(item) < 0)
            missing.push(item);
    }

    return missing;
}

You will need to store the selectedIndicies and compare the difference.

private static function findMissing(ar1:Array, ar2:Array):Array
{
    var missing:Array = [];
    for each(var item:Object in ar1)
    {
        if(ar2.indexOf(item) < 0)
            missing.push(item);
    }

    return missing;
}
赢得她心 2024-09-19 10:43:20

扩展自定义数据对象

  • 您还可以使用可绑定的布尔属性 :
    _selected,通过列表交互进行更新。
  • 和一个可以触发的事件
    它:selectionChanged

selected 设置器中 - 如果它确实发生了变化 - 您可以触发自己的冒泡 selectionChanged 事件,并在需要的地方捕获它。

SelectableItem.as - 表示列表的行数据的自定义数据结构

[Bindable]
[Event(name="selectionChanged",type="flash.events.Event")]
public class SelectableItem
{
    public static const EVENT_SELECTION_CHANGED:String = 'selectionChanged';
    private var _selected:Boolean;
    private var _name:String;

    public function SelectableItem()
    {
    }

    public function get selected():Boolean
    {
        return _selected;
    }

    public function set selected(value:Boolean):void
    {
        if (_selected != value)
        {
            _selected = value;
            dispatchEvent(new Event(EVENT_SELECTION_CHANGED, true));
        }
    }

    public function get name():String
    {
        return _name;
    }

    public function set name(value:String):void
    {
        _name = value;
    }
}

MyDataGrid.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    allowMultipleSelection="true">
    <fx:Script>
        <![CDATA[
            import mx.controls.listClasses.IListItemRenderer;

            protected override function updateRendererDisplayList(r:IListItemRenderer):void
            {
                super.updateRendererDisplayList(r);
                if (r && r.data)
                    r.data.selected = DataGrid(r.owner).isItemSelected(r.data);
            }

        ]]>
    </fx:Script>
</mx:DataGrid>

TestApplication.mxml

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

        [Bindable]
        private var list:ArrayCollection = new ArrayCollection();

        protected function onCreationComplete(event:FlexEvent):void
        {
            for (var i:int = 0; i < 20; i++)
            {
                var item:SelectableItem= new SelectableItem();
                item.name = 'Item ' + i;
                item.addEventListener(SelectableItem.EVENT_SELECTION_CHANGED, onItemSelectionChanged);
                list.addItem(item);
            }
        }

        private function onItemSelectionChanged(event:Event):void
        {
            trace(event);
        }

    ]]>
</fx:Script>
<my:MyDataGrid dataProvider="{list}" width="100%" height="100%" />

我希望这会有所帮助。

You could also extend your custom data object with

  • a bindable boolean property:
    _selected, which gets updated via the list interactions.
  • and an event that can be fired from
    it: selectionChanged.

In the selected setter - if it actually changed - you can fire your own bubbling selectionChanged event, and capture it wherever you need.

SelectableItem.as - the custom data structure representing a row data of the list

[Bindable]
[Event(name="selectionChanged",type="flash.events.Event")]
public class SelectableItem
{
    public static const EVENT_SELECTION_CHANGED:String = 'selectionChanged';
    private var _selected:Boolean;
    private var _name:String;

    public function SelectableItem()
    {
    }

    public function get selected():Boolean
    {
        return _selected;
    }

    public function set selected(value:Boolean):void
    {
        if (_selected != value)
        {
            _selected = value;
            dispatchEvent(new Event(EVENT_SELECTION_CHANGED, true));
        }
    }

    public function get name():String
    {
        return _name;
    }

    public function set name(value:String):void
    {
        _name = value;
    }
}

MyDataGrid.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:s="library://ns.adobe.com/flex/spark" 
    xmlns:mx="library://ns.adobe.com/flex/mx" 
    allowMultipleSelection="true">
    <fx:Script>
        <![CDATA[
            import mx.controls.listClasses.IListItemRenderer;

            protected override function updateRendererDisplayList(r:IListItemRenderer):void
            {
                super.updateRendererDisplayList(r);
                if (r && r.data)
                    r.data.selected = DataGrid(r.owner).isItemSelected(r.data);
            }

        ]]>
    </fx:Script>
</mx:DataGrid>

TestApplication.mxml

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

        [Bindable]
        private var list:ArrayCollection = new ArrayCollection();

        protected function onCreationComplete(event:FlexEvent):void
        {
            for (var i:int = 0; i < 20; i++)
            {
                var item:SelectableItem= new SelectableItem();
                item.name = 'Item ' + i;
                item.addEventListener(SelectableItem.EVENT_SELECTION_CHANGED, onItemSelectionChanged);
                list.addItem(item);
            }
        }

        private function onItemSelectionChanged(event:Event):void
        {
            trace(event);
        }

    ]]>
</fx:Script>
<my:MyDataGrid dataProvider="{list}" width="100%" height="100%" />

I hope this helps.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文