с использованием визуализации элемента изображения в гибкой сетке данных - PullRequest
1 голос
/ 07 июля 2010

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

Вот мой код DataGrid

Значение "str" ​​в функции getImagePath является правильным.

<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml"
             doubleClickEnabled="true">
    <mx:Script>
        <![CDATA[
            private function userLabelFunction(item:Object, column:DataGridColumn):String
            {
                return item.user.username;
            }

            private function getImagePath(item:Object, column:DataGridColumn):String
            {
                var str:String=item.track["artwork-url"]

                if (str == "")
                {
                    str=item.user["avatar-url"];
                }

                return str;

            }
        ]]>
    </mx:Script>
    <mx:columns>
        <mx:DataGridColumn dataField="artwork-url"
                           headerText="Art"
                           itemRenderer="components.content.contents.datagrids.ImageRenderer"
                           labelFunction="getImagePath"/>
        <mx:DataGridColumn dataField="title"
                           headerText="Title"
                           minWidth="100"/>
        <mx:DataGridColumn dataField="user"
                           headerText="User"
                           labelFunction="userLabelFunction"/>
        <mx:DataGridColumn dataField="bpm"
                           headerText="BPM"/>
    </mx:columns>
</mx:DataGrid>

Мне не удается передать значение URL этого изображения в средство визуализации элементов

Я пытался переопределить установленное свойство данных следующим образом

<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml"
         height="60"
         verticalAlign="top"
         creationComplete="init()">
    <mx:Script>
        <![CDATA[
            import components.content.contents.containers.ContentContainerSoundCloud;
            import mx.core.Application;
            import mx.controls.dataGridClasses.DataGridColumn;
            import com.adobe.viewsource.ViewSource;

            [Bindable]
            public var imgPath:String;

            private function init():void
            {

            }
            override public function set data(value:Object):void
                    {
                        super.data = value.track["artwork-url"];

                        imgPath =super.data.valueOf()
                        trace(imgPath)

                    }
        ]]>
    </mx:Script>

    <mx:Image source="{imgPath}" id="rowimage"/>
</mx:HBox>

Но при этом вывод трассировки выглядит так

<artwork-url>
  <mx_internal_uid>7C98E149-1984-584C-7600-AD8940BF2A9C</mx_internal_uid>
</artwork-url>

Я ожидал, что свойство "value" в установленных данных получит строку, которую я отправил из функции get imagePathFunction, но на самом деле он возвращает весь мой XMLList.

Что я делаю не так?

1 Ответ

3 голосов
/ 07 июля 2010

Исходя из результатов трассировки, создается впечатление, что вы извлекаете неправильное значение из вашего dataProvider для установки в качестве источника. Не видя ваших фактических данных, трудно понять, какая именно проблема может быть.

Тем не менее, я бы немного переделал ваш itemRenderer. Во-первых, вам не нужно помещать одно изображение в HBox. Просто используйте изображение. Кроме того, вам не нужно указывать высоту в Renderer, DataGrid должен заботиться о таком позиционировании.

Я также удалил слушатель creationComplete, так как в нем не было никакого кода. И вместо того, чтобы использовать привязку, я просто устанавливаю свойство soruce для компонента в методе набора данных. Я также установил значение super.data, а не обработанное значение; и я выполнил обработку при установке источника значения. Обновленный код выглядит так:

<?xml version="1.0" encoding="utf-8"?>
<mx:Image xmlns:mx="http://www.adobe.com/2006/mxml"
         >
    <mx:Script>
        <![CDATA[
            import components.content.contents.containers.ContentContainerSoundCloud;
            import mx.core.Application;
            import mx.controls.dataGridClasses.DataGridColumn;
            import com.adobe.viewsource.ViewSource;

            [Bindable]
            public var imgPath:String;

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

                        this.source =value.track["artwork-url"];
                        trace(imgPath)

                    }
        ]]>
    </mx:Script>

</mx:Image>

Мой предпочтительный метод в itemRenderers - прослушивание события dataChange, однако это всего лишь личные предпочтения. Нет ничего плохого в переопределении метода набора данных.

...