Глубокая привязка в Flex - PullRequest
0 голосов
/ 11 февраля 2009

Итак, у меня есть модуль в flex, в который я добавляю пользовательский компонент. У меня также есть класс, который обрабатывает данные, которые я хочу показать, давайте назовем этот класс DataHandler.

DataHandler получает данные от серверного решения, а затем начинает объединять данные для моего модуля и пользовательского компонента.

Когда данные готовы, они отправляют событие, которое ловит мой Модуль. Я отправляю новые данные в мой компонент.

пример кода для этого в модуле:

private function onDataChange(evt:Event=null):void
{ 
   _customComponent.ItemData = _dataHandler.DataProvider;
}

Затем _customComponent получает данные:

public function set ItemData(value:ItemDataVO):void
{   
   _itemdata  = value;
}

// _itemdata - это пользовательский класс с именем ItemDataVO

Теперь в моем пользовательском компоненте я просто связываю данные с моими компонентами mxml, например

<mx:Label 
   text       = "Text: {_itemdata.Text}"
   fontFamily = "Hel"
   fontSize   = "12"     
   x          = "83" 
   y          = "40" />

Когда я получаю новые данные, метка автоматически меняется.

Пока все хорошо. Но то, что у меня также есть в моем пользовательском компоненте, это список. И это моя проблема. Когда я связываю данные со списком, я делаю следующее:

<mx:List
   id            = "_list"
   dataProvider  ="{_itemdata.Collection}"
   itemRenderer  = "components.renderers.CustomRenderer" />

// this _itemdata.Collection является коллекцией ArrayCollection, которая содержит коллекцию элементов на основе пользовательского класса.

Привязка не работает, и я также получаю varning для каждого элемента в списке во время выполнения:

предупреждение: невозможно связать со свойством 'parent' в модулях класса :: CustomModule '

(В качестве обходного пути я также пытался установить элемент списка _list каждый раз при установке ItemData. Новые данные list затем обновляются, но я не вижу никаких визуальных обновлений в списке.)

Кто-нибудь знает, как заставить эту привязку работать?

С уважением, Адлерц =)

Ответы [ 3 ]

0 голосов
/ 11 февраля 2009

Раньше я добавлял свой Список в мой Модуль, и он никогда не вызывал проблем с привязкой. Но да, кажется очень странным, что промежуточный компонент нарушает привязку.

Объект, хранящийся в Коллекции, выглядит следующим образом:

package code.converters.objects
{
    public class LineupLI
    {
        private var _plid:int;
        private var _lastname:String;
        private var _firstname:String;
        private var _shirtnumber:int;
        private var _onpitch:Boolean;

        private var _distance:Number;
        private var _topspeed:Number;

        private var _goals:int = 0;

        private var _subin:Boolean      = false;
        private var _subout:Boolean     = false;

        private var _redcard:Boolean    = false ;
        private var _yellowcard:Boolean = false;

        private var _teamid:int;

        private var _teamlongdesc:String;

        private var _second_increase:Number;

        [Bindable]
        public function get OnPitch():Boolean { return _onpitch; }
        public function set OnPitch(value:Boolean):void { _onpitch = value; }

        [Bindable]
        public function get ShirtNumber():int { return _shirtnumber;  }
        public function set ShirtNumber(value:int):void { _shirtnumber = value; }

        [Bindable]
        public function get PlId():int { return _plid; }
        public function set PlId(value:int):void { _plid = value; }

        [Bindable]
        public function get FirstName():String { return _firstname;  }
        public function set FirstName(value:String):void { _firstname = value; }

        [Bindable]
        public function get LastName():String { return _lastname;  }
        public function set LastName(value:String):void { _lastname = value; }

        [Bindable]
        public function get Distance():Number { return _distance;  }
        public function set Distance(value:Number):void { _distance = value; }

        [Bindable]
        public function get TopSpeed():Number { return _topspeed;  }
        public function set TopSpeed(value:Number):void { _topspeed = value; }

        [Bindable]
        public function get Goals():int { return _goals;  }
        public function set Goals(value:int):void { _goals = value; }

        [Bindable]
        public function get SubIn():Boolean { return _subin;  }
        public function set SubIn(value:Boolean):void { _subin = value; }

        [Bindable]
        public function get SubOut():Boolean { return _subout;  }       
        public function set SubOut(value:Boolean):void { _subout = value; }

        [Bindable]
        public function get RedCard():Boolean { return _redcard;  }
        public function set RedCard(value:Boolean):void { _redcard = value; }

        [Bindable]
        public function get YellowCard():Boolean { return _yellowcard;  }
        public function set YellowCard(value:Boolean):void { _yellowcard = value; }

        [Bindable]
        public function get TeamId():int { return _teamid;  }
        public function set TeamId(value:int):void { _teamid = value; }

        [Bindable]
        public function get TeamLongDesc():String { return _teamlongdesc;  }
        public function set TeamLongDesc(value:String):void { _teamlongdesc = value; }

        [Bindable]
        public function get SecondIncrease():Number { return _second_increase;  }
        public function set SecondIncrease(value:Number):void { _second_increase = value; }                             
   }
}
0 голосов
/ 11 февраля 2009

Выглядит нормально для меня ... я думаю, здесь может быть пара проблем. Во-первых, связывание не работает, а во-вторых (как сказал Дэвид Ханак), почему предупреждение

warning: unable to bind to property 'parent' on class 'modules::CustomModule'

отбрасывается, что, кажется, не относится ни к одному из ваших объектов. Сначала я попытался бы решить последнее и попытаться выяснить, почему это происходит. Вы можете обнаружить, что это устраняет первоначальную проблему с переплетом.

0 голосов
/ 11 февраля 2009

Вы установили свойство коллекции на ItemDataVo для привязки ... что-то вроде

package
{
    import mx.collections.ArrayCollection;

    public class ItemDataVo
    {
        [Bindable]
        public var text : String;

        [Bindable]
        public var collection : ArrayCollection
        public function ItemDataVo()
        {
        }

    }
}

Я сделал упрощенный рабочий пример, показывающий, что привязка работает на модели, аналогичной вашей (хотя, очевидно, будут различия), причем привязка работает правильно, если к свойствам текста и коллекции прикреплены метаданные Bindable:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" xmlns:local="*" creationComplete="creationCompleteHandler(event)">

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

            [Bindable]
            protected var itemData : ItemDataVo;

            private function creationCompleteHandler(event : FlexEvent) : void
            {
                generateItemData(); 
            }

            protected function generateItemData() : void
            {
                itemData = new ItemDataVo();
                itemData.text = "New Text With Random " + Math.random() * 100;
                itemData.collection = generateCollection();
            }

            protected function generateCollection() : ArrayCollection
            {
                var arrayCollection : ArrayCollection = new ArrayCollection();
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);
                arrayCollection.addItem("New Item With Random " + Math.random() * 100);

                return arrayCollection;
            }

            private function fullClickHandler(event : MouseEvent) : void
            {
                generateItemData(); 
            }
            private function collectionClickHandler(event : MouseEvent) : void
            {
                itemData.collection = generateCollection();
            }

        ]]>
    </mx:Script>

    <mx:VBox width="100%" height="100%">
        <mx:VBox>
            <mx:Label text="{itemData.text}" />
            <mx:List dataProvider="{itemData.collection}" />
        </mx:VBox>
        <mx:HBox>
            <mx:Button label="UPDATE FULL ITEM DATA" click="fullClickHandler(event)"/>
            <mx:Button label="UPDATE COLLECTION" click="collectionClickHandler(event)"/>
        </mx:HBox>
    </mx:VBox>
</mx:Application>
...