使用mxml來製作Flash

一般來說, 要產生swf格式有很多方法
1.直接使用Flash發怖.fla , 但大部份 Flex mx 類別都無法使用
2.使用 Flex 標準 mxml發怖, 但檔案 200k 起跳
經過不斷的爬文, 發現 mxml 只是一個序述的格式, 也就是可以完全的客製化表籤名稱
這樣就可以使用 mxml 來寫 as, 只要不用到 mx 類別, 就不會變胖。
參考了這幾個網站得來的心得：
http://www.ryancampbell.com/2009/08/26/using-mxml-without-flex-example-and-source/
http://pv3d.org/2009/03/17/mxml-without-the-flex-framework/
最好用的當然是 Bindable 了呀
只要寫{xxxx}就可以直接挷定, 不需再像寫.as一樣寫一大堆了。
而視覺元件可以用Flash製作成.swc來使用
程式碼：

MXMLContainer基底用的類別, 是 extends Sprite不是UIComponent喔
<br />package milkmidi.mxml { <br /> import flash.display.DisplayObject;<br /> import flash.display.Sprite; <br /> [DefaultProperty("children")]<br /> public class MXMLContainer extends Sprite { <br /> private var _children :Array; <br /> public function MXMLContainer() { <br /> } <br /> public function get children():Array{<br /> return _children;<br /> } <br /> public function set children(pArr:Array):void { <br /> if (_children == pArr) return;<br /> <br /> _children = pArr;<br /> for each(var c:DisplayObject in pArr){<br /> addChild(c); <br /> } <br /> } <br /> } <br />}<br />
把之前練習過的CoverFlow拿出來改一下, 這個就很一般。
<br />package milkmidi.coverflow { <br /> <br /> import flash.display.*; <br /> import flash.events.Event;<br /> import flash.events.MouseEvent;<br /> import flash.net.URLRequest;<br /> import gs.TweenMax;<br /> public class ItemMC extends Sprite { <br /> public var uid :int = 0;<br /> private var _ldr:Loader = new Loader(); <br /> <br /> //______________________________________________________________________________________Constructor <br /> public function ItemMC() { <br /> this.addChild(_ldr);<br /> _ldr.contentLoaderInfo.addEventListener(Event.COMPLETE , loaderCompleteHandler);<br /> this.buttonMode = true;<br /> this.addEventListener(MouseEvent.ROLL_OVER , rollOverHandler);<br /> this.addEventListener(MouseEvent.ROLL_OUT , rollOutHandler);<br /> } <br /> public function demoDraw(pDis:DisplayObject):void { <br /> this.addChild(pDis);<br /> pDis.x -= pDis.width / 2;<br /> pDis.y -= pDis.height / 2; <br /> }<br /> private function rollOverHandler(e:MouseEvent):void {<br /> TweenMax.to(this, 1, {colorMatrixFilter:{brightness:1.5}});<br /> }<br /> private function rollOutHandler(e:MouseEvent):void {<br /> TweenMax.to(this, 1, {colorMatrixFilter:{brightness:1}});<br /> } <br /> private function loaderCompleteHandler(e:Event):void { <br /> _ldr.x -= _ldr.width / 2;<br /> _ldr.y -= _ldr.height / 2; <br /> }<br /> public function set url(pURL:String):void {<br /> _ldr.load(new URLRequest(pURL)); <br /> } <br /> } <br />}<br />
MXML登場
<br /><?xml version="1.0" encoding="utf-8"?> <br /><milkmidi:MXMLContainer <br /> xmlns:mx="http://www.adobe.com/2006/mxml" <br /> xmlns:milkmidi="milkmidi.mxml.*"<br /> xmlns:flash="flash.display.*" <br /> xmlns:net="flash.net.*"<br /> xmlns:text="flash.text.*" <br /> xmlns:cover="milkmidi.coverflow.*"<br /> addedToStage="addToStageHandler()" <br /> enterFrame="enterFrameHandler()"<br /> ><br /> <mx:Metadata><br /> [SWF(width="900", height="600", backgroundColor="#0",frameRate="41")]<br /> </mx:Metadata><br /> <mx:Script><br /><！[ｃｄａｔａ[ <br /> import flash.events.MouseEvent;<br /> import gs.easing.Cubic;<br /> import gs.TweenMax; <br /> private function addToStageHandler():void { <br /> shiftToItem(3);<br /> }<br /> private function clickHandler(e:MouseEvent):void {<br /> shiftToItem(e.currentTarget.uid);<br /> }<br /> private function enterFrameHandler():void {<br /> var _targetY:int = (stage.stageHeight / 2 - stage.mouseY) / 30 + 20;<br /> container.rotationX = _targetY;<br /> }<br /> public function shiftToItem(pID:int):void{ <br /> var _tweenObj:Object; <br /> var _numberOfItem:uint = container.children.length;<br /> for (var i:int = 0; i < _numberOfItem; i++){<br /> var _mc:DisplayObject = this['a'+i] <br /> var dis :int = i - pID; <br /> if (i == pID) { <br /> _tweenObj = {<br /> x :0,<br /> y :-50,<br /> z :-450, <br /> rotationY :0,<br /> onUpdate :onTweenerUpdate <br /> }; <br /> } else if (i < pID) { <br /> _tweenObj = {<br /> x :dis * 120 - 50,<br /> y :0,<br /> z :Math.abs(dis) * 100, <br /> rotationY : -43<br /> };<br /> <br /> } else { <br /> _tweenObj = {<br /> x :dis * 120 + 50,<br /> y :0,<br /> z :Math.abs(dis) * 100, <br /> rotationY :43<br /> };<br /> }<br /> _tweenObj.ease = Cubic.easeInOut; <br /> TweenMax.to(_mc, .6, _tweenObj); <br /> }<br /> }<br /> private function onTweenerUpdate():void {<br /> var _array:Array = container.children;<br /> _array.sortOn("z", Array.NUMERIC| Array.DESCENDING); <br /> for (var i:int = 0; i< _array.length; i++) {<br /> var _child:DisplayObject = _array[i] as DisplayObject;<br /> if ( i != container.getChildIndex(_child)) {<br /> container.setChildIndex( _child, i ); <br /> }<br /> } <br /> }<br /> ]]><br /> </mx:Script> <br /> <br /> <milkmidi:children><br /> <milkmidi:MXMLContainer id="container" x="450" y="300" z="500" rotationX="5"><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a0" uid="0" /><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a1" uid="1" /><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a2" uid="2" /><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a3" uid="3" /><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a4" uid="4" /><br /> <cover:ItemMC url="assets/demo.jpg" click="clickHandler(event)" id="a5" uid="5" /><br /> </milkmidi:MXMLContainer><br /> </milkmidi:children><br /></milkmidi:MXMLContainer><br />
經過 release 發怖, 檔案也才 18kb
之後再來想想要怎麼應用好了。
SourceCodeDownload
需要使用FlexBuilder發怖或是用 FlashDevelop + FlexSDK