Показать список ItemRenderer Index в Flex3 - PullRequest
Новая
       35

Показать список ItemRenderer Index в Flex3

2 голосов
/ 02 августа 2011

Есть ли прямой способ получить индекс элемента данных внутри itemRenderer?Мне нужно отобразить номер элемента против каждого элемента.В настоящее время я делаю обходной путь и не разрешу повторное использование моего компонента itemRenderer. 

var index:int = model.dataColl.getItemIndex(data) + 1;
itemNo = index.toString();

Это то, что я сейчас использую, это работает, но концепции повторного использования компонента и абстракции данных поставлены под угрозу.1004 *

Я использую Flex 3.

Ответы [ 3 ]

2 голосов
/ 03 августа 2011

Первый ответ, кажется, работает, но медленно.Для получения индекса элемента каждый раз требуется O (n ^ 2) времени, поскольку он проходит через массив dataProvider.Мы можем получить доступ к rowIndex из listData - он представляет индекс текущего видимого элемента.Вертикальная позиция прокрутки от родительского списка представляет количество прокручиваемых элементов: 

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" implements="mx.controls.listClasses.IDropInListItemRenderer">
<mx:Script>
    <![CDATA[
        import mx.controls.listClasses.BaseListData;
        import mx.controls.listClasses.ListBase;

        [Bindable] private var index:int = 0;

        private var _listData:BaseListData;
        public function get listData():BaseListData
        {
            return _listData;
        }
        public function set listData(value:BaseListData):void
        {
            _listData = value;
        }

        override public function set data(value:Object):void
        {
            super.data = value;
            if (data && listData)
                index = _listData.rowIndex + ListBase(_listData.owner).verticalScrollPosition;
            else
                index = 0;
        }
    ]]>
</mx:Script>
<mx:Label text="{index}"/>
<mx:Label text="{data.toString()}"/>
</mx:HBox>
1 голос
/ 02 августа 2011

Вы можете использовать labelFunction для решения вашей проблемы. Для простого тестового приложения: 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application creationComplete="init()" layout="absolute" xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
    <![CDATA[
        import mx.collections.ArrayCollection;

        private static const DATA_LENGTH:Number = 100;

        [Bindable]
        private var dp:ArrayCollection;

        private function countFinction(item:Object):String
        {
            return (dp.getItemIndex(item) + 1).toString();
        }

        private function init():void
        {
            var dataArray:Array = [];
            for (var i:int = 0; i < DATA_LENGTH; i++)
            {
                var item:Object = { firstName: "First" + (i + 1), lastName: "Last" + (i + 1) };
                dataArray.push(item);
            }
            dp = new ArrayCollection(dataArray);
        }
    ]]>
    </mx:Script>
    <mx:List dataProvider="{dp}" height="500" horizontalCenter="0" itemRenderer="TestRenderer"
        labelFunction="countFinction" verticalCenter="0" width="500" />
</mx:Application>

Вы можете использовать следующий тестовый рендер: 

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox implements="mx.controls.listClasses.IDropInListItemRenderer" xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
    <![CDATA[
        import mx.controls.listClasses.BaseListData;

        private var _listData:BaseListData;

        /**
         * @inheritDoc
         */
        public function get listData():BaseListData
        {
            return _listData;
        }

        [Bindable(event = "listDataChanged")]
        /**
         * @inheritDoc
         */
        public function set listData(value:BaseListData):void
        {
            if (value == _listData)
                return;
            _listData = value;
            dispatchEvent(new Event("listDataChanged"));
        }
    ]]>
    </mx:Script>
    <mx:Label fontWeight="bold" text="{listData.label}" />
    <mx:Label text="{data.firstName + ' ' + data.lastName}" />
</mx:HBox>
0 голосов
/ 02 августа 2011

Средство визуализации элементов имеет свойство индекса элемента.

this.itemIndex

Образец: 

<s:List>
        <s:dataProvider>
            <s:ArrayList>
                <fx:String>Item 1</fx:String>
                <fx:String>Item 2</fx:String>
                <fx:String>Item 3</fx:String>
                <fx:String>Item 4</fx:String>
                <fx:String>Item 5</fx:String>
                <fx:String>Item 6</fx:String>
            </s:ArrayList>
        </s:dataProvider>
        <s:itemRenderer>
            <fx:Component>
                <s:ItemRenderer>
                    <s:HGroup>
                        <s:Label text="This index is: {this.itemIndex}" />
                        <s:Label text="{data}" />
                    </s:HGroup>
                </s:ItemRenderer>
            </fx:Component>
        </s:itemRenderer>
    </s:List>
...