第7章AS3.0顯示編程

1、AS3.0顯示編程ActionScript 3.0的顯示功能有了很大的革新，原有的顯示結(jié)構(gòu)發(fā)生了重大的改變。對(duì)于熟悉了ActionScript以前版本中MovieClip影片剪輯控制和使用的AS程序人員來(lái)說(shuō)，這次革新將導(dǎo)致一個(gè)新的學(xué)習(xí)過(guò)程。ActionScript 3.0顯示編程的內(nèi)容主要是關(guān)于如何使用ActionScript來(lái)生成和控制各種圖形、動(dòng)畫等顯示對(duì)象。顯示對(duì)象通常指的是顯示在Flash Player舞臺(tái)上的可視化的對(duì)象。1顯示對(duì)象簡(jiǎn)介顯示對(duì)象（Display Object），指的是可以在舞臺(tái)顯示的一切對(duì)象，包括可以直接看得見(jiàn)的圖形、動(dòng)畫、視頻、文字等，也包括一些看不見(jiàn)的顯示對(duì)象容器

2、。在ActionScript 3.0中，任何的復(fù)雜的圖形都是由顯示對(duì)象和顯示對(duì)象的容器共同構(gòu)成。1）AS3.0中顯示對(duì)象的等級(jí)結(jié)構(gòu)編譯完成的SWF文件，以最根部的stage（舞臺(tái)）為基礎(chǔ)，展現(xiàn)出不同的顯示效果。利用ActionScript 3.0構(gòu)建的Flash播放文件都有都有一個(gè)由顯示對(duì)象構(gòu)成的層次結(jié)構(gòu)，這個(gè)結(jié)構(gòu)稱為“顯示列表”。這個(gè)顯示列表按照一定的等級(jí)和層次在舞臺(tái)上顯示出來(lái)，構(gòu)成復(fù)雜的顯示對(duì)象。ActionScript 3.0 支持的顯示對(duì)象的結(jié)構(gòu)類似于“樹(shù)狀結(jié)構(gòu)”，以舞臺(tái)為根，SWF文件為干，顯示對(duì)象為枝葉。具體結(jié)構(gòu)見(jiàn)圖所示。2）顯示對(duì)象的種類在ActionScript3.0中，所有的

3、顯示對(duì)象都屬于同一個(gè)類：DisplayObject類。所有的顯示對(duì)象都是其子類。本節(jié)將對(duì)顯示對(duì)象的種類進(jìn)行簡(jiǎn)單的介紹，并且進(jìn)行簡(jiǎn)要的分類。1顯示對(duì)象的具體種類2顯示對(duì)象分類3）顯示列表在前文中已經(jīng)說(shuō)到，ActionScript 3.0支持的顯示對(duì)象的結(jié)構(gòu)類似于“樹(shù)狀結(jié)構(gòu)”，這上面的所有的顯示對(duì)象和容器，就構(gòu)成了顯示列表。顯示列表是ActionScript 3.0中的一個(gè)新概念。顯示列表就是一個(gè)顯示對(duì)象的清單，只要在Flash Player中顯示出來(lái)的對(duì)象，都是該顯示列表中的內(nèi)容。在ActionScript 3.0中，顯示對(duì)象能否顯示出來(lái)，取決于是否加入了顯示列表。如果加入了顯示列表，該對(duì)象就會(huì)

4、被顯示出來(lái)；否則，即使該對(duì)象已經(jīng)被創(chuàng)建，也不能被顯示出來(lái)。ActionScript3.0顯示列表進(jìn)行了以下方面的改進(jìn)，具有明顯的優(yōu)點(diǎn)。1呈現(xiàn)方式更為有效且文件較小，有效的提高了性能。2改進(jìn)的深度管理，使層級(jí)管理更加容易3完整遍歷顯示列表，使對(duì)象的訪問(wèn)更方便4列表外的顯示對(duì)象，方便了顯示對(duì)象的管理5更便于創(chuàng)建顯示對(duì)象的子類，創(chuàng)建可視化對(duì)象更容易2顯示對(duì)象的一些基本概念在舞臺(tái)上看到的顯示對(duì)象，都有它們各自的屬性，如位置、大小、透明度等等。這些屬性都來(lái)自于顯示對(duì)象的基類DisplayObject，該類總結(jié)了大部分顯示對(duì)象的共有的特征和行為。特征對(duì)應(yīng)于顯示對(duì)象的屬性，行為對(duì)應(yīng)于顯示對(duì)象的方法。在Act

5、ionScript 3.0中，DisplayObject類共有25個(gè)屬性，6個(gè)方法和6個(gè)事件。下面將簡(jiǎn)單介紹一些常用的屬性和方法，對(duì)于復(fù)雜的應(yīng)用，將在后面的章節(jié)結(jié)合具體的實(shí)例講解。1）顯示對(duì)象的常見(jiàn)屬性顯示對(duì)象的屬性共有25個(gè)，本節(jié)將介紹常用的一些基本屬性。（1）橫坐標(biāo)x：顯示對(duì)象注冊(cè)點(diǎn)距離自己父級(jí)容器注冊(cè)點(diǎn)之間的水平距離，以象素為單位。如果父容器是舞臺(tái)，那么就是自身注冊(cè)點(diǎn)與舞臺(tái)原點(diǎn)間的水平距離。（2）縱坐標(biāo)y：顯示對(duì)象注冊(cè)點(diǎn)與父級(jí)容器注冊(cè)點(diǎn)之間的豎直距離，以象素為單位。若父容器為根對(duì)象root，則為自身注冊(cè)點(diǎn)與舞臺(tái)原點(diǎn)之間的豎直距離。（3）寬度width：顯示對(duì)象最左邊到最右邊之間的距離，以

6、象素為單位。（4）高度height：顯示對(duì)象最上邊到最下邊之間的距離，以象素為單位。（5）橫向縮放比例scaleX：一個(gè)比例值，01之間的數(shù)字?？刂骑@示對(duì)象的橫向縮放比例。（6）縱向縮放比例scaleY：一個(gè)比例值，01之間的數(shù)字?？刂骑@示對(duì)象的縱向縮放比例。（7）鼠標(biāo)橫向橫坐標(biāo)mouseX：鼠標(biāo)相對(duì)于當(dāng)前顯示對(duì)象注冊(cè)點(diǎn)之間的水平距離。（8）鼠標(biāo)橫向縱坐標(biāo)mouseY：鼠標(biāo)相對(duì)于當(dāng)前顯示對(duì)象注冊(cè)點(diǎn)之間的豎直距離。（9）順時(shí)針旋轉(zhuǎn)角度rotation：顯示對(duì)象繞軸點(diǎn)順時(shí)針旋轉(zhuǎn)的角度。0180度表示順時(shí)針旋轉(zhuǎn)角度，0-180度表示逆時(shí)針旋轉(zhuǎn)角度。如果超過(guò)了這個(gè)范圍，則自動(dòng)減去360的整數(shù)倍。（10

7、）透明度alpha：01之間的值，0表示完全透明，1表示完全不透明。（11）可見(jiàn)性visible：Boolean值，用于控制顯示對(duì)象是否可見(jiàn)。true表示將對(duì)象顯示，false表示不顯示對(duì)象。但不管設(shè)置成何值，該顯示對(duì)象始終位于顯示對(duì)象列表中。（12）遮照mask：持有的引用是用來(lái)遮照的顯示對(duì)象。（13）顯示對(duì)象名字name：通常生產(chǎn)顯示對(duì)象時(shí)，會(huì)分配默認(rèn)的名字。若有需要，可以使用代碼進(jìn)行修改。（14）父容器parent：在顯示列表中每個(gè)顯示對(duì)象都有其父容器。parent屬性指向顯示對(duì)象的父容器，若顯示對(duì)象不在父容器，則該屬性為null。（15）根對(duì)象root：返回SWF文件主類的實(shí)例。若顯示

8、對(duì)象不在父容器，則該屬性為null。（16）舞臺(tái)stage：該屬性持有的引用指向該顯示對(duì)象所在的舞臺(tái)。每個(gè)Flash程序，都有一個(gè)舞臺(tái)。除了以上的16個(gè)屬性之外，DisplayObject對(duì)象還有9個(gè)屬性，分別為：loaderInfo、cacheASBitmap、filters、scale9Grid、blendMode、accessibilityProperties、opaqueBackground、scrollRect和transform。這些屬性在后面的章節(jié)中根據(jù)需要進(jìn)行講解。2）顯示對(duì)象的方法顯示對(duì)象的基本方法有6個(gè)，常用的方法如下：（1）getBounds()方法：返回一個(gè)矩形區(qū)域，該

9、矩形定義相對(duì)于顯示對(duì)象所在坐標(biāo)系的顯示對(duì)象區(qū)域。（2）getRect()方法：返回一個(gè)矩形區(qū)域，該矩形定義相對(duì)于顯示對(duì)象所在坐標(biāo)系的顯示對(duì)象區(qū)域，注意該區(qū)域不包含形狀上的筆觸寬度。（3）hitTestObject()方法：返回一個(gè)Boolean值，若為true，表示兩個(gè)對(duì)象重疊或相交，否則為不相交。（4）hitTestPoint()方法：返回一個(gè)Boolean值，若為true，表示該對(duì)象對(duì)應(yīng)點(diǎn)重疊或相交，否則為不相交。3）顯示對(duì)象的事件顯示對(duì)象的事件有6個(gè)，常見(jiàn)的如下：（1）added事件：將顯示對(duì)象添加到顯示列表中時(shí)會(huì)調(diào)度該時(shí)間。下面的兩種方法會(huì)觸發(fā)此事件：將顯示對(duì)象添加到容器、將顯示對(duì)象添

10、加到容器的某一層次。（2）addedToStage事件：將顯示對(duì)象直接添加到舞臺(tái)顯示列表或?qū)@示對(duì)象的子對(duì)象添加至舞臺(tái)顯示列表中時(shí)會(huì)調(diào)度該事件。下面的兩種情況下會(huì)觸發(fā)此事件：將顯示對(duì)象添加到容器、將顯示對(duì)象添加到容器的某一層次。（3）removed事件：要從顯示列表中刪除顯示對(duì)象時(shí)會(huì)調(diào)度該事件。以下兩種情況下會(huì)生成此事件：將顯示對(duì)象容器的某個(gè)顯示對(duì)象刪除、將顯示對(duì)象容器中的某個(gè)層次的顯示對(duì)象刪除。（4）removedFromStage事件：要從顯示列表中刪除顯示對(duì)象或者刪除包含顯示對(duì)象的子對(duì)象時(shí)會(huì)調(diào)度該事件。以下兩種情況下會(huì)生成此事件：將顯示對(duì)象容器的某個(gè)顯示對(duì)象刪除、將顯示對(duì)象容器中的某

11、個(gè)層次的顯示對(duì)象刪除。（5）enterFrame事件：播放頭進(jìn)入新幀時(shí)調(diào)度該事件。若播放頭不移動(dòng)，或者只有一幀，則會(huì)繼續(xù)以幀頻調(diào)度此事件。（6）render事件：在顯示器述評(píng)之前調(diào)度該事件。當(dāng)使用render事件的顯示對(duì)象進(jìn)入舞臺(tái)時(shí)，或者顯示對(duì)象存在于顯示列表時(shí)才會(huì)觸發(fā)該事件。要保證render事件在當(dāng)前幀觸發(fā)，必須調(diào)用stage.invalidate()。3管理顯示對(duì)象顯示對(duì)象只有顯示在屏幕之上，才能達(dá)到要實(shí)現(xiàn)的效果。顯示對(duì)象容器就是用來(lái)儲(chǔ)存和顯示顯示對(duì)象的對(duì)象。要實(shí)現(xiàn)在顯示對(duì)象容器中顯示對(duì)象，就需要把顯示對(duì)象加入到顯示對(duì)象列表中。本節(jié)主要介紹如何添加和刪除顯示對(duì)象，如何通過(guò)深度管理對(duì)象以及

12、如何訪問(wèn)顯示對(duì)象。1）容器的概念所有的顯示對(duì)象都要放入顯示對(duì)象容器中才能夠顯示，為了方便區(qū)分，把顯示對(duì)象容器簡(jiǎn)稱為容器。容器是可以嵌套的，容器中可以放置非容器顯示對(duì)象，也可以放置子容器對(duì)象。容器的主要功能有一下幾點(diǎn)：提供訪問(wèn)、添加、刪除顯示對(duì)象的功能。具有深度管理功能。其中深度管理也就是管理容器中子對(duì)象的疊放次序。所謂的疊放次序，表示顯示對(duì)象重疊時(shí)從前到后的顯示順序。處于顯示順序最前面的完整顯示，后面的對(duì)象依次被前面的對(duì)象遮擋，甚至有的不能顯示出來(lái)。2）添加顯示對(duì)象在ActionScript 3.0中，要把一個(gè)對(duì)象顯示在屏幕中，需要作兩步工作，一是創(chuàng)建顯示對(duì)象，二是把顯示對(duì)象添加到容器的顯示列

13、表中。加入顯示列表的方法有addChild()和addChildAt()。要在ActionScript 3.0中創(chuàng)建一個(gè)顯示對(duì)象，只需使用new關(guān)鍵字加類的構(gòu)造函數(shù)即可。只要是繼承自DisplayObject類或者其子類的的實(shí)例都可以添加到顯示對(duì)象列表中，比如Sprite，MovieClip，TextField，或自定義類。用下列代碼創(chuàng)建TextField（文本框）的代碼如下所示。var mytext:TextField =newTextField( );上面已經(jīng)使用代碼建立了一個(gè)文本框?qū)嵗?，但是它并沒(méi)有位于顯示列表中，也就是說(shuō)它現(xiàn)在還沒(méi)有顯示在屏幕上。要把這個(gè)文本框顯示在屏幕中，必須使用容器

14、類的addChild()或者addChildAt()方法加入到顯示列表中。1將顯示對(duì)象直接添加到顯示列表中2將顯示對(duì)象添加到指定位置3）刪除顯示對(duì)象要移除位于顯示對(duì)象列表中的顯示對(duì)象，需要使用容器類的removeChild()和removeChildAt()方法。1移除指定名稱的顯示對(duì)象要移除已經(jīng)知道顯示對(duì)象名稱的顯示對(duì)象，可以使用顯示對(duì)象類的removeChild()方法其用法格式如下：容器對(duì)象.removeChild(顯示對(duì)象)2刪除指定索引的顯示對(duì)象要?jiǎng)h除指定位置索引的顯示對(duì)象，可以使用顯示對(duì)象類的removeChildAt()方法。其用法格式如下所示。容器對(duì)象.removeChildA

15、t(位置索引)4）深度管理深度，也就是前文所說(shuō)的位置索引，用于說(shuō)明同一個(gè)容器中同一級(jí)別的所有顯示對(duì)象從前到后的疊放次序。在ActionScript 3.0中，使用了全新的深度管理體系和輕巧的深度管理方法，使我們可以很方便和舒適的添加和訪問(wèn)對(duì)象。此深度管理體系有兩個(gè)重要的特點(diǎn)：深度由各自的容器對(duì)象所管理。每一個(gè)容器都知道自己有多少個(gè)子對(duì)象，這個(gè)數(shù)目記錄在自己容器的numChildren屬性中。每一個(gè)對(duì)象在容器顯示列表中的位置索引代表了其深度值。每一個(gè)容器的深度范圍為0numChildren-1。添加顯示對(duì)象會(huì)自己調(diào)整各個(gè)顯示對(duì)象的深度，避免層次沖突。比如某一個(gè)深度已經(jīng)有了一個(gè)顯示5）訪問(wèn)顯示對(duì)象

16、要訪問(wèn)加入到容器中的顯示對(duì)象，可以通過(guò)3種方法來(lái)實(shí)現(xiàn)：通過(guò)深度訪問(wèn)、通過(guò)名字訪問(wèn)和通過(guò)全局坐標(biāo)訪問(wèn)。1通過(guò)深度訪問(wèn)顯示對(duì)象:通過(guò)深度來(lái)訪問(wèn)顯示對(duì)象，要使用getChildAt()方法。用法格式如下：容器對(duì)象.getChildAt(深度)2通過(guò)名字訪問(wèn)顯示對(duì)象:每一個(gè)顯示對(duì)象都有一個(gè)名稱，該名稱可以使用該顯示對(duì)象的name屬性進(jìn)行訪問(wèn)和設(shè)置。在創(chuàng)建顯示對(duì)象的時(shí)候，可以指定顯示對(duì)象的名字，也可以不指定顯示對(duì)象的名字。若沒(méi)有指定，F(xiàn)lash Player會(huì)自動(dòng)的分配給該顯示對(duì)象一個(gè)默認(rèn)的名字，如：“instance1”“instance2”等。3通過(guò)坐標(biāo)訪問(wèn)顯示對(duì)象:在ActionScript 3.

17、0中，可以通過(guò)坐標(biāo)來(lái)訪問(wèn)置于該坐標(biāo)之上的所有顯示對(duì)象。getObjectsUnderPoint()方法的用法格式如下：容器對(duì)象. getObjectsUnderPoint(點(diǎn)對(duì)象);4處理顯示對(duì)象顯示對(duì)象放在舞臺(tái)之后，可以進(jìn)行大量的操作，比如改變對(duì)象的位置、透明度、顏色，可以使顯示對(duì)象旋轉(zhuǎn)，也可以控制拖動(dòng)顯示對(duì)象。這些都要通過(guò)DisplayObject類及其子類的屬性和方法來(lái)實(shí)現(xiàn)。本節(jié)通過(guò)一些實(shí)例，介紹使用這些屬性和方法控制顯示對(duì)象發(fā)生變化的方法。1）改變對(duì)象的位置要改變一個(gè)顯示對(duì)象的位置，只用調(diào)整顯示對(duì)象的橫坐標(biāo)x和縱坐標(biāo)y這兩個(gè)屬性就可以了。注意x和y屬性始終是指顯示對(duì)象相對(duì)于其父顯示對(duì)象

18、坐標(biāo)軸的（0，0）坐標(biāo)的位置。下面的實(shí)例在舞臺(tái)創(chuàng)建一個(gè)顯示對(duì)象圓和四個(gè)箭頭對(duì)象。通過(guò)點(diǎn)擊四個(gè)箭頭控制圓上下左右移動(dòng)。使用文檔類：SetXY，2）縮放顯示對(duì)象若要縮放顯示對(duì)象，可以采用兩種方法來(lái)縮放顯示對(duì)象的大小：使用尺寸屬性（width和height）或縮放屬性（scaleX和scaleY）。width和height屬性使顯示對(duì)象的寬和高，它們以象素為單位，可以通過(guò)指定新的寬度和高度值來(lái)縮放顯示對(duì)象、scaleX和scaleY屬性是指顯示對(duì)象的顯示比例，是一個(gè)浮點(diǎn)數(shù)字，最小值為0，最大不限，值為1表明和原始大小相同?？s放值大于1表示放大顯示對(duì)象，小于1表示所需顯示對(duì)象。這兩種方法都可以縮放顯示

19、對(duì)象，在使用一種屬性進(jìn)行縮放的時(shí)候，另一種屬性的值也會(huì)對(duì)于發(fā)生變化。比如使用尺寸屬性改變顯示對(duì)象時(shí)，修改width的值為width/2，則該顯示對(duì)象的縮放屬性scaleX將變?yōu)?.5。3）旋轉(zhuǎn)顯示對(duì)象若要旋轉(zhuǎn)顯示對(duì)象，可使用顯示對(duì)象的rotation屬性來(lái)實(shí)現(xiàn)。如果要旋轉(zhuǎn)某一個(gè)顯示對(duì)象，可以將此屬性設(shè)置為一個(gè)數(shù)字（以度為單位），表示要應(yīng)用于該對(duì)象的旋轉(zhuǎn)量。4）淡化顯示對(duì)象Flash之所以“閃”，透明度alpha這個(gè)屬性起到了至關(guān)重要的左右。使用該屬性可以使顯示對(duì)象部分透明或者全部透明，也可以通過(guò)alpha屬性控制顯示對(duì)象的淡入淡出。alpha屬性的值是0到1之間的浮點(diǎn)數(shù)。0表示完全透明，1表示完全不透明。下面的實(shí)例實(shí)現(xiàn)這樣的效果：鼠標(biāo)滑上顯示對(duì)象時(shí)，該顯示對(duì)象透明度變?yōu)樵瓉?lái)的一半；鼠標(biāo)滑出顯示對(duì)象時(shí)，該顯示對(duì)象的透明度變?yōu)橥耆煌该?。使用文檔類：SetAlpha，代碼如下所示。5）拖曳顯示對(duì)象在ActionScript 3.0中，只有Sprite及其子類才具有StartDrag()、StopDrag()方法和dropTarget屬性。也就是說(shuō)，只有Sprite及其子類才可以被拖動(dòng)，執(zhí)行拖曳動(dòng)作。ActionScript3.0中的