PAPERVISION Menu Over

clique na imagem para poder visualizar

Olá Pessoal, Para nosso tutorial de hoje, preparei exemplo muito simples, utilização do mouse ma interação de um objeto primitivo do papervision, assim poderemos possamos montar um menu num futuro.

Ao se trabalhar com Orientação a Objetos devemos sempre estar atendendo a instância do objeto, ao utilizar o papervision, para alterar algumas propriedades de um simples material instanciado para um plane devemos alterar o movieclip no qual o nosso material recebe de instancia.

movie = new MovieClip();
material = new MovieMaterial(movie,true,true);

Seguindo a lógica, o nosso material armazena a instancia de “movie” ou seja, se alterarmos o alpha ou o posicionamento do frame de nosso movie o nosso material sofrerá a mesma alteração.

Em nosso exemplo teremos um movieclip aonde a propriedade linkage dele será “MovieButton”.

Iniciaremos nosso plane com as rotações em 25 e alpha 0.8, e em nosso enterframe colocaremos o nosso plane para ficar rotacionando para exemplificar melhor que aquele plane é um objeto do papervision. Ao passar o mouse em nosso plane, alteraremos o alpha para 1, reposicionaremos as rotações em 0 e bloquearemos o enterframe. Vamos para o código completo.

package
{
    import flash.display.MovieClip;
    import flash.events.Event;
    import org.papervision3d.materials.MovieMaterial;
    import org.papervision3d.objects.primitives.Plane;
    import org.papervision3d.events.InteractiveScene3DEvent;
    import org.papervision3d.view.BasicView;

    public class Menu extends BasicView
    {
        private var mov1:MovieClip;
        private var mat1:MovieMaterial;
        private var plane1:Plane;
        private var MOVE:Boolean = true;

        public function Menu()
        {
            viewport.buttonMode = true;
            viewport.interactive = true;

            camera.zoom = 5;
            camera.focus = 200;

            mov1 = new MovieButton();
            mat1 = new MovieMaterial(mov1, true, true)

            mat1.interactive = true;
            mat1.smooth = true;
            mat1.doubleSided = true;

            plane1 = new Plane(mat1, 130, 100)
            scene.addChild(plane1);
            plane1.rotationY = 25;
            plane1.rotationZ = 25;
            plane1.rotationX = 25;

            plane1.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, _mouseOver);
            plane1.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, _mouseOut);
            startRendering();
            mov1.alpha = 0.8;
            addEventListener(Event.ENTER_FRAME, _loop);

        }
        public function _loop(e:Event) {
            if (MOVE){
                plane1.yaw(3);
                plane1.roll(3);
                plane1.pitch(3);
            }
        }
        public function _mouseOver(e:InteractiveScene3DEvent):void
        {
            MOVE = false;
            mov1.alpha = 1;
            e.target.rotationY = 0;
            e.target.rotationZ = 0;
            e.target.rotationX = 0;

        }
        public function _mouseOut(e:InteractiveScene3DEvent):void
        {
            MOVE = true;
            mov1.alpha = 0.8;
        }

    }

}

Para dar um toque interessante ao seu menu aconselho a usar transições de tweeners, caurina, green sock ou ate mesmo o tweener do flash. Agora que eu já lhe mostrei a escada só falta vocês subirem ^^ até aproxima.

Tags: InteractiveScene3DEvent, menu, moviematerial, papervision, pv3d, Tutorial