Materiales interactivos en Papervision GreatWhite, parte II

Materiales interactivos en Papervision GreatWhite, parte II

Etiquetas: Viewport3D BasicRenderEngine interactive animated MovieAssetMaterial

Imagen en reemplazo de flash

En Papervision greatWhite podemos añadir eventos a los elementos 3D .

Otra opción es crear los elementos 3D a partir de MovieClips interactivos que tienen asociados eventos. Por ejemplo, tenemos un MovieClip con tres botones dentro, y creamos una esfera con ese MovieClip como material. Para que se respeten los eventos de ese clip al convertirlo en material3D, debemos configurar los siguientes parámetros:

-al crear la instancia de Viewport3D debemos especificar que es interactivo:

  1.  
  2. //los parametros son: (ancho,alto,autoEscalar,interactivo) 
  3. viewport = new Viewport3D(400,400,false,true);
  4.  

-al crear el material debemos especificar que es interactivo y animado:

  1. //los parametros son: (ID de linkage,transparente,animado)
  2. var material:MovieAssetMaterial = new MovieAssetMaterial("MenuPPV",true,true);
  3. material.interactive = true;

Tras el salto, el código completo y la demo.


  1. //CODIGO DEL MAIN
  2. package{
  3.  
  4. 	import flash.display.*
  5.  
  6. 	public class Main extends MovieClip{
  7.  
  8. 		import flash.events.Event;
  9. 		import flash.text.*;
  10.  
  11. 		import org.papervision3d.view.Viewport3D;
  12.     	import org.papervision3d.cameras.Camera3D;
  13. 		import org.papervision3d.scenes.Scene3D;
  14. 		import org.papervision3d.render.BasicRenderEngine;
  15. 		import org.papervision3d.materials.*;
  16. 		import org.papervision3d.objects.primitives.*;
  17. 		import org.papervision3d.events.InteractiveScene3DEvent;
  18.  
  19. 		var escena:Scene3D;
  20. 		var renderer:BasicRenderEngine;
  21. 		var camara:Camera3D;
  22. 		var viewport:Viewport3D;
  23.  
  24. 		var esfera:Sphere;
  25.  
  26. 		public function Main(){
  27. 			crear3D();
  28. 			crearObjeto();
  29. 		}
  30.  
  31. 		public function crear3D():void{
  32. 			escena = new Scene3D();
  33. 			renderer = new BasicRenderEngine();
  34. 			camara = new Camera3D();
  35. 			viewport = new Viewport3D(400,400,false,true);
  36. 			addChild(viewport);
  37. 			camara.z = -300;
  38. 			addEventListener(Event.ENTER_FRAME, renderizar);
  39. 		}
  40.  
  41. 		public function crearObjeto():void{
  42. 			var material:MovieAssetMaterial = new MovieAssetMaterial("MenuPPV",true,true);
  43. 			material.interactive = true;
  44. 			material.oneSide = false;
  45. 			esfera = new Sphere(material, 100,20,20);
  46. 			escena.addChild(esfera);
  47. 		}
  48.  
  49. 		private function renderizar(e:Event):void{
  50. 			esfera.yaw(1);
  51. 			esfera.pitch(1);
  52. 			renderer.renderScene(escena, camara, viewport);
  53. 		}
  54.  
  55. 	}
  56. }
  57.  
  58. //CÓDIGO DEL MENÚ
  59.  
  60. package{
  61.  
  62. 	import flash.display.*
  63.  
  64. 	public class MenuPPV extends MovieClip{
  65.  
  66. 		import flash.events.*;
  67.  
  68. 		public function MenuPPV(){
  69. 			programar();
  70. 		}
  71.  
  72. 		private function programar(){
  73. 			addEventListener(MouseEvent.MOUSE_OVER,over);
  74. 			addEventListener(MouseEvent.MOUSE_OUT,out);
  75. 		}
  76.  
  77. 		private function over(e:MouseEvent):void{
  78. 			e.target.alpha = .3;
  79. 		}
  80.  
  81. 		private function out(e:MouseEvent):void{
  82. 			e.target.alpha = 1;
  83. 		}
  84.  
  85. 	}
  86. }

Descargar archivos

Comentarios
    • Autor
    • bishoport
    Hola, soy un asiduo a tu blog, ya que estoy aprendiendo papervision y es de lo mejor qu ehe encontrado, de veras muchas gracias por tu aporte. Respecto a este ejemplo, tengo el problema de que no se como configuras el MovieClip en flash, porque el compilador me dice que No se encontró el tipo o no es una constante en tiempo de compilacion: MenuPPV. Me podrias echar una mano con eso ? gracias.
    • Autor
    • esedeerre

    Gracias

    El material tiene que estar vinculado a la clase MenuPPV en la biblioteca.

    • Autor
    • alex
    que version del PPV usa el ejemplo?
    • Autor
    • esedeerre
    Utiliza la versión 2.0. La greatWhite (versión "estable").
    • Autor
    • alex
    POR QUE ME SALE ESTE ERROR: 1061: Llamada a un método drawFace3D posiblemente no definido mediante una referencia con tipo estático org.papervision3d.core.proto:MaterialObject3D.
    • Autor
    • Hugo
    Hola, lo primero darte las gracias por compartir tantos conocimientos de as3, son muy útiles :) Tengo un problema relacionado con la carga de MovieClips y su interactividad. Mi método de trabajo con flash es trabajar en cs3 los gráficos y animaciones simples, creando una clase para cada uno y luego el swc generado lo embebo o precargo desde una clase principal para trabajar y compilar con eclipse + flex3 sdk. De este swf embebido saco cada objeto "pintado" por su mainClass ej. var mnuClasificacion:Class = event.target.content.loaderInfo.applicationDomain.getDefinition("mnuClasificacion") as Class; De esta forma defino una clase con la animación del item dibulado y animado en flash. Mi problema es que no se vincular esa clase al material MovieAssetMaterial. en teoria deberia ser: var materialMnuClasificacion:MovieAssetMaterial = new MovieAssetMaterial("mnuClasificacion",true,true); Pero no funciona, me da runtime error de variable no definida. Se te ocurre por qué puede ser? Muchas gracias!
    • Autor
    • viktor
    Hola, primero te quiero agradecer por tu web q me ha ayudado en para desarrollar un proyecto q tengo con el Instituto de Investigaciones Esteticas UNAM. Mi problema es q, siguiendo tu ejemplo, no puedo hacer q los botones tenga el estado rollOver y presionado q les asigno desde flsh. lo unico q hace es el cambio en alfa.
    • Autor
    • esedeerre

    Hola viktor, la solución podria ser hacer que los botones sean movieClips con 3 fotogramas. Cada fotograma representaria un estado del botón. En el over le pones un e.target.gotoAndStop(2) (suponiendo que en el fotograma 2 esté la gráfica del over). Y asi sucesivamente.

    Espero haberme explicado, de todas formas este fin de semana si tengo tiempo hago un tutorial sobre las "trampas" de los materiales interactivos.

    • Autor
    • viktor
    Muchas gracias! mas o menos por ahi andaba pero los frames los ponia en el moviclip principal. Prometo ponerte en los agradecimientos cuando termine mi proyecto. chido y sigue dandole al peiper!!
    • Autor
    • eliphas
    Me salen 200 mil warnings y dos errores de tipo 1000: referencia ambigua a Vertex3D. ¿A qué puede deberse? TEngo bien cargadas las clases de todas las versiones. Grascias de antemano.
    • Autor
    • eliphas
    Perdón, solucionado. Estaba cargándolo de la carpeta branches.
    • Autor
    • gonzalo
    Hola, muchas gracias por tus ejemplos lo primero. NO consigo mostar el cursor de la mano sobre los botones de la bola, ni sobre los clips que los contienen, ni con usehandcursor, ni con buttonmode ni con mouse children, es imposible???, ¿puedes intentarlo? gracias.
    • Autor
    • Diana
    Hola Esedeerre, muchas gracias por compartir tu experiencia. muy buenos tutoriales. Quiero preguntarte si es posible lograr un movimiento como este (http://www.dehash.com/?page_id=192)pero vinculado con un movieclip interactivo que tenga animaciónes y eventos con botones? no con una imagen. Cómo se haría? Te agradezco mucho.
    • Autor
    • Diana
    Hola Esedeerre, muchas gracias por compartir tu experiencia. muy buenos tutoriales. Quiero preguntarte si es posible lograr un movimiento como este (http://www.dehash.com/?page_id=192)pero vinculado con un movieclip interactivo que tenga animaciónes y eventos con botones? no con una imagen. Cómo se haría? Te agradezco mucho.
    • Autor
    • eleuterio
    Gracias por tu blog, realmente me ha servido mucho para entender y poder trabajar con PPV, sobre todo los ejemplos que dejas para descargar.
    • Autor
    • La_Miaus
    Estoy aprendiendo...quería saber si se puede colocar un evento en cada boton que haga referencia a algo que está en el escenario, y si es posible, cómo sería la forma. Gracias.
Dejar un comentario
Tu nombre (obligatorio):

E-mail (obligatorio, no se mostrará):

Web:

Comentario: