MXML
From Wikipedia, the free encyclopedia
 |
This article does not cite any references or sources. Please help improve this article by adding citations to reliable sources (ideally, using inline citations). Unsourced material may be challenged and removed. (July 2008) |
| Filename extension | .mxml |
|---|---|
| Developed by | Adobe Systems |
| Initial release | March 2004 |
| Type of format | User interface markup language |
| Extended from | XML |
MXML is an XML-based user interface markup language first introduced by Macromedia in March 2004. Adobe Systems (which acquired Macromedia in December 2005) gives no official meaning for the acronym, but some developers suggest it should stand for "Magic eXtensible Markup Language" (which is a backronym). It's likely that the name comes from the MX suffix given to Macromedia Studio products released in 2002 and 2004. Application developers use MXML in combination with ActionScript to develop Rich Internet applications, with products such as Adobe Flex.
MXML is used mainly to declaratively lay out the interface of applications, and can also be used to implement business logic and internet application behaviors. Common practices are employed in the language syntax, such as the use of curly braces ({) to force the computer to evaluate an expression, and dot notation to 'drill-down' through an object.
MXML is often used with Flex Server, which dynamically compiles it into standard binary SWF files. However, Adobe's Flex Builder IDE and free Flex SDK can also generate SWF files from MXML for use without Flex Server.
There is also a PHP PEAR package called XML_MXML which is a Framework to build Adobe Flex applications.
MXML is considered a proprietary standard due to its tight integration with Adobe technologies. It is like XAML in this respect. No published translators exist for converting an MXML document to another user interface language such as UIML, XUL, XForms, XAML, or SVG.
MXML is also a generic event log format used by a number of process mining tools (like the ProM framework) as a transfer format between application-specific log content and the process mining tool.
Here is some sample mxml application code:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" creationComplete="init()">
<mx:Script>
<![CDATA[
import mx.events.ListEvent;
import mx.collections.ArrayCollection;
[Bindable]private var tempAc:ArrayCollection = new ArrayCollection;
private function init():void{
for(var i:int = 0 ;i < 1000 ; i++){
var obj:Object = new Object;
obj.check = 1;
obj.a = "test1_" + i;
obj.b = "test2_" + i;
obj.c = "test3_" + i;
tempAc.addItem(obj);
}
}
private var selectIndex:int = 0;
private var scrollPosition:int = 0;
private function dataGirdClick(e:Event):void{
if(e.type == "itemClick"){
var tempEvent:ListEvent = e as ListEvent;
if(tempEvent.rowIndex != 0 ){
selectIndex = tempEvent.rowIndex;
scrollPosition = dataGrid.verticalScrollPosition;
}
}
}
public function dataGirdRefresh():void{
scrollPosition = dataGrid.verticalScrollPosition;
dataGrid.dataProvider = [];
dataGrid.dataProvider = tempAc;
dataGrid.selectedIndex = selectIndex;
dataGrid.verticalScrollPosition = scrollPosition;
}
[Bindable]public var headerCheckBox:Boolean = false;
]]>
</mx:Script>
<mx:DataGrid id="dataGrid" dataProvider="{tempAc}" width="300"
height="500" itemClick="dataGirdClick(event)" sortableColumns="false">
<mx:columns>
<mx:DataGridColumn headerText="checkBox"
textAlign="center">
<mx:headerRenderer>
<mx:Component>
<mx:HBox width="100%" horizontalAlign="center">
<mx:Script>
<![CDATA[
import mx.rpc.xml.IXMLSchemaInstance;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
private function clicked(event:Event) : void {
var oo : Object = event.currentTarget.parent.outerDocument;
var ix : uint = oo.dataGrid.selectedIndex;
var ac : ArrayCollection = oo.dataGrid.dataProvider as ArrayCollection;
outerDocument.headerCheckBox = chb_header.selected;
var acLength:int = ac.length;
for(var i:int = 0 ; i < acLength ; i++){
ac[i].check = outerDocument.headerCheckBox;
}
outerDocument.dataGirdRefresh();
}
]]>
</mx:Script>
<mx:CheckBox id="chb_header" width="20"
click="clicked(event)" selected="{outerDocument.headerCheckBox}" />
</mx:HBox>
</mx:Component>
</mx:headerRenderer>
<mx:itemRenderer>
<mx:Component>
<mx:HBox width="100%" horizontalAlign="center">
<mx:Script>
<![CDATA[
import mx.rpc.xml.IXMLSchemaInstance;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
private function clicked(event:Event) : void {
var oo : Object = event.currentTarget.parent.outerDocument;
var ix : uint = oo.dataGrid.selectedIndex;
var ac : ArrayCollection = oo.dataGrid.dataProvider as ArrayCollection;
oo.dataGrid.selectedIndex = ix;
ac[ix].check ^= 1;
if(outerDocument.headerCheckBox == true){
outerDocument.headerCheckBox = false;
}
}
]]>
</mx:Script>
<mx:CheckBox id="chb" width="20" click="clicked(event)"
selected="{data.check}" />
</mx:HBox>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="test1" dataField="a"
textAlign="center" />
<mx:DataGridColumn headerText="test2" dataField="b"
textAlign="center" />
<mx:DataGridColumn headerText="test3" dataField="c"
textAlign="center" />
</mx:columns>
</mx:DataGrid>
</mx:Application>
[edit] See also
[edit] External links
- An overview of MXML, the Flex markup language from Adobe Developer Center.
