0

At my work we are working on a Java Flash web application and our back end system will send XML to the UI through a web service. The web service will send the customer layout to the front-end in XML and the UI will render widgets based on the widget IDs provided in the layout XML. Examples of our XML are:

<layout>
<widget name="Scheduler Widget" widgetId="17ca7746-efbe-11e2-986e-e73d14d17dba">
<widget name="Scheduler Calendar" widgetId="5bcf13a0-efde-11e2-b031-bb52e5b1d05c">
<widget name="Scheduler Calendar Picker" widgetId="e1a430a4-eff3-11e2-8e64-4336a0ae0273">
<attribute name="file" value="picker.swf"/>
</widget>
<attribute name="file" value="calendar.swf"/>
<attribute name="name" value="cal name"/>
</widget>
<attribute name="file" value="scheduler.swf"/>
</widget>
<widget name="Report Widget" widgetId="3a3cb820-efbe-11e2-93df-dbecb33fa407">
<attribute name="name" value="test"/>
<attribute name="file" value="report.swf"/>
</widget>
</layout>

Does Flash have the ability to grab the attribute named file and render that swf file? Also if there are more attributes like colour, size, position, etc for that widget, can Flash use those attributes for that swf file?

Along with those questions can someone provide an example of how this could be implemented? I am not a Flash developer, I am just researching this for someone else. I found this that explains that Flash has the ability to be dynamic:

Dynamic UI window drawing in Flash?

Community
  • 1
  • 1
ColinMc
  • 1,238
  • 3
  • 16
  • 33

1 Answers1

2

Most definitely.

Reading the XML

var myLoader:URLLoader = new URLLoader();
myLoader.load(new URLRequest("ui.xml"));
myLoader.addEventListener(Event.COMPLETE, processXML);

function processXML(e:Event):void {
    var xml:XML = new XML(e.target.data);
    trace(xml.layout.widget[2].attribute.@value); // traces "picker.swf"
}

Reading an xml object is a lot like reading any other hierarchy, utilizing dot.notation, bracket[indexes], but with an added @attribute identifier for accessing properties on a node. It's also a little weird, as just identifying (generically) xml.layout.widget would in-fact return every instance of widget and its contents as a string.

Read these for thorough documentation:

Republic of Code: AS3 XML

Adobe Actionscript 3 Reference: XML


Rendering

Rendering those widgets is a matter of how you interpret the data. Technically, you could try a limited amount of HTML rendering via htmlwrapper or htmlText, but I doubt you'd want to go that way. More likely, you'll create your own representations of Widgets in Flash, and define generic deviations of those widgets in XML.

Consider the following XML:

<?xml version="1.0" encoding="utf-8"?>
<layout>
    <widget
        kind="Spinner"
        name="Alpha"
        color="0xFF0000"
        x="100"
        y="100"
        width="50"
        height="50"
        file="foo.jpg" />
    <widget
        kind="Slider"
        name="Beta"
        color="0x0000FF"
        file="bar.swf" />
</layout>

We could then implement two classes: Spinner and Slider which have predefined properties and event listeners.

package {
    import flash.display.*;

    public class Spinner extends Sprite {
        private var defaults:Object = {
            "x":10,
            "y":10,
            "width":50,
            "height":50,
            "color":0x000000
        };



        public function Spinner(settings:Object = null) {
            // Store the settings passed for any present defaults
            for (var attribute:String in settings) {
                if (defaults.hasOwnProperty(attribute)) {
                    defaults[attribute] = settings[attribute];
                }
            }

            // Update the appearance to match the settings.
            with (defaults) {
                graphics.beginFill(color, 1);
                graphics.drawRect(x, y, width, height);
                graphics.endFill();
            }

            if (settings.hasOwnProperty("name")) {
                this.name = settings.name
            }
        }
    }
}

When we read the XML, we'd go through each node and pull up the attributes of that node and apply it to the class constructors...

function processXML(e:Event):void {
    var layout:XML = new XML(e.target.data);

    for each (var widget:Object in layout) {
        switch (widget.kind) {
            case "Spinner":
                addChild(new Spinner(widget))
                break;
            case "Slider":
                addChild(new Slider(widget))
                break;
        }
    }
}

Disclaimer: accessing xml nodes this way is probably not correct. Consider it as psuedo-code. I always sanitize my xml as nested object/array hierarchies before using them, so I'm a little out of practice.

In short order, the XML dictates the appearance of our objects, but the Actionscript dictates what those objects are and when/how we add them to the screen.

Atriace
  • 2,572
  • 1
  • 14
  • 27
  • So when getting the XML from the web service can Flash render an unknown amount of widgets from the layout XML and dynamically render them with the provided attributes such as colour, position on the screen, size of the widget, etc? By the way thanks for the example and references. :D – ColinMc Jul 23 '13 at 15:26
  • See the added **Rendering** section of the answer. – Atriace Jul 23 '13 at 16:58
  • Just asking, is that really what SO is for... four pages of introductory documentation and examples? – Papasmile Jul 23 '13 at 17:30
  • See http://meta.stackoverflow.com/help/dont-ask & http://meta.stackoverflow.com/help/how-to-ask. SO is not here to teach you how to program, but how to resolve programming issues. Civility is what gets you a 4-page response with a clearly defined solution. To answer your question, see http://meta.stackoverflow.com/about under "Why do we need this site?" – Atriace Jul 23 '13 at 17:44
  • Thank you for answering my questions. From your examples it looks like it is doable. :D – ColinMc Jul 23 '13 at 19:22