在 flex 数组集合上用点对项目编号进行排序

Question

我需要在 Flex 3.5 的数据网格中按项目编号对项目数组进行排序。

一旦它进入数据网格，我实际上不需要重新排序，我只需要在将它发送到数据提供者之前已经在 arraycollection 上对其进行排序。

我的问题是我需要排序的属性 'item_number' 是一个字符串，它是用批号和一个点构建的，如下所示：

1.1, 1.2, 1.3, 2.1, 2.2, 3.1, 3.2, 3.3, 3.4, 3.5, 3.6, 3.7, 3.8, 3.9, 3.10, 3.11

需要这样订

如果我尝试按编号排序，3.2 比 3.11 大，所以它行不通。我需要先按点之前的整数对它们进行排序，然后才按点之后的整数对它们进行排序，然后再继续点

之前的下一个整数

我还有一个问题。 item_number 属性位于一个对象内，该对象位于我的数组集合中的另一个对象内。

要做到这一点，我必须：

array_collection.item.item_number

总而言之，我需要列出一个按属性排序的数组，该属性位于 arrayitem 的另一个对象内，它是由点分隔的字符串中的数字。

这是我的代码的简化版本：

<mx:Script>
<![CDATA[       
    public function print_data_grid(array_collection):void
    {
        my_data_grid.dataProvider = array_collection
    }
]]>
</mx:Script>

<mx:DataGrid id="my_data_grid">
<mx:columns>
    <mx:DataGridColumn headerText="# Item">
        <mx:itemRenderer>
            <mx:Component>
                <mx:Label toolTip="{this.text}" text="{data.product.item_number}"/>
            </mx:Component>
        </mx:itemRenderer>
    </mx:DataGridColumn>

    <mx:DataGridColumn headerText="Item Name">
        <mx:itemRenderer>
            <mx:Component>
                <mx:Label toolTip="{this.text}" text="{data.product.name}"/>
            </mx:Component>
        </mx:itemRenderer>
    </mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>

Answer 1

您可以编写自定义排序函数。这是一个例子。请检查它是否满足您的要求。

<?xml version="1.0"?>
<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 mx.collections.Sort;
    import mx.utils.ObjectUtil;

    private var myArrayCollection:ArrayCollection = new ArrayCollection([
        {product: {item_number: "1.1", name: "A"}},
        {product: {item_number: "10.2", name: "Lottery"}},
        {product: {item_number: "10.11", name: "Book"}},
        {product: {item_number: "1.13", name: "DVD"}},
        {product: {item_number: "1.221", name: "Car"}},
        {product: {item_number: "1.211", name: "Mobile"}},
        {product: {item_number: "10.1111", name: "Laptop"}},
        {product: {item_number: "11.1", name: "Camera"}},
        {product: {item_number: "12.1", name: "Desktop"}},
        {product: {item_number: "144.41", name: "iPad"}},
        {product: {item_number: "14.21", name: "Tablet"}},
        {product: {item_number: "14.111", name: "Android phone"}},
        {product: {item_number: "10.1", name: "TV"}},
        {product: {item_number: "10.100", name: "Bulb"}}]);

    private function createCopyOfArrayCollection():ArrayCollection
    {
        var copyOfArrayCollection:ArrayCollection = new ArrayCollection();
        for(var i = 0; i < myArrayCollection.length; i++)
        {
            copyOfArrayCollection.addItem(mx.utils.ObjectUtil.copy(myArrayCollection[i]));
        }
        return copyOfArrayCollection;
    }

    private function onButtonClick():void {
        var copyOfArrayCollection:ArrayCollection = createCopyOfArrayCollection();
        var sort:Sort = new Sort();
        sort.compareFunction = sortFunction;
        copyOfArrayCollection.sort = sort;
        copyOfArrayCollection.refresh();
        print_data_grid(copyOfArrayCollection);
    }

    private function sortFunction(a:Object, b:Object, array:Array = null):int {
        //assuming all item_number contains one decimal
        var itemNumberA:String = a.product.item_number;
        var itemNumberASplitArray:Array = itemNumberA.split(".", 2);
        var itemNumberB:String = b.product.item_number;
        var itemNumberBSplitArray:Array = itemNumberB.split(".", 2);

        if (Number(itemNumberASplitArray[0]) == Number(itemNumberBSplitArray[0])) {
            if (Number(itemNumberASplitArray[1]) == Number(itemNumberBSplitArray[1])) {
                return 0;
            }
            else if (Number(itemNumberASplitArray[1]) > Number(itemNumberBSplitArray[1])) {
                return 1;
            }
            else {
                return -1;
            }
        }
        else if (Number(itemNumberASplitArray[0]) > Number(itemNumberBSplitArray[0])) {
            return 1;
        }
        else {
            return -1;
        }
    }

    public function print_data_grid(array_collection):void {
        my_data_grid2.dataProvider = array_collection
    }
    ]]>
</fx:Script>
<mx:HBox verticalCenter="0" horizontalCenter="0">
    <mx:Panel title="Unsorted Data">
        <mx:DataGrid id="my_data_grid" dataProvider="{myArrayCollection}" height="400">
            <mx:columns>
                <mx:DataGridColumn headerText="# Item">
                    <mx:itemRenderer>
                        <fx:Component>
                            <mx:Label toolTip="{this.text}" text="{data.product.item_number}"/>
                        </fx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>

                <mx:DataGridColumn headerText="Item Name">
                    <mx:itemRenderer>
                        <fx:Component>
                            <mx:Label toolTip="{this.text}" text="{data.product.name}"/>
                        </fx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
    </mx:Panel>

    <mx:VBox height="100%">
        <mx:Spacer percentHeight="50"/>
        <mx:Button label=">>- Show sorted data ->>" click="{onButtonClick()}"/>
        <mx:Spacer percentHeight="50"/>
    </mx:VBox>
    <mx:Panel title="Sorted Data">
        <mx:DataGrid id="my_data_grid2" height="400">
            <mx:columns>
                <mx:DataGridColumn headerText="# Item">
                    <mx:itemRenderer>
                        <fx:Component>
                            <mx:Label toolTip="{this.text}" text="{data.product.item_number}"/>
                        </fx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>

                <mx:DataGridColumn headerText="Item Name">
                    <mx:itemRenderer>
                        <fx:Component>
                            <mx:Label toolTip="{this.text}" text="{data.product.name}"/>
                        </fx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns>
        </mx:DataGrid>
    </mx:Panel>
</mx:HBox>

</s:Application>

在 flex 数组集合上用点对项目编号进行排序

Sort item numbers with dot on array collection in flex

apache-flex

sorting

datagrid

flex3

arraycollection