Как вызвать itemRendererFunction для повторного вызова при изменении данных во Flex - PullRequest
Новая
       41

Как вызвать itemRendererFunction для повторного вызова при изменении данных во Flex

1 голос
/ 31 января 2012

У меня есть список, который использует itemRendererFunction для получения пользовательских средств визуализации элементов.Есть ли способ переоценить только один элемент в списке и получить другое средство визуализации элементов?

представьте код, подобный следующему:

есть два средства визуализации элементов ItemRendererOne.mxml и ItemRendererTwo.mxml

Data.as 

package {

    public class Data {

        private var _data : Boolean = false;

        [Bindable]
        public function get data():Boolean {
            return _data;
        }

        public function set data(value:Boolean) : void {
            _data = value;
        }

        public function Data(value : Boolean) {
            _data = value;
        }
    }
}

и основное приложениеis 

<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication 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.ArrayList;

            private var dataProvider : ArrayList = new ArrayList([new Data(true), new Data(false)]); 

            public function getItemRenderer(data : Object) : IFactory {
                if (data.data) {
                    return new ClassFactory(ItemRendererOne);
                } else {
                    return new ClassFactory(ItemRendererTwo);
                }
            }

            protected function button1_clickHandler(event : MouseEvent) : void {
                var data : Data = dataProvider.getItemAt(0) as Data;
                data.data = !data.data;
            }

        ]]>
    </fx:Script>

    <s:VGroup>
        <s:List dataProvider="{dataProvider}" itemRendererFunction="{getItemRenderer}" />

        <s:Button click="button1_clickHandler(event)" />
    </s:VGroup>

</s:WindowedApplication>

Обычно, когда кто-то нажимает на кнопку, я хочу, чтобы getItemRenderer вызывался снова, а элемент в списке обновлялся с помощью нового средства визуализации элементов.

1 Ответ

1 голос
/ 31 января 2012

Не уверен насчет flex 4, так как я в основном работаю в flex 3, но настройка должна быть близка.По сути, пусть рендер обрабатывает рендеринг.

Ваш список должен выглядеть примерно так.

Вы можете сделать 3 очень важных переопределения, которые будут контролировать то, как рендерер может реагировать на данные.1) установить данные для когда новые данные назначены2) createChildren позволит вам динамически создавать детей.Я считаю, что это функция, которую вы ищете в сочетании с установленными данными3) commitProperties - это то место, где вы присваиваете данные потомкам, которые жестко запрограммированы, как пример моего ярлыка, или динамически создаваемые потомки.То, что я сделал в прошлом, похоже.Я проверяю данные еще раз на текущем макете, если он неправильный, я перестраиваю его.Таким образом, в методе set data я проверяю, верна ли компоновка, я вызываю createChildren ().Я полагаю, вы могли бы протестировать структуру данных на старых данных перед вызовом super.data в наборах данных, но у меня не было хороших результатов, подобных этому.

myRenderer.mxml 

<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" >
    <mx:Script>
      <![CDATA[
        override public function set data(val:Object):void{
          super.data = val;
          if( !val ){
            return;
          }
          // test data here if current layout is wrong rebuild it by calling createchildren
        }
        override protected function createChildren():void{
          super.createChildren()
          if( this.data == null ){
            return;
          }
          // create your data driven layout here
        }   
        override protected function commitProperties():void{
          super.commitProperties();
          if ( data == null ){
            return;
          }
        }

       ]]>
    </mx:Script>
    <mx:Label id="myLabel" text="{data.someLabelVar} />
</mx:VBox>
...