itemRenderer

[porcupine]

Hallo Flashforum,

ich bin neu hier, möchte gerne ein wenig mit Flex experimentieren und habe auch gleich eine Frage:

ich habe eine basis.mxml

PHP-Code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            import mx.collections.*;
            [Bindable]
            private var myAC:ArrayCollection = new ArrayCollection( [
                { label: "label1", data: "data1" },
                { label: "label2", data: "data2" }

            ]);
            
            public function getText():String{
                return "dies ist mein Text";
            }
            
        ]]>
    </mx:Script>
    
    
    <mx:DataGrid x="0" y="0" width="100%" height="100%" editable="false" dataProvider="{myAC}" enabled="false">
        <mx:columns>
            <mx:DataGridColumn dataField="label" headerText="header1"/>
            <mx:DataGridColumn dataField="data" headerText="header2" itemRenderer="myRenderer"></mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>
    
</mx:Application>

und die dazugehörige myRenderer.mxml

PHP-Code:

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
    <mx:Label x="182.5" y="51" text="{root.getText()}"/>    
</mx:Canvas>

So wies in der myRenderer.mxml steht, gehts wohl nicht.
Wie greife ich denn korrekt auf die Funktion getText() in der basis.mxml zu?

Würde mich über eine Antwort freuen.

[der_hess]

Hi

ich würde dein Problem komplett über MXML in einer Datei lösen:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Script>
        <![CDATA[
            import mx.collections.*;
            [Bindable]
            private var myAC:ArrayCollection = new ArrayCollection( [
                { label: "label1", data: "data1" },
                { label: "label2", data: "data2" }

            ]);
            
            public function getText():String{
                return "dies ist mein Text";
            }
            
        ]]>
    </mx:Script>
    
    
    <mx:DataGrid x="0" y="0" width="100%" height="100%" editable="false" dataProvider="{myAC}" enabled="false">
        <mx:columns>
            <mx:DataGridColumn dataField="label" headerText="header1"/>
            <mx:DataGridColumn dataField="data" headerText="header2">
                   <mx:itemRenderer>
                           <mx:Component>
                                <mx:Canvas width="400" height="300">
                                        <mx:Label x="182.5" y="51" text="{outerDocument.getText()}"/>    
                                 </mx:Canvas>
                           </mx:Component>
                   </mx:itemRenderer>
             </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>
    
</mx:Application>

Dabei sind die Stichwörter Inline ItemRenderer (bedeutet wenn alles in einem MXML File definiert ist) und der Component Tag (erstellt eine unabhängige Komponente innerhalb einer Komponente - quasi einer Inner Class), sowie das kleine wörtchen outerDocument (ermöglicht dir Zugriff auf Funktionen der MutterKomponente).

Dieser Ansatz macht eigentlich nur bei einfachen ItemRenderer Sinn. Mehr Infos zu Inline ItemRenderer gibt es in diesem Artikel:
Understanding Flex itemRenderers – Part 1: Inline renderers | Adobe Developer Connection

In einem älteren Blogeintrag von mir habe ich noch ein paar Links zum Thema ItemRenderer. Da kannst du ja gerne mal reinschauen:
Getting Advanced in Flex | der hess

[porcupine]

Hallo Hess,

vielen Dank auch!



Das mit dem outerDocument scheint allerdings nicht zu funktionieren, wenn die beiden Dateien separat sind.
Wie greife ich denn von der externen Datei auf outerDocument zu?



beste Grüße

Hans

[der_hess]

Hi Hans,

wie schon oben beschrieben, habe ich den Ansatz von Inline ItemRenderer benutzt. Dort gibt es keine externe Datei. Ich habe deine ItemRenderer Componente direkt in deine DataGrid Column (<mx: DataGridColumn dataField="data" headerText="header2">) Tag eingebunden. Schau dir mal den Part genau an. Der Befehl outerDocument funktioniert nur in Inline Item Renderer - Falls ich in dieser Sache unrecht haben sollte, bitte verbessert mich - andernfalls, wenn du unbedingt den ItemRenderer in einer seperaten Datei definieren möchtest, musst du den Ansatz von External ItemRenderer verwenden. Wie das geht ist hier gut beschrieben:

Understanding Flex itemRenderers — Part 2: External renderers | Adobe Developer Connection

wie du dabei allerdings auf übergeordnete Funktion zugreifen kannst, muss ich leider passen. Ich weiß nur dass manche ItemRenderer über ein spezielles Attribut den dataProvider der Komponente, die den ItemRenderer benutzt (siehe Seite 3 oder 4 im obigen erwähnten artikel) mit übergeben, ansonsten könntest du noch über das Attribut parent dich nach oben hangeln bis du bei der gewünschten Komponente angekommen bist. Allerdings ist das ne ziemlich häßliche Lösung.

Wünsch dir viel Glück dabei!

[Omega Psi]

Sicher, dass du das machen willst? Ich kenne keinen Anwendungsfall, in dem man das machen wollen würde. Dafür sind Renderer nicht gedacht. Im Zweifelsfall noch auf die List über BaseListData auf die Liste zugreifen.

Alles andere ist in der Regel falsch.