早在之前寫過在
[url=http://www.webstudio.com.cn/tutorial/show.php?id=30]
flashmx2004中平鋪背景
[/url]
的方法,雖然它也是有效果的,但相對(duì)使用flash8時(shí)還是顯得有些復(fù)雜.這次介紹的是flash8中的MovieClip的新方法MovieClip.beginBitmapFill()法.使用這種方式來平鋪背景會(huì)非常的簡(jiǎn)單.下面開始.
[1b]演示文件:[/1b]
1.????我們需要先準(zhǔn)備一張小圖.當(dāng)前我們使用的是一張小的gif圖像如下圖所示:


如果你想測(cè)試可以直接下載些圖像來測(cè)試.
2.????新建一個(gè)flash文檔,大小隨意,將我們選定的這張圖像導(dǎo)入到庫中,并在庫中直接為此圖像設(shè)置鏈接.當(dāng)前我們?cè)O(shè)置為pattern1,基本方法是選中庫中剛導(dǎo)入的圖像,右擊選擇鏈接,如下圖所示:


3.????完成這一步操作之后,按下來我們準(zhǔn)備使用代碼來平鋪背景.在前面我們提到過我們將使用MoiveClip.beginBitmapFill()方法.我們先看一下beginBitmapFill()方法:
public beginBitmapFill(bmp:BitmapData, [matrix:Matrix], [repeat:Boolean], [smoothing:Boolean]) : Void
beginBitmapFill方法是用位圖來添充繪畫區(qū)域,也就是說它需要先有一個(gè)繪畫區(qū)域,它有四個(gè)參數(shù),bmp參數(shù)可以是一張透明或不透時(shí)的圖像,matrix參數(shù)主要用來用bmp進(jìn)行變換操作,包括旋轉(zhuǎn),縮放和移動(dòng),后面兩個(gè)參數(shù)repeat是設(shè)定是否重復(fù), smoothing參數(shù)是設(shè)計(jì)是否平滑,默認(rèn)為false即不平滑.針對(duì)于beginBitmapFill()最基本的應(yīng)用是你可以只使用bmp參數(shù).ok.下面我們準(zhǔn)備編碼.
4.????選中場(chǎng)景中的第一幀,在其中加入如下代碼:
[1b]代碼:[/1b]?
//導(dǎo)入flash8 bitmapData類
import flash.display.BitmapData;
//創(chuàng)建bitmapData實(shí)例,這里使用的是flash8的loadBitmap.如不清楚可以//參看本站的flash8 bitmapData教程
var tile:BitmapData = BitmapData.loadBitmap("pattern1");
//使用beginBitmapFill()方法開始添充.
this.beginBitmapFill(tile);
//下面一段是根據(jù)屏幕的大小來繪制繪畫區(qū)域,用以beginBitmapFill來添充.
this.lineTo(Stage.width, 0);
this.lineTo(Stage.width, Stage.height);
this.lineTo(0, Stage.height);
this.lineTo(0, 0);
this.endFill();
?
5.????現(xiàn)在測(cè)試你的影片,你就可以看到如下圖所示的效果了.


6.????呵呵,看上去的確很簡(jiǎn)單,只需要幾行代碼即可,相對(duì)于flashmx2004的平鋪效果來說,現(xiàn)在你不在需要計(jì)算屏幕的寬高能容納多少?gòu)埿D了.ok.現(xiàn)在點(diǎn)擊右上角的窗口放大按鈕,我們發(fā)現(xiàn)只有中心區(qū)域有添充,四周并沒有,也就是說它沒隨屏幕的變化而進(jìn)行重繪,這并不是我們想要的,對(duì)于背景來說,需要讓它隨著屏幕大小的變化而變化. 接下來我們繼續(xù)添加代碼.
7.????要想讓它隨著屏幕的大小變小,我們需要使用flash8中的Stage類來處理.如下代碼:
[1b]代碼:[/1b]?
Stage.scaleMode = "noScale";
Stage.align = "TL";
var stageListener:Object = new Object();
stageListener.onResize = function() {
????trace("w:"+Stage.width+", h:"+Stage.height);
????tilebg();
};
Stage.addListener(stageListener);
//調(diào)用tilebg()函數(shù)第一次繪制
tilebg();
*******************************************
import flash.display.BitmapData;
function tilebg(){
var tile:BitmapData = BitmapData.loadBitmap("pattern1");
this.beginBitmapFill(tile);
this.lineTo(Stage.width, 0);
this.lineTo(Stage.width, Stage.height);
this.lineTo(0, Stage.height);
this.lineTo(0, 0);
this.endFill();
}
?
我們?cè)谖覀冊(cè)械拇a之上加入了一段Stage大小變化的偵聽,這一段應(yīng)當(dāng)說是我非常常用的代碼,為了方便起見,我們把原來的代碼定義成一個(gè)函數(shù)即tilebg(),這樣當(dāng)屏幕大小發(fā)生變化時(shí),就會(huì)執(zhí)行onResize()方法,就會(huì)調(diào)用定義好的tilebg()函數(shù).ok.現(xiàn)在在測(cè)試你的影片,剛才的問題已經(jīng)解決了,你可以點(diǎn)擊swf窗口的放大按鈕來查看效果
8.????接下來我們深入研究一下beginBitmapFill()其它的幾個(gè)參數(shù).假設(shè)我們希望我們平鋪完的效果始終是光滑的.那么我們就設(shè)定smoothing始終為true; 我們來看Matrix和repeat兩個(gè)參數(shù).選中第一幀,打開actionscript面板.我們做如下的簡(jiǎn)單的修改.
[1b]代碼:[/1b]?
function tilebg(){
var tile:BitmapData = BitmapData.loadBitmap("pattern1");
var matrix = new flash.geom.Matrix();
????repeat = false;
????smoothing = true;
this.beginBitmapFill(tile,matrix,repeat,smoothing);
this.lineTo(Stage.width, 0);
this.lineTo(Stage.width, Stage.height);
this.lineTo(0, Stage.height);
this.lineTo(0, 0);
this.endFill();
}
?
我們只需要在tilebg()函數(shù)中做一點(diǎn)修改, 分別定義了matrix, repeat,和smoothing三個(gè)參數(shù),還有一處不要忘記了,this.beginBitmapFill(tile,matrix,repeat,smoothing)把其它三個(gè)參數(shù)加入進(jìn)去.默認(rèn)狀態(tài)下repeat為true;現(xiàn)在我們改成false.測(cè)試我們可以觀看到這樣的效果.
??


看上去也是不錯(cuò)的效果. 當(dāng)然此時(shí)它仍會(huì)隨屏幕的大小發(fā)生變,接下來我們看Matirx,flash8中Matrix變換矩陣相對(duì)比較復(fù)雜.但flash8提供了幾種關(guān)于matrix的簡(jiǎn)單方法,比如旋轉(zhuǎn),縮放,位移等,這里我們示范一下旋轉(zhuǎn).
9.????再次修改上面的tilebg()函數(shù).加入matrix變換.如下:
[1b]代碼:[/1b]?
function tilebg(){
var tile:BitmapData = BitmapData.loadBitmap("pattern1");
????var matrix = new flash.geom.Matrix();
????matrix.rotate(Math.PI/4);
????repeat = false;
????smoothing = true;
this.beginBitmapFill(tile,matrix,repeat,smoothing);
this.lineTo(Stage.width, 0);
this.lineTo(Stage.width, Stage.height);
this.lineTo(0, Stage.height);
this.lineTo(0, 0);
this.endFill();
}
?
我們?cè)谄渲屑尤肓艘恍衜atrix.rotate(Math.PI/4)即轉(zhuǎn)動(dòng)45度.
測(cè)試效果如下所示:
[1b]演示文件[/1b]
如果你對(duì)matrix的其它方法感興趣,你可以繼續(xù)試試看.可以根據(jù)你的需要求來進(jìn)行定制.ok.
本文轉(zhuǎn)自：http://www.5uflash.com/flashjiaocheng/Flashaschengxu/95.html

Flash8平鋪網(wǎng)頁背景圖文教程