[Resolvido] Rotação de imagem AS3 3D no flash CS5

Com o Flash CS5 podemos criar efeitos 3D que incluem a rotação de imagens no eixo z com propriedades do eixo z no movieclip. Este tutorial precisa do Flash player 10. Com o uso do AS3, a rotação de imagens 3D é mais suave e perfeita do que a animada.

O que você precisa para completar esse tutorial:

• Dificuldade: Intermediária
• Plataforma: Flash (Flash Player 10)

Baixar arquivos fonte

Rotação 3D simples:
Nesta simples rotação 3D iremos girar o movieclip no seu eixo Y usando a propriedade ?rotationY?.

Rotação no espaço 3D sem interação do usuário

Siga os passos abaixo para criar o mesmo efeito:

• Crie um novo arquivo Flash e crie uma forma retangular;
• Converta o retângulo para movieclip e dê o nome ?planeMc? à instância.

Adicione o código a seguir no primeiro quadro:

import flash.events.Event;
 

 var angle:Number = 0

 var speed:Number = 5

 

 stage.addEventListener(Event.ENTER_FRAME, start3DRotate)

 

 function start3DRotate(e:Event):void

 {

 

 angle<360? angle+=speed : angle = 0;

 planeMc.rotationY = angle;

 

 }

Estamos apenas incrementando o valor do ângulo e aplicando o valor à propriedade ?rotationY?.

Rotação 3D de imagens interativas
Aqui a imagem é girada em um espaço 3D usando a interação do usuário, com a ajuda do botão esquerdo e direito.

Rotação da imagem através da interação do usuário. Use o botão esquerdo e direito.

Código completo para a rotação da imagem 3D:

 import flash.events.Event;
 import fl.transitions.Tween;

 import fl.transitions.easing.*;

 import fl.transitions.TweenEvent;

 

 var newY:Number;

 

 right_btn.buttonMode = left_btn.buttonMode = true;

 

 right_btn.addEventListener(MouseEvent.CLICK,rotateRight);

 left_btn.addEventListener(MouseEvent.CLICK,rotateLeft);

 

 function rotateRight(e:Event):void{

 newY = planeMc.rotationY;

 var myTween:Tween = new Tween(planeMc, "rotationY", Strong.easeOut, newY, newY+180, 1, true);

 }

 

 function rotateLeft(e:Event):void{

 newY = planeMc.rotationY;

 var myTween:Tween = new Tween(planeMc, "rotationY", Strong.easeOut, newY, newY-180, 1, true);

 }

A imagem é girada no espaço 3D usando a classe embutida Tween. A direção depende do uso dos botões esquerdo e direito.

Organizando a imagem em um espaço 3D
Organizar programaticamente e manipular os movieclips em um espaço 3D é mais fácil com o Flash player 10 e o flash cs5.

Ajuste o slider para mover a imagem em seu eixo Z.

Código completo para organizar um movieclip contendo uma imagem em espaço 3D:**

    import fl.events.SliderEvent;
    import flash.display.MovieClip;

     

    var _newIcon:FlashIcon;

    var Xinit:Number = 50;

    var Yinit:Number = 100;

    var spacing:Number = 100;

    var itemCount:Number = 10;

     

    for(var i:int=0;i<itemCount;i++)

    {

        _newIcon = new FlashIcon();

        _newIcon.y = Yinit

        _newIcon.x = Xinit

        _newIcon.z = (i*spacing)

        addChildAt(_newIcon,0)

    }

    _sliderX.addEventListener(SliderEvent.CHANGE, announceChange);

     

    function announceChange(e:SliderEvent):void

    {

     

        for(var count:int=0;count<itemCount;count++)

        {

            var item:MovieClip = getChildAt((itemCount-1)-count) as MovieClip

            item.z = count * (e.target.value)/2

        }

     

    }

A função do slider é ajudar o valor do eixo Z das imagens no espaço 3D.

Baixar arquivos fonte

*****

Texto original disponível em: http://www.designscripting.com/2011/05/as3-3d-image-rotation-in-flash-cs5/

http://imasters.com.br/artigo/23223/flash/rotacao-de-imagem-as3-3d-no-flash-cs5