Tworzenie i przemieszczanie obiektów ekranowych 3D

Flash Player 10 i nowsze wersje, Adobe AIR 1.5 i nowsze wersje

Aby przekształcić obiekt wyświetlany 2D w obiekt wyświetlany 3D, można jawnie przypisać jego właściwości z wartość liczbową. Po przypisaniu wartości właściwości z dla obiektu wyświetlanego tworzony jest nowy obiekt Transform. Przypisanie wartości właściwościom DisplayObject.rotationX lub DisplayObject.rotationY również tworzy nowy obiekt Transform. Obiekt Transform zawiera właściwość Matrix3D , która steruje reprezentacją obiektu wyświetlanego w przestrzeni trójwymiarowej.

Poniższy kod ustawia współrzędne obiektu wyświetlanego o nazwie „leaf”: 

leaf.x = 100; leaf.y = 50; leaf.z = -30;

Wartości te, jak również właściwości uzyskane na ich podstawie, są widoczne we właściwości matrix3D obiektu Transform obiektu leaf: 

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);

Informacje o właściwościach obiektu Transform zawiera opis klasy Transform . Informacje o właściwościach obiektu Matrix3D zawiera opis klasy Matrix3D .

Przemieszczanie obiektu w przestrzeni 3D.

Możliwe jest przemieszczanie obiektu w przestrzeni 3D poprzez modyfikowanie wartości jego właściwości x, y lub z . Gdy zmienimy wartość właściwości z obiektu, obiekt pozornie przybliża się lub oddala od obserwatora.

Poniższy kod przemieszcza dwie elipsy w tę i z powrotem wzdłuż osi z, zmieniając wartości ich właściwości z w odpowiedzi na zdarzenie. Obiekt ellipse2 porusza się szybciej niż obiekt ellipse1 : jego właściwość z jest zwiększana o wielokrotność 20 po każdym zdarzeniu Frame, natomiast właściwość z obiektu ellipse1 jest zwiększana o wielokrotność 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; 
    } 
}

Obracanie obiektu w przestrzeni 3D.

Obiekt można obracać na trzy różne sposoby, odpowiednio ustawiając jego właściwości obrotu: rotationX , rotationY i rotationZ .

Na poniższej ilustracji przedstawiono dwa kwadraty, które nie są obrócone:

Na następnej ilustracji przedstawiono te same dwa kwadraty po inkrementacji właściwości rotationY kontenera zawierającego kwadraty w celu obrócenia ich wokół osi y. Obrócenie kontenera kwadratów, czyli ich nadrzędnego obiektu wyświetlanego, powoduje obrócenie obu kwadratów: 

container.rotationY += 10;

Na następnej ilustracji przedstawiono skutek przypisania wartości właściwości rotationX kontenera kwadratów. Kwadraty są obracane wokół osi x.

Na następnej ilustracji pokazano, co się stanie po inkrementacji właściwości rotationZ kontenera zawierającego kwadraty. Kwadraty zostaną obrócone wokół osi z.

Obiekt wyświetlany może być jednocześnie przemieszczany i obracany w przestrzeni trójwymiarowej.