GUIA PRTICO PARA INICIANTES MICROSOFT XNA

Por: Fernando Birck ( Fergo )

2
SUMRIO

1. INTRODUO................................................................................................................ 3
2. APLICATIVOS NECESSRIOS.......................................................................................... 4
3. CRIANDO UM PROJETO ................................................................................................ 5
4. PREPARANDO MTODOS.............................................................................................. 7
5. O MUNDO 3D................................................................................................................ 8
6. EFEITOS......................................................................................................................... 9
7. DESENHANDO O PRIMEIRO TRINGULO.................................................................... 11
8. CRIANDO E RENDERIZANDO UM SLIDO TRIDIMENSIONAL ..................................... 15
9. CONFIGURANDO CMERAS........................................................................................ 20
10. MOVENDO OBJETOS................................................................................................. 23
11. CONCLUSO.............................................................................................................. 24

3
1. INTRODUO

Em Novembro de 2006, a Microsoft trouxe ao mundo a sua nova plataforma de
programao grfica, intitulada Microsoft XNA Game Studio. Essa plataforma funciona
como um meio de conexo entre as APIs do DirectX e o programador, possuindo uma
srie de funcionalidades e rotinas previamente compiladas, facilitando ao mximo o
trabalho com efeitos e geometria espacial.

Um exemplo dessa funcionalidade seria a capacidade nativa de carregar modelos, sons
e texturas com apenas uma linha, sem precisar se preocupar em entender e decifrar o
formato dos arquivos, como ocorreria ao se trabalhar diretamente com o DirectX.
Essas caractersticas facilitam bastante a criao de um pequeno jogo, sendo voltadas
mais para os entusiastas e iniciantes nesse ramo e que no esto to preocupados em
deixar o jogo 100% otimizado, mas sim em poder ver rapidamente os resultados de
sua criao.

A linguagem padro escolhida pela Microsoft foi o C# ( C Sharp ), mas como o processo
utiliza o .NET Framework, qualquer linguagem .NET capaz de rodar o XNA, bastando
apenas alterar a sintaxe. Neste tutorial vamos trabalhar com o prprio C#, j que a
linguagem oficial do XNA GS.

Toda a plataforma do XNA distribuda gratuitamente pela Microsoft, sendo
necessrio apenas possuir o C# Express e o XNA Game Studio instalados. Veja no
prximo captulo as ferramentas necessrias.
4
2. APLICATIVOS NECESSRIOS

Microsoft Visual C# 2005 Express Edition
o IDE de programao para o C#.
o http://msdn.microsoft.com/vstudio/express/downloads/


Visual C# 2005 Service Pack 1
o Correes para o C# 2005.
o http://download.microsoft.com/download/7/7/3/7737290f-98e8-45bf-
9075-85cc6ae34bf1/VS80sp1-KB926749-X86-INTL.exe

XNA Game Studio
o Framework de programao grfica.
o http://msdn2.microsoft.com/en-us/xna/aa937795.aspx


SketchUp 6 Trial
o Aplicativo simples de modelagem 3D.
o http://www.sketchup.com/?sid=509

Deep Exploration
o Conversor de modelos e imagens.
o http://superdownloads.uol.com.br/download/64/deep-exploration/

Cdigo fonte, modelos, texturas e efeitos.
o Pacote contendo todos os arquivos usados no guia
o http://fergonez.net/files/xna_arquivos.rar


Os dois ltimos aplicativos (SketchUp e Deep Exploration) no so gratuitos, mas
possuem verses de testes que so suficientes para o nosso tutorial. O SketchUp um
aplicativo de modelagem 3D genial e muito interessante de se trabalhar, pois se
diferencia um pouco dos aplicativos tradicionais. Vamos utiliz-lo para modelar nossos
objetos. O Deep Exploration um timo aplicativo para visualizao e converso de
modelos 3D, com um suporte fantstico a quase todos os formatos existentes. Vamos
converter os modelos gerados pelo SketchUp para o formato do XNA atravs dele.

Com todas as ferramentas em mos, podemos dar inicio a programao da nossa
engine bsica.
5
3. CRIANDO UM PROJETO

Aps ter instalando todos os componentes do captulo anterior, navegue pelo menu
Iniciar at encontrar o aplicativo do XNA Game Studio (normalmente ele se encontra
em Iniciar -> Programas -> Microsoft XNA Game Studio Express -> XNA Game Studio
Express).

Com a IDE carregada, v at o menu File -> New Project. Na janela que aparecer,
selecione o item Windows Game, d um nome para o seu projeto (nesse caso,
utilizei MeuJogo) e confirme a criao do projeto.




Aps confirmar o projeto, o Visual C# cria uma estrutura de arquivos padro para os
jogos que utilizam o XNA. Neste tutorial recomendvel que voc j possua certo
conhecimento de programao e conhea a interface do Visual Studio, pois no
trataremos deste assunto nesse guia.

No lado direito, em Solution Explorer, temos todos os arquivos gerados pelo C#,
sendo que vou frisar alguns deles.

Game.ico cone do seu jogo. Aparecer no topo da
janela e no arquivo executvel
Game1.cs Este arquivo contm o cdigo da classe do
jogo. Trabalharemos sobre ele
Program.cs Arquivo bsico do jogo. o ponto de
partida inicial do programa, que apenas chame a classe
contida no Game1.cs
6
Abra o arquivo Game1.cs ( duplo clique sobre ele ) no editor. Estamos agora na rea
de cdigo principal do projeto. Nela esto as funes bsicas do XNA, sobre as quais
a rotina do jogo acontece.

A classe dividida basicamente em 6 rotinas: Game1(), Initialize(),
LoadGraphicsContent(), UnloadGraphicsContent(), Update() e Draw()

Game1 a rotina bsica da classe do jogo, onde fica boa parte das
declaraes de variveis, tipos e classes.
Initialize Dentro desta rotina ficam todas as operaes de inicializao do
jogo que no necessitam ter a engine grfica rodando. Um exemplo seria a
leitura de registro e arquivos de configurao do jogo.
LoadGraphicsContent Aqui onde todos os itens grficos do jogo so
carregados, como modelos, objetos e texturas.
UnloadGraphicsContent Nesse mtodo onde voc descarrega os objetos.
Essa rotina pouco utilizada, pois os objetos so descarregados
automaticamente quando desnecessrios.
Update Essa rotina fica em uma repetio durante a execuo do jogo, onde
possvel controlar a lgica, verificar o estado do teclado, mover objetos, etc.
Draw Semelhante rotina acima, mas voltada para fazer a apresentao dos
grficos na tela. Tudo o que precisar ser desenhado vai dentro desse mtodo.
Fazendo uma analogia, essa funo mostraria na tela o resultado da rotina
Update.

7
4. PREPARANDO MTODOS

Neste captulo vamos configurar e preparar nossas funes para iniciar a engine
grfica. O cdigo padro gerado pelo XNA j pode ser compilado, mesmo sem termos
programado nada. Ele automaticamente cria a janela, define seu tamanho e uma cor
de fundo (aperte F5 para rodar o projeto e veja).

Ao invs de usar a configurao padro definida pelo XNA, vamos manualmente
configurar algumas caractersticas da janela, alterando o ttulo e o seu tamanho. Para
tal, precisamos de um device, que nos comunica com o vdeo. O prprio XNA j
declara esse device, como pode ser observado no incio da classe Game1:

GraphicsDeviceManager graphics;

Vamos ento determinar um tamanho para a janela, adicionar um ttulo e desabilitar o
modo Tela Cheia. Para isso utilizaremos o nosso device, cujo nome graphics.
Queremos que isso seja feito logo que o jogo seja iniciado, ento os comandos devem
ficar dentro do mtodo Initialize():

protected override void Initialize()
{
graphics.PreferredBackBufferHeight = 480; // 480 de altura
graphics.PreferredBackBufferWidth = 640; // 640 de largura
graphics.IsFullScreen = false; // desabilita o modo tela cheia
graphics.ApplyChanges(); // aplica as mudanas
Window.Title = "Meu jogo"; // define um ttulo janela

base.Initialize();
}

Salve e rode seu projeto (F5). Agora a janela criada possui uma dimenso de 640x480
pixels, como na maioria dos jogos. Voc pode explorar os outros comandos do device
caso queira, mas eu vou parar por aqui para no fugir muito do propsito do guia.



8
5. O MUNDO 3D

Todas as formas apresentadas na tela so compostas por tringulos, ou um conjunto
deles. Seja qual for a forma geomtrica, ela sempre segmentada em diversos
tringulos, tentando gerar o menor nmero possvel dos mesmos. Veja a imagem
abaixo que ilustra um pouco essa segmentao:


Esses tringulos so definidos por vrtices, pontos cartesianos em um espao bi ou
tridimensional e suas componentes X, Y e Z. As regras de geometria analtica que so
vistas na escola tambm podem ser aplicadas para realizar transformaes
(deslocamentos, rotaes, deformaes) atravs de matrizes. Abaixo temos uma
representao de um retngulo no espao tridimensional, com suas coordenadas:


Agora que j temos uma noo de como funciona um mundo tridimensional no XNA,
podemos prosseguir para desenhar nosso primeiro slido na tela.
9
6. EFEITOS

O XNA trabalha de uma forma diferente que o DirectX ou OpenGL na hora de
renderizar os polgonos. Para tudo o que for desenhar, necessrio um Effect, que
determina caractersticas e a tcnica do slido desenhado. Esses efeitos so um pouco
complicados de se trabalhar e fugiria do propsito do guia explicar como compor um
efeito.

No arquivo RAR contendo as fontes utilizadas neste tutorial h um arquivo effects.fx
genrico que pode ser usado em boa parte dos projetos. Coloque este arquivo na
pasta raiz do projeto (na mesma pasta onde ficam os cdigos fonte e os cones).



Com o arquivo copiado, volte para o C# e declare uma varivel para o efeito no incio
da classe do jogo, junto com a declarao do device:

Effect effect;

Esse arquivo de efeito no est compilado. Precisamos compil-lo antes da engine
poder utilizar. Essa compilao feita durante a inicializao do jogo, dentro do
mtodo Initialize():

CompiledEffect compiledEffect =
Effect.CompileEffectFromFile("@/../../../../effects.fx", null, null,
CompilerOptions.None, TargetPlatform.Windows);

effect = new Effect(graphics.GraphicsDevice,
compiledEffect.GetEffectCode(), CompilerOptions.None, null);

Tendo o efeito compilado, precisamos definir a tcnica que ser utilizada para
renderizar. Isso feito dentro do mtodo Draw(). A tcnica pode ser definida logo
aps o comando de limpar a tela e preenche-la com uma cor.

O nome da tcnica utilizada vai depender do efeito. Para o arquivo effects.fx,
usaremos a Pretransformed. Adicione o cdigo abaixo dentro do mdulo Draw()
aps limpar a tela:

effect.CurrentTechnique = effect.Techniques["Pretransformed"];
effect.Begin(); // inicia a tcnica

effect.End(); // finaliza a tcnica
10
Como pode notar, a tcnica possui um comeo e um fim, sendo que voc pode ter
vrias tcnicas dentro de um s Draw(), basta definir blocos diferentes para cada
uma.

Entre os blocos definidos, necessrio preparar o efeito para ser renderizado. Isso
feito atravs de um processo interativo que realiza uma varredura por todos os passos
contidos dentro do efeito. Essa varredura feita atravs de um foreach. Abaixo est
o cdigo completo do mtodo Draw():

protected override void Draw(GameTime gameTime)
{
graphics.GraphicsDevice.Clear(Color.CornflowerBlue);

effect.CurrentTechnique = effect.Techniques["Pretransformed"];
effect.Begin(); // inicia a tcnica

foreach (EffectPass pass in effect.CurrentTechnique.Passes)
{
pass.Begin();

pass.End();
}
effect.End(); // finaliza a tcnica

base.Draw(gameTime);
}
11
7. DESENHANDO O PRIMEIRO TRINGULO

Com o conhecimento visto no captulo anterior, podemos desenhar nosso primeiro
tringulo na tela. Apesar de ser facilmente entendido, devemos ter alguns cuidados. O
maior deles quanto a ordem da disposio dos vrtices. No podemos simplesmente
jogar os vrtices de uma forma aleatria, pois o DirectX e o XNA usam essa ordem para
determinar a normal da face.

A normal de uma face refere-se ao vetor perpendicular ao plano da mesma. Imagine
um quadrado completamente na horizontal. A normal desse quadrado seria um vetor
apontando diretamente para cima, formando um ngulo de 90 graus com o plano
desse quadrado (que nesse caso seria horizontal).


O XNA determina se a face est voltada para o jogador ou no baseado nessa normal,
processo que chamado de Culling. Normalmente tem-se o Culling como sendo
horrio, ou seja, caso os vrtices estejam dispostos no sentido horrio, a normal ser
voltada para a cmera e a face ser visvel ao jogador. Caso os vrtices fiquem
dispostos no anti-horrio, o sentido da normal inverte e a face inverte o seu lado,
ficando invisvel para a cmera. possvel definir as propriedades do Culling,
fazendo-o exibir os dois lados da face, independente da normal. Isso facilita na hora de
criao dos polgonos, mas perde-se muito em desempenho. Por isso vamos manter o
Culling no sentido horrio e apenas tomar cuidado na hora de dispor os vrtices.



12
O primeiro procedimento a ser feito para posicionar os vrtices criar um vetor que
possa guardar as informaes das coordenadas. Como mencionado anteriormente,
existem diversos tipos de vrtices, mas vamos escolher um que alm de guardar a
posio, tambm armazena a sua cor. Esse tipo chamado VertexPositionColor.

Declare o nosso vetor logo no incio da classe do jogo, junto com a declarao do
device (o texto em cinza apenas para situar o local onde foi adicionado o cdigo):

GraphicsDeviceManager graphics; //nosso device criado no incio
ContentManager content; // no utilizamos ainda
Effect effect; // efeito criado no capitulo anterior
VertexPositionColor[] vertices; // nosso vetor de vrtices

Para no sobrecarregar o mtodo Initialize, vamos colocar as informaes dos
vrtices em uma rotina separada e a chamaremos dentro do Initialize. O nome da
rotina fica a sua escolha (eu utilizei CarregarVertices).

private void CarregarVertices()
{
vertices = new VertexPositionColor[3]; // 1

vertices[0].Position = new Vector3(-0.5f, -0.5f, 0f); // 2
vertices[0].Color = Color.Green; // 3
vertices[1].Position = new Vector3(0, 0.5f, 0f);
vertices[1].Color = Color.Red;
vertices[2].Position = new Vector3(0.5f, -0.5f, 0f);
vertices[2].Color = Color.Yellow;
}

Segue abaixo a descrio de cada uma das linhas (enumeradas no comentrio)

1. Essa linha apenas dimensiona o nosso vetor de vrtices para trs, pois
precisamos de trs vrtices para desenhar um tringulo.
2. Determinamos a posio do vrtice 0 atravs da propriedade Position com
um vetor de 3 dimenses ( Vector3 ) e os valores -0.5f, -0.5f, 0 para as
coordenadas X, Y e Z, respectivamente.
3. Definimos a cor do vrtice 0 atravs da propriedade Color.

Experimente imaginar a disposio desses vrtices no espao ou desenhe-os em uma
folha de papel. Fazendo isso voc pode visualizar mais facilmente que os vrtices esto
ordenados no sentido horrio.


13

Com o nosso mtodo pronto, precisamos cham-lo no Initialize(), logo aps as
propriedades do device que definimos no incio do tutorial:

graphics.ApplyChanges(); // aplica as mudanas
Window.Title = "Meu jogo"; // define um ttulo janela
CarregarVertices();
base.Initialize();

At o momento, j temos nossos trs vrtices definidos e carregados, mas ainda no
mandamos a engine apresentar esses vrtices na tela (renderizar). Para isso,
necessrio alterar um pouco o mtodo Draw().

As linhas a seguir se encarregam de renderizar nossos vrtices e devem ser colocadas
entre o pass.Begin() e o pass.End():

graphics.GraphicsDevice.VertexDeclaration = new
VertexDeclaration(graphics.GraphicsDevice,
VertexPositionColor.VertexElements); // 1

graphics.GraphicsDevice.DrawUserPrimitives(PrimitiveType.TriangleList,
vertices, 0, 1); // 2

1. A linha marcada com 1 corresponde a declarao dos elementos dos vrtices
que esto prestes a serem renderizados.
2. Essa a linha que realmente apresenta os vrtices na tela. composta por 4
argumentos:
a. primitiveType Indica que a disposio dos vrtices no vetor. No nosso
caso, indica que os vrtices formam uma lista de tringulos. Como
temos apenas 3 vrtices, temos tambm apenas 1 tringulo
b. vertexData O vetor contendo os vrtices
c. vertexOffset Indica o primeiro vrtice da lista de tringulos. Como
nosso vetor tem 3 vrtices, variando de 0 at 2, o primeiro vrtice a ser
apresentado o vrtice 0.
d. primitiveCount Nmero de tringulos que ele deve desenhar com
base no vetor de vrtices. Como temos apenas 3 vrtices, temos no
mximo 1 tringulo. Caso o nosso vetor possusse 6 vrtices,
poderamos mandar a engine renderizar 2 tringulos.

Com todo esse cdigo criado, podemos finalmente compilar nosso projeto e visualizar
o nosso tringulo colorido na tela.

14


Caso essa imagem no tenha aparecido, verifique se no faltou alguma linha de
cdigo, principalmente no mtodo Draw(), que o responsvel por mostrar os itens
na tela.
15
8. CRIANDO E RENDERIZANDO UM SLIDO TRIDIMENSIONAL

Vamos partir agora para o mundo 3D de verdade, carregando modelos e texturas
criados a parte.

Eu optei por parar de trabalhar no cdigo atual e fazer os prximos captulos em um
novo projeto, para no misturar aquilo que a fizemos at agora com o que est por vir,
que um pouco diferente. Ento nesse momento eu recomendo que voc salve o
projeto atual e crie um completamente novo, repetindo mesmos passos at o captulo
O mundo 3D. Aquilo que vimos em Efeitos e Desenhando seu primeiro tringulo
ns no vamos mais utilizar.

O primeiro procedimento a ser tomado criar um simples modelo que possa ser
exibido na nossa engine. O formato de objeto que vamos utilizar o .X, o padro
utilizado pelo XNA. O aplicativo onde voc vai modelar e texturizar o objeto fica a seu
critrio, desde que seja possvel exportar ou converter para um arquivo .X
posteriormente. Eu particularmente gosto muito do SketchUp, ento vou ensinar
como criar uma simples caixa com uma textura nesse editor.

Abra o SketchUp e com a ferramenta Rectangle desenhe um retngulo horizontal
com as dimenses de 5m x 5m (veja no canto inferior direito).



Agora selecione a ferramenta Push/Pull, clique sobre o retngulo recm criado,
mova o mouse para cima dando volume ao retngulo (transformando-o em um
paraleleppedo). Clique novamente para confirmar.


16
Nosso slido est pronto, precisamos apenas aplicar uma textura para posteriormente
exportar o modelo. Selecione a ferramenta Paint Bucket para trazer a janela de
materiais. Nessa janela h diversos tipos de texturas, escolha aquela que mais agradar
(veja no menu drop-down os diferentes tipos de texturas). Para aplicar, basta
selecionar a textura e clicar diretamente nas faces do objeto.



Com o modelo completamente texturizado, vamos export-lo para o formato 3DS,
que ser posteriormente convertido para .X usando o Deep Exploration.

V at o menu File -> Export -> 3D Model. Na janela de salvar, escolha para exportar
como 3DS e configure a janela Options da maneira mostrada pela figura:



17
Exporte para um local qualquer, pois o local ainda no tem tanta importncia. Aps
exportar o modelo, foram criados dois arquivos. Um deles o objeto em si (3DS) e o
outro a textura.

Pode fechar o SketchUp, no vamos mais us-lo. Abra o Deep Exploration e carregue o
arquivo 3DS recm exportado atravs do menu File -> Open. Aps o objeto ter sido
carregado, v novamente at o menu File -> Save As.... Na janela que se abrir,
escolha para salvar como tipo DirectX Model (*.X) e clique em Salvar. Uma outra
janela contendo as propriedades do objeto a ser exportado vai aparecer. Configure-a
da forma como mostra a figura:



Na aba Animation, desmarque a caixa Export Animation. Clique em OK.
Se tudo ocorreu bem, um arquivo .X foi gerado, junto com um arquivo BMP, que
corresponde a nossa textura convertida. Copie ambos os arquivos para a pasta raiz do
projeto (aquela onde ficam os arquivos de cdigo fonte, efeitos, cones).

Vamos ento voltar ao C#. Na lateral direita, em Solution Explorer, clique com o
boto direito sobre MeuJogo, em seguida Add -> Existing Item. Na janela de abrir,
selecione Content Pipeline Files no campo Files of Type. Navegue at o local onde
est o arquivo .X e clique em Add. Seu arquivo .X aparece no Solution Explorer
junto aos outros itens.


18
Agora que temos o modelo adicionado ao projeto, podemos carregar ele facilmente
pelo XNA. No projeto, declare uma varivel para o modelo no incio da classe (junto a
declarao do device).

GraphicsDeviceManager graphics; //nosso device criado no incio
ContentManager content; // no utilizamos ainda
Model meuModelo; // armazenaremos o modelo aqui

Os modelos so carregados sempre na rotina LoadGraphicsContent(). Carreg-lo
bem fcil, basta apenas uma linha:

protected override void LoadGraphicsContent(bool loadAllContent)
{
if (loadAllContent)
{
meuModelo = content.Load<Model>("meumodelo");
}
}

Como podem notar, bem simples, basta apenas indicar qual o nome do modelo que
deseja abrir (sem a extenso .X). Com o modelo carregado, precisamos apresent-lo
na tela atravs do mtodo Draw()

protected override void Draw(GameTime gameTime)
{
graphics.GraphicsDevice.Clear(Color.CornflowerBlue);

Matrix[] transforms = new Matrix[meuModelo.Bones.Count]; // 1
meuModelo.CopyAbsoluteBoneTransformsTo(transforms); // 1

foreach (ModelMesh mesh in myModel.Meshes) // 2
{
foreach (BasicEffect effect in mesh.Effects) // 3
{
effect.EnableDefaultLighting();

effect.View = Matrix.CreateLookAt(
new Vector3(15,10,0), new Vector3(0,0,0),
Vector3.Up); // 4

effect.Projection =
Matrix.CreatePerspectiveFieldOfView(
MathHelper.ToRadians(45.0f),
graphics.GraphicsDevice.Viewport.Width /
graphics.GraphicsDevice.Viewport.Height,
1.0f,
10000.0f); // 5
}
mesh.Draw();
}
}

1. Cria uma matriz de transformao para o modelo, sobre a qual possvel fazer
diversas operaes algbricas que resultam em uma mudana no estado do
objeto (girar, mover, alterar escala).
19
2. Um loop para varrer todas as mesh contidas dentro do modelo. Na maioria
dos casos os modelos contam com apenas 1 mesh, mas sempre bom preparar
o cdigo para todas as situaes
3. Semelhante ao segundo, mas referente aos efeitos presentes em cada mesh.
Novamente, na maioria dos casos cada mesh possui apenas um efeito.
4. Cria a matriz de visualizao. O primeiro argumento o vetor posio da
cmera, o segundo o vetor alvo da cmera e o ltimo argumento o vetor
que determina o sentido vertical do mundo.
5. Cria a matriz de projeo em si. Nela voc determina o campo de viso, a
proporo (normalmente a mesma da janela), a distncia mnima que uma face
deve estar de voc para que ela seja exibida e a distncia mxima que face
exibida.



Salve o seu projeto e aperte F5 para iniciar a execuo. Aps todas essas linhas de
cdigo, voc deve obter algo semelhante a isso:


20

9. CONFIGURANDO CMERAS

At o momento, tudo o que fizemos foi mostrado estaticamente na tela, sem ter a
possibilidade de movimento de cmeras. Neste captulo vamos aprender a configurar
uma cmera e tambm como trabalhar com Inputs (teclado, mais especificamente).

H muita matemtica envolvida, principalmente trigonometria. Como a documentao
sobre esse assunto facilmente encontrada em livros de matemtica, no vou explicar
os procedimentos exatos que utilizei para fazer a lgica do movimento da cmera.

Uma cmera formada por dois pontos. Um deles a posio do observador (Eye) e
o outro para onde ele est olhando (At). Ambos os pontos so definidos atravs de
um vetor tridimensional (Vector3). Alm desses dois vetores, precisamos armazenar
a angulao vertical e horizontal da cmera atravs de um Vector2.


Declare os trs vetores junto com todas as outras declaraes, no incio da classe:

Model meuModelo; // armazenaremos o modelo aqui
Vector3 Eye = new Vector3(0, 0, 3); // posicao da camera
Vector3 At = new Vector3(0, 0, 2); // alvo da camera
Vector2 Angle = new Vector2(0, 0); // angulo da camera

Como podem notar, eu posicionei o vetor Eye uma unidade atrs do At na direo
Z, sendo que ambos esto sobre os eixos X e Y (pois ambos so 0).



21
Tendo os vetores definidos, precisamos alter-los conforme as teclas pressionadas
pelo jogador. Essa verificao feita dentro do mdulo Update(). Os clculos
envolvidos aqui podem parecer complexos, mas so apenas relaes trigonomtricas,
facilmente encontradas na internet e em livros. Por esse motivo, no vou explicar
passo a passo o que cada linha faz.

KeyboardState teclado = Keyboard.GetState();
if (teclado.IsKeyDown(Keys.Up)) {
if ((Angle.Y + 1) <= 88)
Angle.Y += 1;
}
if (teclado.IsKeyDown(Keys.Down)) {
if ((Angle.Y - 1) >= -88)
Angle.Y -= 1;
}
if (teclado.IsKeyDown(Keys.Right)) {
Angle.X += 1;
if ((Angle.X + 1) == 360)
Angle.X = 0;
}
if (teclado.IsKeyDown(Keys.Left)) {
Angle.X -= 1;
if ((Angle.X - 1) == -1)
Angle.X = 359;
}
if (teclado.IsKeyDown(Keys.W)) {
Eye.X = At.X + (At.X - Eye.X) * (Single)(1.3);
Eye.Z = At.Z + (At.Z - Eye.Z) * (Single)(1.3);
Eye.Y = At.Y + (At.Y - Eye.Y) * (Single)(1.3);
}
if (teclado.IsKeyDown(Keys.S)) {
Eye.X = At.X - (At.X - Eye.X) * (Single)(2);
Eye.Z = At.Z - (At.Z - Eye.Z) * (Single)(2);
Eye.Y = At.Y - (At.Y - Eye.Y) * (Single)(2);
}
if (teclado.IsKeyDown(Keys.D)) {
Eye.X = Eye.X + (Single)(Math.Cos(((Double)(Angle.X) + 90) *
Math.PI / 180)) * (Single)1.3;
Eye.Z = Eye.Z + (Single)(Math.Sin(((Double)(Angle.X) + 90) *
Math.PI / 180)) * (Single)1.3;
}
if (teclado.IsKeyDown(Keys.A)) {
Eye.X = Eye.X + (Single)(Math.Cos(((Double)(Angle.X) - 90) *
Math.PI / 180)) * (Single)1.3;
Eye.Z = Eye.Z + (Single)(Math.Sin(((Double)(Angle.X) - 90) *
Math.PI / 180)) * (Single)1.3;
}

At.X = Eye.X + (Single)(Math.Cos((Double)(Angle.X) * Math.PI / 180) *
Math.Cos((Double)(Angle.Y) * Math.PI / 180));
At.Z = Eye.Z + (Single)(Math.Sin((Double)(Angle.X) * Math.PI / 180) *
Math.Cos((Double)(Angle.Y) * Math.PI / 180));
At.Y = Eye.Y + (Single)(Math.Sin((Double)(Angle.Y) * Math.PI / 180));
22
Para fazer a cmera funcionar basta alterar os dois primeiros argumentos da matriz de
visualizao dentro da rotina Draw() para os vetores Eye e At, pois agora os
vetores no possuem valores fixos e a matriz precisa ser atualizada cada vez que a
cmera muda de posio.

Troque a linha:

effect.View = Matrix.CreateLookAt(new Vector3(15,10,0),
new Vector3(0,0,0), Vector3.Up);

Por:

effect.View = Matrix.CreateLookAt(Eye, At, Vector3.Up);

Pronto, agora temos a nossa cmera funcionando. Rode o jogo e use as teclas WASD
em conjunto com as setas para se movimentar no local.



23
10. MOVENDO OBJETOS

Neste ltimo captulo vamos ver como se move um modelo pelo espao. O processo
bem semelhante ao movimento da cmera. Se voc no encontrou dificuldades no
captulo anterior, este ser bem tranqilo.

A lgica bsica incrementar as componentes da posio do objeto e aplicar uma
matriz de transformao que move o modelo.

Inicialmente, vamos criar um novo Vector3 (novamente, l no topo da classe) para
guardar a posio do objeto, que se encontra inicialmente na origem do sistema:

Vector3 At = new Vector3(0, 0, 2); // alvo da camera
Vector2 Angle = new Vector2(0, 0); // angulo da camera
Vector3 Posicao = new Vector3(0, 0, 0); //posicao do objeto

Em seguida, vamos incrementar o valor de suas coordenadas conforme o tempo passa.
A melhor forma de fazer isso incrementando dentro da rotina Update() (coloquei
logo aps o trmino da verificao do teclado):

At.Y = Eye.Y + (Single)(Math.Sin((Double)(Angle.Y) * Math.PI / 180));

Posicao.X += 0.03f;
Posicao.Y += 0.03f;
Posicao.Z += 0.03f;

base.Update(gameTime);

Falta somente criar a matriz de transformao, que ir mover o slido com base nas
informaes do vetor Posio. A matriz fica dentro do mtodo Draw(), junto com
as outras matrizes de visualizao e projeo.

effect.World = transforms[mesh.ParentBone.Index] *
Matrix.CreateRotationY((float)Math.PI / 2f) *
Matrix.CreateTranslation(Posicao);

Como pode notar, alm de transladar o objeto, possvel tambm fazer ele girar em
torno do eixo Y (ou qualquer outro, basta definir). Como ns no estamos
incrementando nenhum ngulo, a rotao vai ser nula (pode-se at remover a rotao
da transformao).

Feito isso, basta rodar o aplicativo e ver o movimento.
24
11. CONCLUSO

Vamos ficando por aqui, espero que tenham gostado. Tentei deixar o tutorial simples e
com o maior nmero de ilustraes possvel, j que algo que exige muita
representao visual. Evitei colocar informaes muito complexas e deixei de falar
alguns conceitos, pois a minha inteno com este tutorial era criar um guia prtico,
sem colocar muitas regras, de modo que o leitor possa ler e ao mesmo tempo ir
programando, sem ter que quebrar a cabea para decifrar frases.

Com os assuntos tratados neste guia j possvel fazer jogos, ainda que simples, em
trs dimenses, j que muitos deles se resumem a um cenrio e objetos se mexendo
na tela, faltando apenas programar a lgica do jogo.

Em caso de dificuldade para realizar alguma operao ou programar algo que no foi
explicado neste tutorial, recomendo consultar o prprio Help do XNA Game Studio
(Help -> Contents), que possui uma vasta gama de artigos, tutoriais, referncias e
exemplos de cdigo.

Abraos e at a prxima!

Guia Prtico para Iniciantes Microsoft XNA
Escrito: Fernando Birck ( Fergo ) http://www.fergonez.net
Julho 2007

Este artigo pode ser distribudo livremente, contanto que o seu contedo e anexos
(arquivo RAR) permaneam inalterados.

Referncias:

MSDN
o http://msdn2.microsoft.com/en-us/xna/default.aspx
Riemers
o http://www.riemers.net/