as3位圖任意形變一步一步來(lái)3

《as3位圖任意形變一步一步來(lái)3》由會(huì)員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在行業(yè)資料-天天文庫(kù)。

1、AS3位圖任意形變一步一步來(lái)(3)——切割位圖PostedonNovember18,2008byFdream對(duì)不起，讓大家久等了，繼續(xù)寫blog。今天我們繼續(xù)研究位圖的任意形變，今天的主要目的就是從外部加載一張圖片，然后分割成兩個(gè)三角形。當(dāng)然了，分割成兩個(gè)三角形是遠(yuǎn)遠(yuǎn)不夠的，這一點(diǎn)，我們?cè)诤竺鏁?huì)講到。從外部加載一張圖片很簡(jiǎn)單，使用Loader類就可以輕松完成了。不過(guò)要注意的是這里是Loader類，在包flash.display下，而不是flash.net下的URLLoader類。這個(gè)類使用很簡(jiǎn)單，如下（為了簡(jiǎn)單，這就不寫那些條條框框了，直接寫在時(shí)間軸上了，所有的代碼都在第一幀）：1.//

2、這個(gè)是我們要load的圖片?2.varurl:String='green.jpg';?3.?4.//這個(gè)是用來(lái)保存位圖數(shù)據(jù)的?5.varbmd:BitmapData=null;?6.?7.//load方法?8.functionLoad():void{?9.??varreq:URLRequest=newURLRequest(url);?10.??varloader:Loader=newLoader();?11.??//添加事件偵聽(tīng)?12.??ConfigureListeners(loader.contentLoaderInfo);?13.??try{?14.????//加載圖片?15.??

3、??loader.load(req);?16.????//如果你要在舞臺(tái)上顯示出來(lái)?17.????//可以添加下面的代碼?18.????//this.addChild(loader);?19.??}catch(err:Error){?20.??}?21.}?22.?23.functionConfigureListeners(dispatcher:IEventDispatcher):void{?24.??dispatcher.addEventListener(Event.COMPLETE,CompleteHandler);?25.}?26.?1.//事件控制函數(shù)?2.functionCom

4、pleteHandler(evt:Event):void{?3.??varld:Loader=Loader(evt.target.loader);?4.??varinfo:LoaderInfo=LoaderInfo(ld.contentLoaderInfo);?5.??//保存位圖數(shù)據(jù)?6.??bmd=newBitmapData(info.width,info.height);?7.??bmd.draw(info.content);?8.}要分割成三角行，我們實(shí)現(xiàn)的方式是，先繪制一個(gè)三角形，然后用位圖來(lái)填充，繪制和填充也很簡(jiǎn)單：1.//bw是我們最后繪制的三角形的寬?2.//bh是我們最

5、后繪制的三角形的高?3.//我這里的圖片寬高比是4:3，為了簡(jiǎn)單，就這樣直接指定了?4.varbw:Number=280,bh:Number=210;?5.?6.//給出三個(gè)點(diǎn)，繪制三角形?7.//并使用位圖數(shù)據(jù)填充?8.functiondrawTriagle(pa:Object,pb:Object,pc:Object):Shape{?9.??varr=newShape();?10.??//為了清晰可見(jiàn)，你可以給三角形畫一個(gè)邊框?11.??//加上下面一行代碼即可?12.??//r.graphics.lineStyle(0,0xccff00);?13.??varm:Matrix=newM

6、atrix();?14.??//由于圖片比繪制的三角形的寬高要大?15.??//需要對(duì)其進(jìn)行縮放處理?16.??varsx=bw/bm.width;?17.??varsy=sx;?18.??m.scale(sx,sy);?19.??//使用位圖填充三角形?20.??r.graphics.beginBitmapFill(bm.bitmapData,m,false,true);?21.??r.graphics.moveTo(pa.x,pa.y);?22.??r.graphics.lineTo(pb.x,pb.y);?23.??r.graphics.lineTo(pc.x,pc.y);?24.

7、??r.graphics.lineTo(pa.x,pa.y);?25.??r.graphics.endFill();?26.??//返回當(dāng)前繪制的三角形?27.??returnr;?28.}還差一步，就是要把這兩步連接起來(lái)，我們?cè)賮?lái)寫一個(gè)非常簡(jiǎn)單的split方法，當(dāng)位圖加載完成后，調(diào)用split方法。通過(guò)split方法，繪制兩個(gè)三角形：1.vartriangle_a:DisplayObject=null;?1.vartriangle