Papervision 3D: Primeiros Passos
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.
{
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
Autor: Márcio Silva – Colunista de Flash & ActionSctipt MXSTUDIO.
Site: www.creativerender.com e www.marciosilva.net
Qualquer dúvida envie um e-mail para contato@creativerender.com ou acesse nosso fórum
Escrito por Marcio Silva
on março 15, 2010. Arquivado em Flash.
Você pode seguir as respostas a esse artigo pelo RSS 2.0.
Você pode deixar respostas para esse artigo
Não acontece nada , tem uma caixa que fica andando na tela
Eh exatamente que deve acontecer Rodrigo =). Apenas um retangulo deslocando para a direita. Veja o exemplo em anexo no post. Esse tuto eh bem simples mesmo.
Pingback: Interface & Design – Parte II « Dicas de um Suricato
deu tudo errado desde o primeiro momento quando se cria o fla ele ja fica com um ponto de interrogaçao no pv3d ai eu fiz assim criei um novo fla que e primeira opçao da janela ai eu coloquei o nome da cai class salvei com o nome de cu dai eu criei um arquivo as 3.0 informei o diretorio para meu cs4 coloquei os codigos dentro do as3 mais na hora que compila ja da erro na primeira linha.
Falta fazer um outro tutorial com os segundos passos.
Eu imaginava que ia aparecer um cubo, um paralelepipedo, um cilindro, mas apareceu um quadrado.