Seguimos con el tutorial que iniciamos en este post.
     En esta parte, se asume un conocimiento básico del lenguaje ActionScript 3. De todas formas, si el lector no lo tiene, se intentará dar una breve explicación de cada paso.

     Habrá que importar varias clases, pero la mayoría de los IDES te permiten hacerlo automáticamente.

     Lo primero que vamos a hacer es cambiar el archivo del que heredará nuestra clase. Papervision3D incluye la clase BasicView, que contiene la configuración básica que una aplicación típica Papervision3D suele necesitar, así que vamos a hacer uso de ella y nos ahorraremos trabajo. Sustituimos Sprite por BasicView, lo cual requerirá que importemos esta clase al principio del archivo. Nuestra clase queda como en la captura siguiente:



    Muy típico de cualquier entorno de desarrollo, pero por si alguien no lo conoce:
    Como en todos los IDES basados en Eclipse, como es Flash Builder 4, para despreocuparse de las importaciones de las clases que usemos y no tener que estar escribiendo la linea import lo-que-sea cada vez que vayamos a usar una clase nueva, suele ser conveniente acostumbrarse a usar Ctr+barra espaciadora según estamos escribiendo el nombre de la clase. Una ayuda contextual nos dejará elegir la clase que estamos buscando, y al clickar sobre ella (o ponerse sobre ella usando las flechas del teclado y pulsar intro), nos añadirá automáticamente la importación.
     Usualmente, también suele funcionar botón derecho del ratón -> Source -> Organize Imports (ó directamente Ctrl+Mayúsculas+O), pero, al menos en mi versión de Flash Builder,esto no parece funcionar como se espera.



     Vamos a echar un vistazo a la clase BasicView (¡sin modificarla!), y de paso nos hacemos una idea de cómo funciona Papervision3D. Para esto, podemos buscarla en el paquete org.papervision3d.view.BasicView, o pulsar la tecla Control y clickar sobre el nombre de la clase, lo cual debería abrirnosla.

     Lo primero que observamos es que BasicView hereda de AbstractView (que a su vez hereda de Sprite, lo cual es necesario para crear un swf en el que se vea algo), y además implementa la interfaz IView. No nos vamos a meter en esto ahora, simplemente decir que son clases necesarias que contienen métodos que posibilitan la creación de una simulación de un espacio 3D en Flash. Lo que más nos interesa es el constructor (public function BasicView) y los objetos que instancia.

     Inicicialmente, vamos a necesitar los siguientes objetos, que se instancian todos en el constructor de la clase BasicView (y como nuestra clase hereda de ella, ya los tenemos):

     - Un escenario (de tipo Scene3D): será nuestro espacio 3D, que contendrá todos los objetos (3D o no) que usemos en nuestra aplicación.
     - Una cámara (usualmente de tipo Camera3D): podemos entenderla como una cámara real, define el punto de vista (así como zoom, etc.) desde el que vemos nuestra escena.
     - Un viewport (de tipo Viewport3D): sin entrar en muchos detalles, podríamos entenderlo como "lo que la cámara ve". Pensemos en el viewport como la lente de la cámara. Lo que cae fuera del viewport, no se ve.
     - Un render engine o motor de render (de tipo BasicRenderEngine): nuestro motor 3D, realiza todos los cálculos necesarios y se los pasa al viewport. Cade vez que "algo" cambia en la escena (un objeto se mueve, un material se modifica, etc.), el motor de render tiene que recalcularlo todo para volver a mostrarlo, por lo tanto habrá que "decirle" que esté continuamente haciendo dichos cálculos. Después veremos esto más claro.

     La clase AbstractView, superclase de BasicView, se usa como una clase pretendidamente abstracta, cuyos métodos implementan una configuración básica para el render y el viewport. Digo "pretendidamente" porque en ActionScript el modificador abstract no existe, a diferencia de otros lenguajes orientados a objetos, pero el concepto es el mismo: implementar una funcionalidad básica de la que hereden sus subclases. En esta clase tenemos un método que reescribiremos en nuestra aplicacion: onRenderTick. A este método se le llama a través de un evento Event.ENTER_FRAME, lo que quiere decir que se estará ejecutando continuamente mientras nuestra película esté abierta. Todo lo que queramos que el motor de render recalcule una y otra vez lo pondremos en este método, luego lo veremos.

    Con estos elementos, en principio, tenemos lo suficiente para una animación Papervision3D básica. Cerramos la clase BasicView (y AbstractView si también la abrimos) y volvemos a nuestra clase TutoPV3D0.

     Para establecer unas dimensiones y color de fondo de nuestra película flash, podemos usar una etiqueta de metadatos, poniéndola justo antes de la definición de la clase. Aquí indicaremos el ancho, el alto y el color de fondo: [SWF(width="800", height="600", backgroundColor="#FFFFFF")]

     Vamos a añadir un par de métodos, tras el constructor (cuidado con las aperturas y cierres de llaves):

     - El método init, que devuelve void (es decir, nada), lo usaremos para inicializar los objetos, y algunas de sus propiedades, que usaremos.

     private function init():void{

     }

     - El método onRenderTick será el que reescribiremos (override). Como ya dijimos, este método se ejecuta cada vez que la película flash pasa por un fotograma, es decir, siempre. Si una película flash tiene un sólo fotograma, o le bien le hemos indicado que se quede parada en un fotograma concreto, el flash player hace que ese fotograma se esté reproduciendo continuamente.

     override protected function onRenderTick(e:Event=null):void{
          super.onRenderTick();
     }

     Volvemos al constructor y añadimos las siguientes lineas:

     stage.frameRate=42;
     init();
     startRendering();

     Con la primera, hacemos que la animación vaya a 42 fotogramas por segundo (por defecto, creo recordar que son 12 fps en Flash y 24 fps en Flex o Flash Builder), para que el movimiento sea fluido y evitar que la película vaya a trompicones.
     A continuación llamamos al método init, donde definiremos algunos objetos y nuestras "condiciones de inicio", y por último a startRendering. En AbstractView, este método añade un ENTER_FRAME eventListener (onRenderTick), lo que hará que la escena se re-renderize cada vez que se dispare es evento, es decir, cada vez que entre en un fotograma, en nuestro caso 42 veces por segundo. Como también queremos que el onRenderTick original también se ejecute, lo llamamos mediante  super.onRenderTick();

   ¿Hasta aquí bien? Bueno, tenemos hasta ahora lo siguiente en nuestra clase TutoPV3D0:


     Vamos a ejecutar la aplicación pulsando Ctrl+F11, o clickando en el icono de Run (circulo verde con triángulo blanco), y se nos abrirá el archivo TutoPV3D01.html (que está en la carpeta bin-debug) en el navegador predeterminado en nuestro sistema, mostrando una hermosa pantalla en blanco.

     ¡Ooooh! Qué bonito, el flash con fondo blanco (a no ser que hayáis cambiado el color de fondo) incrustado en el html también con fondo blanco.

     Llegados a este punto, seguramente sea conveniente incluir algún objeto 3D en la escena, así que vamos a crear una esfera.

     Definimos una variable en la clase y no dentro de ningún método para poder acceder a ella, debajo de la linea public class etc.

     var esfera:Sphere;

     En el método init, la instanciamos. El constructor de Sphere admite varios parámetros, pero de momento no le pondremos ninguno e inicializará la esfera con las propiedades por defecto (entre otras cosas, con un material de tipo WireFrame).

     esfera=new Sphere();

     Y justo a continuación la añadimos a la escena:

     scene.addChild(esfera);

     Y por último, en el método onRenderTick, hacemos que la esfera gire un grado sobre su eje Y cada vez que se ejecute dicho método, y justo antes de la llamada a super.onRenderTick(), modificando algunas de sus propiedades, como su posición o la rotación sobre su uno de sus propios ejes. Recordemos que estamos en un espacio 3D, por lo tanto todos los objetos, así como el mismo escenario, tienen unas coordenadas cartesianas, con ejes X, Y y Z.

     esfera.rotationY++;

     Y ya que estamos, hagamos que se vaya desplazando hacia la derecha:

     esfera.x++;

     Ahora deberíamos tener lo siguiente:


     Aunque no es necesario, para una fácil visibilidad del código, si en algún momento la indentación de llaves y demás se nos ha ido de las manos, podemos usar Ctrl+A para seleccionar todo, y después Ctrl+I para indentar correctamente.

     Bien, volvemos a ejecutar pulsando F11, y ahora podremos ver una esfera rotando y desplazándose por la pantalla. No es muy impresionante, ya, pero vale como primera toma de contacto con Papervision3D.



     En el próximo post de esta serie, añadiremos materiales a la esfera, y algunas otras cosas para que quede más aparente, y de paso explicaremos algunos otros conceptos.