顯示物件 DisplayObject

2021-09-02 04:33:18 字數 3306 閱讀 7251

顯示物件 displayobject

displayobject類是所有顯示物件的父類,該類歸納總結了一些顯示物件共有的特性,這些共有的特性被整理成為一些列的屬性與方法。

1,顯示物件的基本概念

(1)屬性

上面四幅圖中中展示了顯示物件中比較基礎也是很常用的可視屬性,下面列表是顯示物件的全部可視屬性。

alpha:透明度

width:寬度 height:高度

x:x軸座標值 y:y軸座標值

rotation:旋轉角度

scalex:橫向縮放

scaley:縱向縮放

skewx:橫向斜切

skewy:縱向斜切

visible:是否可見

此外,還有錨點的位置屬性

anchorx 物件沿x方向的對齊

anchory 物件沿y方向的對齊

取值範圍是0.0-1.0.其中0.0表示從物件的最左對齊,0.5表示從物件的中間對齊,1.0表示從物件的最右對齊

例如:var textcontainer:egret.sprite = new egret.sprite();

textcontainer.anchorx = textcontainer.anchory = 0.5;

一篇文章:

(2)方法

2,egret中的顯示物件類displayobject擁有四個派生類,分別為:bitmap、shape、textfield、textinput 這四個派生類實現了不同的功能

bitmap進行位圖顯示和操作,可以在位圖紋理部分查閱相關技術細節。

shape是可以進行向量圖繪製的顯示物件,可以在適量繪圖部分查閱相關技術細節。

textfield 和 textinput都屬於文字操作,可以在文字部分查閱相關技術細節。

3,遮罩是遊戲中非常常用的一種視覺處理手段。例如,遊戲中滾動的玩家列表就使用了遮罩這一技術。所謂遮罩就是指定乙個顯示物件哪些部分可以顯示,哪些部分不可以顯示。

egret啟用遮罩功能非常的簡單,在displayobject中,我們暴露了乙個名稱為 mask 的屬性,該屬性就是用來指定遮罩部分的。

下面乙個示例中繪製了兩個shape物件,我們對其中乙個shape使用遮罩,另外乙個shape當做參考。

//繪製了乙個向量圖,矩形,( 0,0,100,100)

11 var shp:egret.shape = new egret.shape();

12 shp.graphics.beginfill( 0xff0000 );

13 shp.graphics.drawrect( 0,0,100,100);

14 shp.graphics.endfill();

15 this.addchild( shp );

//給改矩形新增了乙個遮罩,遮罩也是乙個物件

1 var rect:egret.rectangle = new egret.rectangle(20,20,30,50);//api中的矩形類,直接初始化

2 shp.mask = rect;

4,碰撞檢測在遊戲中是非常重要的功能,例如我們製作一款***遊戲,當子彈與飛機發生碰撞的時候我們可以認為遊戲結束。此時碰撞的過程需要進行碰撞檢測操作。

在egret中,我們提供了碰撞檢測的功能,同時該功能提供兩種不同的碰撞檢測方式。

第一種檢測方法:檢測圖與點是否碰撞

shp.hittestpoint( 10, 10 );

25 //定義乙個變數infotext,用來顯示文字資訊

26 private infotext:egret.textfield;

27 private drawtext()

28 第二種檢測方法:但如果我們想更加精確的檢測影象是否與乙個點發生了碰撞,我們需要將第三個引數設定為 true。

shp.hittestpoint( 10, 10 );

1 var shp:egret.shape = new egret.shape();

2 shp.graphics.beginfill( 0xff0000 );

3 shp.graphics.drawrect( 0,0,100,100);

4 shp.graphics.endfill();

5 shp.width = 100;

6 shp.height = 100;

7 this.addchild( shp );

8 9 var i****:boolean = shp.hittestpoint( 10, 10, true );

10 this.infotext.text = "碰撞結果" + i****;

我們稍微修改一下**,將原來寬高為100的正方形修改為乙個半徑為20的圓形。**如下:

1 var shp:egret.shape = new egret.shape();

2 shp.graphics.beginfill( 0xff0000 );

3 shp.graphics.drawcircle( 0, 0, 20);//注意座標,可見區域只有四分之一圓

4 shp.graphics.endfill();

5 shp.width = 100; //有什麼用呢

6 shp.height = 100;//有什麼用呢

7 this.addchild( shp );

8 9 var i****:boolean = shp.hittestpoint( 25, 25, true );

10 this.infotext.text = "碰撞結果" + i****;

5,建立自己的顯示物件類

自定義顯示物件類需要繼承自displayobject的具體子類,例如shape或者textfield。

下面我們來建立乙個自己的顯示物件。我們把這個顯示物件稱之為 mygrid 。

建立乙個名稱為 mygrid 的類,並且繼承自 shape 。具體**如下:

1 class mygrid extends egret.shape

2 8

9 private drawgrid()

10 19 }

在 mygrid 我們繪製了乙個紅藍相間的2*2格仔,然後我們建立乙個新的文件類,名稱為 gridmain ,在文件類中建立並顯示我們的 mygrid,具體**如下:

1 class gridmain extends egret.displayobjectcontainer

2 8

9 private onaddtostage(event:egret.event)

10 14 }

編寫儲存後,在 egretproperties.json 檔案中將文件類改為 gridmain,編譯並測試,你會在瀏覽器中看到如下圖效果。

[img]

快取顯示物件

隨著flash包含內容元素的增多,整個程式會變得越來越龐大。這時候,對flash效能的優化,將會是必須要考慮的乙個內容。下面,我為大家講解下在as3.0裡,如何應用快取技術快取顯示物件,從而獲得效能上的提公升。首先,我們先了解下,flash的重新整理機制是怎樣的。flash是乙個逐幀演示的動畫,在顯...

通過物件顯示message text

在t code se91中建立的message class,實際是儲存在表t100中的。我們如果想通過呼叫物件的方法,來顯示乙個message class中,某個message number的text。可以讓這個物件所對應的類實現if t100 message這個介面。並在類的構造方法中,呼叫重寫後...

Egret物件的顯示

前面我們已經整理了egret 結構,接下來我們就一起學習一下在egret中如何把物件展示在場景中。要在場景中展示物件元素,離不開座標資訊。所以第一部分我們首先需要掌握座標系的概念。一般來說,在遊戲中分為世界座標系和相對座標系。所謂世界座標系,就是我們在新增乙個元素到場景中時,這個元素相對stage的...