Странное поведение средства визуализации пользовательских элементов в Flex 4 - PullRequest
Новая
       31

Странное поведение средства визуализации пользовательских элементов в Flex 4

0 голосов
/ 27 декабря 2010

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

public class Photo
    {
        public function Photo()
        {
        }
        public var PhotoId:int;
        public var Title :String;
        public var Subtitle :String;
        public var PhotoByteArray:ByteArray ;
        public var ThumbnailByteArray:ByteArray;
        public var ShowOnlyInFrontpageTop:Boolean;
        public var ShowInFrontpageGroup:Boolean;
        public var BackgroundColorGradientFrom:String;
        public var BackgroundColorGradientTo:String;
        public var IsActive :Boolean;
    }

Я получаю разнообразные объекты этого типа (Фото) из службы WCF (работает отлично!).Эти объекты хранятся в коллекции ArrayCollection, определенной следующим образом: 

public static var GroupPhotos:ArrayCollection = new ArrayCollection();

Я хочу показать эти фотографии с использованием компонента: List, например: 

<s:List height="110" id="GroupPhotos" itemRenderer="MyGroupPhotoRenderer">
                <s:layout >
                    <s:HorizontalLayout requestedColumnCount="3"  />
                </s:layout>
            </s:List>

Определен модуль визуализации элементовтаким образом: 

<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                xmlns:s="library://ns.adobe.com/flex/spark" 
                xmlns:mx="library://ns.adobe.com/flex/mx" 
                autoDrawBackground="true"
                creationComplete="onItemrenderer_creationCompleteHandler(event)">
    <fx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.events.FlexEvent;

            //when the item has been rendered and is ready to be shown the following method will be called
            protected function onItemrenderer_creationCompleteHandler(event:FlexEvent):void
            {               
                img.source =  data.ThumbnailByteArray;
            }

        ]]>
    </fx:Script>

    <s:Group id="PhotoGroup" width="297" height="110" >
        <!--<s:Rect id="imgRectangle" alpha="0" width="95" height="65">
            <s:stroke>
                <s:LinearGradientStroke weight="{GroupBoxBorderWeight}" scaleMode="none"/>
            </s:stroke>
        </s:Rect>-->
        <mx:Image id="img"  
                  width="{PhotoGroup.width}" height="{PhotoGroup.height}" 
                  />
        <s:Label id="title"                  
                 fontSize="20" 
                 text="{data.Title}"/>
    </s:Group>
</s:ItemRenderer>

Компонент s: Label отображается правильно, тогда как компонент mx: Image всегда показывает одно и то же изображение (не знаю, является ли это первым изображением или последним в массиве),Что мне не хватает?Заранее спасибо

Ответы [ 2 ]

1 голос
/ 28 декабря 2010

Ааа !! Оказывается, это моя ошибка!Выше я заявил, что служба работает нормально: угадайте, что ... это не так!Исправление службы заставило изображения отображаться правильно!

0 голосов
/ 27 декабря 2010

Создание завершено, вызывается только при первом создании вашего рендерера.Поскольку Flex повторно использует средства визуализации, это означает, что он вызывается только в первый раз.Вместо использования creationComplete переопределите метод set data вашего средства визуализации.К сожалению, s:ItemRenderer не имеет метода set data, поэтому вместо него я бы использовал компонент mx:HBox.

Вот краткий пример для начала: 

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox 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[

            override public function set data(value:Object):void
            {
                super.data = value;

                theLabel.text = value["Title"].toString();
                theImage.source = data.ThumbnailByteArray;

                validateDisplayList();
            }

        ]]>
    </fx:Script>
    <mx:Label id="theLabel" />
    <mx:Image id="theImage" />
</mx:HBox>
...