稍微瞭解WWW歷史發展的人，應該都知道，HTML是為瞭解決SGML過於複雜而推出的精簡版本，它讓標籤式的語言大為普及起來。
而後來為了更複雜的結構，以及實現讓機器能閱讀文件的理由，XML也出現了。
雖然XML比HTML難一點，但基本上標籤式的基本結構，仍然對於處理資料而言，仍然算簡單。
而MXML，其實就是一種XML語言。
所以當你要寫MXML的時候，就是打開筆記本，依照它的語法打一打，存成xxx.mxml，就可以送去編譯成swf檔了。
到這裡，你大概可以想像MXML的樣子，然而為什麼稱MXML為Flex的靈魂角色呢？
這樣說好了，我們可以說，Flex的強項，就是在建立性感、迷人的UI，就拿現場直擊Flex面貌提供的Mindomo來說，它能建立出宛如Office 2007的look & feel，並且能讓你動態拖拉一些元件，提供直覺的操作方式。
這種操作感，都是過去的Web開發難以辦到或必須花費百分之兩、三百的力氣。
也因此，在Flex的工廠中，必然有許多建造這些UI元素的祕密武器，而這就是MXML工作。
基本上，我們可以把MXML的元素分成兩類，看得到的和看不到的。
看得到的，又可分成兩類，容器與控制項。
容器可以看成是用來協助定位的元素，例如可以將元素水平或垂直對齊的元件，或是像Tab這樣的東西。
控制項則是像按鈕啦、文字輸入框啦這些東西。
看得見的好理解，那肉眼看不見的又是什麼呢？
（想起倪匡的小說《透明光》呀）
其實就是一些資料元件，像是陣列或集合或是建立Web Service的元素；還有一些工具元件，像是資料繫結(data binding)的元件或是可以做到程式中loop效果的反覆元件等。
MXML的元件，大概不脫上述幾類，另外它也能透過屬性來處理一些事件，像是click之後發射炸彈開始炸小財神之類的。
MXML原始碼
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
- <mx:Label x="27" y="25" text="Hello! iT邦邦友" width="424" color="#EEEEEE" fontSize="50"/>
- </mx:Application>
編譯後的結果
- <?xml version="1.0" encoding="utf-8"?>
對這一行，大家應該都不陌生，這是XML的表頭宣告，主是宣告了版本與編碼的資訊。
再來第二行則是MXML的大菜上桌。
<mx:Application>是MXML的XML結構的根元素，所有MXML應用程式標籤都需要放在這個根元素底下。
開頭那個怪怪的「mx」是MXML的名稱空間，所有FLEX的標籤，都會用mx來起頭標示。
例如要用Flex的Button的話，就會用到<mx:button>這樣的標籤格式。
接下來「xmlns:mx="http://www.adobe.com/2006/mxml"」是xml名稱空間的宣告，一般而言，就是行禮如儀地放上去。
而「layout="absolute"」指的是這個應用程式採絕對定位的方式，所以元素都是用x、y明確位置來指定出現的地方。
因此，這個根元素的宣告就結束了。要記住的是，XML有一個法則就是:
這樣
這樣
還要這樣。
四個字的成語，猜一下?
相親相愛?
不是啦!
成雙成對!! Bingo!
用<mx:Application>開頭，就一定要有個</mx:Application>結尾，成雙成對的XML文件能是正確的。
再來就是Label的部份。
<mx:Label>是Flex用來作標示字的標籤，我們拿他來放「Hello! iT邦邦友」這樣的內容。
首先我們看到「x="27" y="25" 」的屬性，這意味Label要放在距離程式左上角的地方，右移27像素，下移25像素。
「text="Hello! iT邦邦友"」則是將內容放進text屬性中，實際上顯示的內容就會是這裡的文字。
接著，我們還宣告了「width="424" color="#EEEEEE" fontSize="50"」，代表這個label寬度是424像素，顏色是白色(#ffffff)，字型的尺寸是50。
就這樣，我們第一隻程式完成了。
(你剛剛不是說要成雙成對嗎?這個怎麼沒有呢?)
其實要有也是可以的，我們可以改寫成<mx:label>Hello! iT邦邦友</mx:label>，不過為了簡潔起見，我們將內容放到text屬性中，然後呢在開頭的label標籤中，把收尾的標籤那條斜線偷過來，變成<mx:label ... />，這樣子，就算沒有成雙成對，也是可以的。
這是XML的一種變通作法。
好啦，補課完畢，下次再見囉。