建立和移動 3D 顯示物件
Flash Player 10 以及更新的版本,Adobe AIR 1.5 以及更新的版本
若要將 2D 顯示物件轉換成 3D 顯示物件,您可以明確將物件的
z
屬性設定為數值。當您為
z
屬性指定值時,便會為顯示物件建立新的 Transform 物件。設定
DisplayObject.rotationX
或
DisplayObject.rotationY
屬性也同樣能建立新的 Transform 物件。Transform 物件包含
Matrix3D
屬性,可控制顯示物件在 3D 空間中的呈現方式。
下列程式碼會為名為「leaf」的顯示物件設定座標:
leaf.x = 100; leaf.y = 50; leaf.z = -30;
您可以在「leaf」之 Transform 物件的
matrix3D
屬性中,看到這些值以及所衍生的屬性:
var leafMatrix:Matrix3D = leaf.transform.matrix3D;
trace(leafMatrix.position.x);
trace(leafMatrix.position.y);
trace(leafMatrix.position.z);
trace(leafMatrix.position.length);
trace(leafMatrix.position.lengthSquared);
如需 Transform 物件的屬性相關資訊,請參閱
Transform
類別。如需 Matrix3D 物件的屬性相關資訊,請參閱
Matrix3D
類別。
在 3D 空間中移動物件
您可以變更物件的
x、y 或 z
屬性值,在 3D 空間中移動物件。當您變更
z
屬性的值時,檢視者會覺得物件看起來靠近或遠離自己。
在下列程式碼中,會變更兩個橢圓的
z
屬性來回應事件,以便沿著其 z 軸前後移動。
ellipse2
的移動速度比
ellipse1
快,因為其
z
屬性針對每個 Frame 事件是以 20 為倍數增加,而
ellipse1
的
z
屬性則是以 10 為倍數增加:
var depth:int = 1000;
function ellipse1FrameHandler(e:Event):void
{
ellipse1Back = setDepth(e, ellipse1Back);
e.currentTarget.z += ellipse1Back * 10;
}
function ellipse2FrameHandler(e:Event):void
{
ellipse2Back = setDepth(e, ellipse1Back);
e.currentTarget.z += ellipse1Back * 20;
}
function setDepth(e:Event, d:int):int
{
if(e.currentTarget.z > depth)
{
e.currentTarget.z = depth;
d = -1;
}
else if (e.currentTarget.z < 0)
{
e.currentTarget.z = 0;
d = 1;
}
}
在 3D 空間中旋轉物件
您可以根據物件的下列旋轉屬性設定,以三種方式旋轉物件:
rotationX
、
rotationY
和
rotationZ
。
下圖顯示未旋轉的兩個正方形:
下圖顯示當您遞增正方形之容器的
rotationY
屬性,讓它們在 y 軸上旋轉時的模樣。旋轉兩個正方形的容器 (或父輩顯示物件) 時,兩個正方形本身也會旋轉:
container.rotationY += 10;
下圖顯示當您設定正方形之容器的
rotationX
屬性時,正方形的模樣。這麼做會讓它們在 x 軸上旋轉。
下圖顯示當您遞增正方形之容器的
rotationZ
屬性時,正方形的模樣。這麼做會讓它們在 z 軸上旋轉。
一個顯示物件可以同時在 3D 空間中移動和旋轉。
|
|
|