lunes, 4 de enero de 2010

Introducción a Papervision 3D

Papervision 3D, es un gran ambiente para desarrollar escenas en 3D para flash, pero tanto codigo extraño para alguien que apenas esta empezando puede ser un poco dificil, asi que prepare esta guía para todos los que quieran empezar a crear Flash en 3D =).

Primero que nada tienen que bajarse las classes de Papervision 3D, las cuales pueden encontrar en su pagina:

http://blog.papervision3d.org/

En la parte donde estan las descargar (Downloads), pueden seleccionar bajarlo desde SubVersion, o en un zip o swc, si apenas estas empezando, te suguiero simplemente bajar el zip, luego en otro tutorial explicare lo de SubVersion.

Ya que tengan el zip, descomprimanlo en donde tienen sus otras classes (classpath), ó sino saben esto, simplemente guardenlo en el mismo folder donde estaran los archivos con los que vamos a trabajar

Con todo esto listo ahora ya podemos empezar a crear el codigo =),

Primero, creen un nuevo archivo llamado "HolaMundo3D".

package {
public class HolaMundo3D {
public function HolaMundo3D() {
}
}
}

Ok, ya tenemos la clase, pero falta agregarle la parte de Papervision 3D, esto se hace diciendole a la clase que extienda la clase BasicView de Papervision 3D. BasicView contiene todo lo que necesitamos, ya tiene una Camara, un viewport, un renderer y una escena, asi que al extender esta clase nos quitamos muchas lineas de codigo de encima. Primero que nada hay que importarla:

import org.papervision3d.view.BasicView;

y ahora si aplicarla a nuestra clase:

package {
import org.papervision3d.view.BasicView;
public class Hello3DWorld extends BasicView {
public function Hello3DWorld() {
}
}
}

ok, we already have almost everything, but right now if you run the code, you wont see anything,
cause we haven't added anything, so lets add a simple object, for example a cube.

First import the Cube class:

import org.papervision3d.objects.primitives.Cube;

and then we create a private variable named "cube":

Ok, ya tenemos lo necesario, pero si corres el archivo no podras ver nada, eso es porque faltan dos cosas muy importantes, llamar a la funcion startRendering() para que rendere la escena, y algo que ver, como un cubo por ejemplo. Para ello importamos la clase para crear el cubo, creamos la variable, y agregamos el cubo a la escena.

package {
import org.papervision3d.objects.primitives.Cube;
import org.papervision3d.view.BasicView;
public class Hello3DWorld extends BasicView {
private var cubo:Cube;
public function Hello3DWorld() {
cubo=new Cube ;
scene.addChild(cubo);
startRendering();
}
}
}

Sin embargo para poder ver bien el cubo tenemos que darle materiales, los cuales se guardan en una variable MaterialsList y se pasan al cubo como parametro, esta ves le daremos un color negro (0x000000), sin embargo le podemos poner cualquier tipo de material:

package {
import org.papervision3d.materials.ColorMaterial;
import org.papervision3d.materials.utils.MaterialsList;
import org.papervision3d.objects.primitives.Cube;
import org.papervision3d.view.BasicView;
public class Hello3DWorld extends BasicView {
private var cubo:Cube;
private var lista:MaterialsList;
private var color:ColorMaterial;
public function Hello3DWorld() {
color=new ColorMaterial(0x000000);
lista=new MaterialsList ;
lista.addMaterial(color,"all");
cube=new Cube(lista);
scene.addChild(cube);
startRendering();
}
}
}

En este punto ya podremos ver el cubo, pero todo estará estático, para poder ver bien el poder 3d que tiene papervision podríamos rotar el cubo, sin embargo esto lo explicare en el otro tutorial, por ahora les adelantare el resultado =)



Aqui les dejo el codigo y el swf por si lo quieren descargar =): HolaMundo3D.rar

2 comentarios:

  1. me encanta la manera llana de tus explicaciones, espero ver mas tutoriales del tema

    ResponderBorrar
  2. Vean mi pagina esta hecha en papervision3D.

    www.incubus-soft.com

    ResponderBorrar