Skip to content

Introduction to BaseGXMLMediator

Glidias edited this page Sep 14, 2010 · 10 revisions

BaseGXMLMediator, under the sg.camogxml.mx.robotlegs package, is a RobotLegs’ mediator class that supports runtime MXML-like binding, and rendering of custom display-list structures through plain XML markup. It manages an IGXMLRender instance, examples of which are available in the sg.camogxml.render package.

Data-binding is performed on inline attributes for each render node, by supplying a IPropertyBinder/IPropertyApplier dependency to the instantiated gxml render. Then IGXMLRender#renderGXML(markup:XML):void is called to begin rendering the GXML and binding it to the your data models or between id-specified GXML-rendered nodes through the API call IGXMLRender#getRenderedById(id:String):DisplayObject .

Data models can exist as injected dependencies or public properties within your mediator class through the <local> tag, or dynamically created on the fly using <recurse>, <xml> or <create> model tag declarations. These model tag declarations can be used to instantiate/reference any class to act as a model, and populate it with data as defined in the XML chunk. Just specify a unique id in the XML structure for the model so it can be referenced by other (G)XML items. Each sub-node within each model XML chunk provides the ability to perform type-conversion of properties through a ITypeHelper utility. This gets around with the limitations of Flex’s MXML framework with it’s limited untyped <mx:Model> and <mx:XML> nodes. With GXML, you can truly develop models or classes that hold strictly-typed information, such as hex color, numbers, booleans, or your own unique data types with just XML alone. Furthermore, since each model node allows you to declare a class definition to go along with it, you can create any class you wish to act as a model, allowing you to easily integrate your own custom wrapper/proxy objects (such Proxies that hold bindable E4x properties, etc.).

What’s more? It uses a BindingUtils wrapper known as GBindingUtils under the sg.camogxml.mx.binding package that supports using function calls and array index access. This allows bindings that can appear in various forms like: someModel.someArrayCollection.getItemAt(0)[4][2] or someBitmap.getPixelAt(4,2) . With GXML, such bindings to function calls (with parsable/type-convertible parameters), is possible, including array index access, all in pure Actionscript.

Here’s a preview of how such an XML look like:

<gxml>
	<Models>
		<local id="typeHelper" class="sg.camo.interfaces::ITypeHelper"></local>
		<local id="typeHelper2" var="typeHelper"></local>
                <local id="arrayList" var="arrayCollectionList"></local>
		<recurse id="buildModel" class="mx.utils::ObjectProxy">
			<active type="boolean">false</active>
			<label>Build</label>
			<colors>
				<black type="uint">#000000</black>
				<red type="uint">#ff0000</red>
				<green type="uint">#00ff00</green>
				<blue type="uint">#0000ff</blue>
			</colors>
		</recurse>
	</Models>
	<Bindings>
		<bind destination="editMenu.text" source="buildModel.label"></bind>
		<bind destination="inputField.text" source="inputField2.text" twoWay="true"></bind>
	</Bindings>
	<stylesheet>
		<![CDATA[]]>
	</stylesheet>
	<body>
		<BuilderMainMenu spacing="0">
			<BuilderMenu id="fileMenu" text="File" labelColor="buildModel.colors.red">
				<BuilderLink href="new">New GXML</BuilderLink>
				<BuilderLink href="open">Open GXML</BuilderLink>
				<BuilderLink>New Batch</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}">Export GXML</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}">Submit GXML</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}">Close</BuilderLink>
				<BuilderLink>Exit</BuilderLink>
			</BuilderMenu>
			<BuilderMenu id="editMenu" text="Edit">
				<BuilderLink mouseEnabled="{buildModel.active}" href="undo">Undo</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}" href="redo">Redo</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}" href="copy">Copy</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}" href="cut">Cut</BuilderLink>
				<BuilderLink mouseEnabled="{buildModel.active}" href="paste">Paste</BuilderLink>
			</BuilderMenu>
			<BuilderMenu id="viewMenu" text="View">
				<BuilderLink mouseEnabled="{buildModel.active}">Tracing Image...</BuilderLink>
			</BuilderMenu>
			<BuilderMenu id="windowMenu" text="Window">
				<BuilderLink>GXML</BuilderLink>
				<BuilderLink>CSS</BuilderLink>
			</BuilderMenu>
			<BuilderMenu id="helpMenu" text="Help">
				<BuilderLink>About...</BuilderLink>
			</BuilderMenu>
			<InputText id="inputField" />
			<InputText id="inputField2" />
                        <BuilderList id="builderList">
                                   <BuilderItem image="arrayList.getItemAt(0)" />
                                   <BuilderItem image="arrayList.getItemAt(1)" />
                         <BuilderList>
		</BuilderMainMenu>
	</body>
</gxml>

Clone this wiki locally