Olá Pessoal,

Sou Márcio Silva, e neste tutorial mostrarei os primeiros passos para que você possa começar a desenvolver seus aplicativos, jogos e animações utilizando o Papervision3D Engine.

Pré-requisitos: Conhecimento em Action Script 3.0. Conhecimento em Adobe Flash CS4.

O que é Papervision 3D?

Papervision 3D (P3D) é uma Engine Open Source para criação de Cenas 3D no Adobe Flash. Com esta engine podemos manipular de uma forma simplificada elementos 3D, escondendo detalhes de baixo nível. Esta engine não realiza cálculos físicos, como por exemplo gravidade, atrito, colisão elástica e inelástica, entre outros. Para isto é necessário a utilização de outras engines destinadas apenas a realizar cálculos físicos, isto será tema de outros tutoriais.

Como começar?

Como escrevi nos pré-requisitos, é indispensável o conhecimento de básico ao intermediário no Action Script 3.0. A API do P3D é totalmente orientada a objetos e possui uma documentação de código muito boa. Neste tutorial, utilizo como ferramenta o Adobe Flash CS4 para programar e rodar a aplicação.

Passo 1 – Primeiramente você deve baixar o P3D que está hospedado no Google Code: http://code.google.com/p/papervision3d/.

Passo 2 – Crie um pasta com o nome de sua escolha e descompacte o conteúdo do arquivo .ZIP .

Passo 3 - Abra o Adobe Flash CS4, e crie um novo arquivo .FLA do tipo AS3 com o nome PlaneP3D.fla. Coloque as seguintes configurações:

Passo 4 – Para que o Adobe Flash encontre as definições de classe do Papervision 3D é necessário configurar o Library Path. Vá em Edit->Preferencces->Action Script, clique em ActionScript 3.0 Settings. Informe o diretório onde você descompactou o Papervision 3D. No meu caso ficou como mostrado abaixo:

Passo 5 – Crie um Action Script File (.AS) com o nome de PlaneP3D.as.

Passo 6 – No arquivo PlaneP3D.as coloque o seguinte código.

package
{
	import flash.display.Sprite;
	import flash.events.Event;
	import org.papervision3d.cameras.Camera3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.objects.primitives.Plane;

	public class Plane extends Sprite
	{
		public var viewport:Viewport3D = new Viewport3D();
		public var scene:Scene3D = new Scene3D();
		public var camera:Camera3D = new Camera3D();
		public var renderer:BasicRenderEngine = new BasicRenderEngine();
		public var plane:Plane = new Plane();

		public function Plane()
		{
			addChild(viewport);
			scene.addChild(plane);
			renderer.renderScene(scene, camera, viewport);
			addListeners ();
		}

		private function addListeners ()
		{
			addEventListener(Event.ENTER_FRAME, render);
		}

		private function render (e:Event)
		{
			plane.x +=3;
			renderer.renderScene(scene, camera, viewport);
		}
	}
}

Alguns comentários sobre o código

O que é Viewport3D?

Para explicar o que é a Viewport3D, só fazer uma analogia à tela de cinema, onde é projetado o filme para que seja possível assistí-lo. Portanto, é uma região retangular onde é projetado a Cena 3D.

O que é uma Camera3D?

A Camera utilizada aqui é a mesma que você já conhece do cinema, ela grava o que acontece no mundo e projeta na tela (View Port).

O que é Scene3D?

A Cena 3D é basicamente o mundo que se deseja ver.

O que é BasicRenderEngine?

Fazendo novamente analogia ao cinema,  o Basic Render Engine é o Diretor, ele grita “Ação” e tudo acontece: A Camera começa a filmar, projetando a Cena na View Port. Por isso nada acontece se ele não “ordenar” através do método renderScene ().

O Construtor da classe Plane dá o pontapé inicial adicionando a View Port ao stage, pois o restante dos objetos serão renderizados dentro dela. Todos os objetos pertencentes à Cena, neste caso o Plano, devem ser adicionados ao objeto scene. Como nesta cena o plano será deslocado para a direita à cada ENTER_FRAME, um listener foi adicionado.

Pronto, se você não pressionou CTRL + ENTER para ver o que acontece, pressione agora e veja o resultado.

Veja o resultado final aqui PlaneP3D.

Baixe os arquivos deste tutorial: http://blog.creativerender.com/wp-content/uploads/2010/03/papervision_beginner.zip

Até a Próxima.

Márcio Silva