Conhecendo o AWAY3D

• Tweet
• Sharebar

• Tweet

Olá pessoal meu nome é Diego Alex, e trabalho como programador web na AQUA Interativa aqui em Patos de Minas-MG.

Bom mas esse artigo não é pra falar sobre mim, e sim sobre o away3D. Uma das coisas que me fizeram migrar do papervision3D para o away3D, foram:

1 – O tempo de render bem menor. (Até o momento);

2 – O menor consumo de memória;

3 – Frequência de atualização da engine, e outras mais.

Bom pra quem ainda não utiliza o away3D, ai vai o link para download:

http://away3d.com/downloads

atualmente estou usando a versão 2.5.2 / 3.6.0

Baixe os arquivos, extraia os mesmos para uma pasta de sua preferência, e depois configure o seu Class Paths.

Eu uso do Flash Builder, mas você pode usar o próprio flash, ou flash develop entre outros aplicativos.

Vou mostrar como configurar o Flash Builder para trabalhar com a Engine.

1 – Com o Flash Builder aberto vá em File >Switch Workspace > Other;

Vai aparecer a seguinte janela:

Aponte para o caminho onde você irá armazenar seus projetos.

O Flash Builder irá fechar e reabrir em instantes carregando as novas configurações de workspace. Como mostra a figura abaixo:

2 – Para facilitar a importação dos arquivos do away3D vou criar um novo projeto em File > New > Flex Library Project

2 – 1 – Dê um nome para o seu projeto e clique em Next:

2 – 2 – Nesta nova janela escolha a pasta onde você salvou os arquivos do away3D clicando em Add Folder…

Vai aparecer a seguinte tela, escolha o caminho como mostra na imagem abaixo e clique em OK:

Clique em Finish, e pronto o nosso projeto esta criado e vai aparecer no Package Explorer como mostra a imagem abaixo:

Agora vamos criar nosso primeiro projeto usando o away3D.

1 – Vá em File > New > ActionScript Project.

2 – Na janela que se abrirá faça como na imagem abaixo e clique em Next:

3 – Na próxima tela clique em Add Project e escolha o nosso projeto criado anteriormente:

Clique em OK e depois em Finish;

O Flash Builder assumira a seguinte aparência:

Vamos fazer mais uma configuração no nosso projeto:

1 – Clique com o botão direito sobre o PrimeiroProjeto no Package Explorer e clique em Properties;

2 – Na nova tela clique em ActionScript Compiler que será a 4ª opção da lista e desmarque a opção Generate HTML wrapper file, como mostra na imagem abaixo:

Depois é só clicar em OK.

Na próxima tela clique em OK novamente:

Bom com isso terminamos a parte de configuração;

Agora vamos criar uma aplicação simples;

Sua class inicialmente estará assim:

package
{
	import flash.display.Sprite;

	public class PrimeiroProjeto extends Sprite
	{
		public function PrimeiroProjeto()
		{

		}
	}
}

Insira as seguintes modificações:

package
{
	// import do away3D
	import away3d.containers.*;
	import away3d.materials.*;
	import away3d.primitives.*;

	import flash.display.Sprite;
	import flash.events.Event;

	[SWF(width="800", height="600")] // configuramos o tamanho do nosso swf gerado
	public class PrimeiroProjeto extends Sprite
	{
		//Variáveis
		protected var _view:View3D;
		protected var _cubo:Cube;

		public function PrimeiroProjeto()
		{
			// criando métodos
			_criandoView();
			_criandoScene();
		}

		protected function _criandoView():void
		{
			_view = new View3D(); // instanciamos a nossa viewport
			addChild(_view); // adicionamos nossa viewport no stage

			// posicionando a view no meio do stage
			_view.x = stage.stageWidth * .5; // calcula a metade da largura
			_view.y = stage.stageHeight * .5; // calcula a metade da altura

			// adicionando evento de render
			addEventListener(Event.ENTER_FRAME, _render);
		}

		protected function _criandoScene():void
		{
			// craindo scene, trident e cubo
			// scece
			var cena:Scene3D = new Scene3D();

			// trident
			var trident:Trident = new Trident(200,true);

			// cubo
			_cubo = new Cube(); // criando a instancia do cubo
			_cubo.material = new WireColorMaterial(0x990000); // adicionado material de cor

			//adicionando objetos na cena
			cena.addChild(trident);
			cena.addChild(_cubo);

			// adicionando nossa cena ao scene do away3D
			_view.scene = cena;
		}

		// Método de render
		protected function _render(e:Event):void
		{
			_view.render(); // método de renderização do away3D
		}
	}
}

Salve o projeto e clique em play para testá-lo;

Aparecerá a seguinte tela:

E ai esta o nosso cubo em 3D;

No próximo artigo veremos como adicionar interação nos objetos.

Até a próxima pessoal.

Escrito por DiegoWebmotion on fevereiro 15, 2011. Arquivado em Flex. Você pode seguir as respostas a esse artigo pelo RSS 2.0. Você pode deixar respostas para esse artigo