Datenübertragung bei dem UI-Element FlashIsland

Die Datenübertragung bei FlashIsland wird anhand eines Beispiels erkläutert. Dabei handelt es sich um ein mit dem Adobe Flex Builder erstelltes Balkendiagramm anhand von Werten aus dem SAP-System,, bei dem für Firmen die Werte für termingerechte Lieferungen (OTD) und ausgelieferter Materialdurchsatz (RTY) in Form zweier Balken angezeigt werden. In einer Web-Dynpro-Applikation können Endbenutzer Werte für OTD und RTY in InputFields eingeben, und beim Drücken des Buttons Save wird die in die Web-Dynpro-Anwendung eingebettete Adobe Flash-Komponente mit den Balkendiagrammen entsprechend aktualisiert.

Ausgangspunkt ist bei diesem Beispiel eine SWF-Datei (inklusive Debug- SWF-Datei) sowie Informationen über diese SWF-Datei, beispielsweise welche Variablen, Listen und Aktionen benötigt werden.

Die SWF-Datei erwartet eine Liste namens flexSource mit den Spalten:

• Company

• otd

• rty

Damit die Adobe-Flash-Anwendung mit der Web-Dynpro-Anwendung kommunizieren kann, müssen Sie die Web Dynpro Island Library for Flex Ihrem Projekt bekannt machen:

1. Dabei handelt es sich um die .swc-Dateien WDIslandLibrary.swc und WDIslandLibrary-debug.swc.

   Diese beiden Dateien sind im MIME-Repository unter dem Pfad SAP/PUBLIC/BC/UR/nw7/FlashIslands/ abgelegt.

   Speichern Sie sich diese beiden Dateien so ab, dass Sie jederzeit Zugriff darauf haben, z.B. auf Ihrem lokalen Dateisystem Ihres Rechners.

2. Im Adobe FlexBuilder legen Sie sie unter BuildPath ab.

3. Im Adobe Flex-Coding importieren Sie die Library überall, wo Sie etwas mit Flash-Islands programmieren möchen.

   Im folgenden Beispiel-Coding ist das die Zeile import sap.FlashIsland;

4. Für das Funktionieren der Datenübertragung registrieren Sie in der Adobe-Flex-Applikation die entsprechende Adobe-Flex-Component über FlashIsland.register( <component_name>);

Diese Variablen sollen von der Web-Dynpro-Applikation zu der FlashIsland und umgekehrt in Form von gebundenen Variablen übergeben.

1. In Ihrer Web-Dynpro-Anwendung liegt ein Context-Knoten vor, der wenigstens drei Attribute besitzt.

   • COMPANY

   • OTD

   • RTY

   Dies kann beispielsweise so aussehen:

   

2. Dieser Context-Knoten sollte vor dem Aufruf der FlashIsland gefüllt sein. Dazu können Sie beispielsweise eine Supply-Funktion verwenden:

   

   Der "Rest" wird über das Layout definiert.

3. Legen Sie das Layout fest.

   Sie benötigen für jede SWF-Datei eine eigene Web-Dynpro-View, da eine FlashIsland immer der RootUIElementContainer einer View ist und dessen Eigenschaft swfFile während der Lebensdauer der View nicht geändert werden kann. Daher gehen Sie folgendermaßen vor:

   1. Verzweigen Sie zu Ihrer View.

   2. Ändern Sie den Typ des RootUIElementContainerüber Root-Element austauschen im Kontextmenü auf FlashIsland.

   3. Da die SWF-Datei wie oben erläutert eine Liste erwartet, aggregieren Sie eine GACDataSource mit in diesem Falle drei wiederum aggregierten Properties. Da die GACDataSource die erwartete Liste darstellt, verwenden Sie als Property dataSource den gefüllten Context-Knoten und als Property name die flexSource. Im FlashIsland wird eine Liste namens flexSource erwartet.

      Achtung

      Achten Sie dabei immer auf Namensgleichheit.

      Die ID dieses UI-Elements ist vollkommen nebensächlich und interessiert weder die Web-Dynpro-Anwendung, noch das FlashIsland.

      Analog zur GACDataSource deklarieren Sie nun die GACProperties ( value entspricht dem Bindungspfad auf das zugehörige Context-Attribut, name ist der Name, wie er im FlashIsland erwartet wird, und die ID ist wiederum unerheblich).

      Dies kann dann folgendermaßen aussehen:

      

4. Legen Sie die MIMEs ab.

   Speichern Sie die SWF-Datei (und auch die -debug.swf-Datei) immer unterhalb der Component, wenn nur diese eine Component darauf zugreift, Wenn auf eine SWF-Datei von mehrern Components aus zugegriffen werden soll, legen Sie sie in einem übergreifenden Ordner im MIME-Repository ab. Beachten Sie dabei Kunden-Namensräume.

   Tragen Sie den Pfad auf die enstprechende SWF-Datei als Wert für die Eigenschaft swfFile der FlashIsland ein:

   

5. Aktivieren Sie die Component und die View und starten Sie die Anwendung.

   Sie bekommen die Anwendung im Browser angezeigt, wie oben im Beispiel dargestellt.