XNA 4.0 - Criar jogos para PC e XBOX 360 - Parte 3 - Criando EIXOS X Y Z

Vamos em frente. Não sei se as linhas de código vão ficar legal aqui no blog mas vou colocá-las dentro de citações, assim vai ficar mais fácil encontrá-las. No final irei disponibilizar o projeto que acabamos de fazer para download.

Logo no começo do arquivo "Game1.cs" procure pelas linhas

GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;

Essa aréa será onde iremos declarar nossas variáveis e constantes, GraphicsDeviceManager é um tipo de variável. Então graphics é uma variável do tipo GraphicsDeviceManager e é ela que vai tratar de tudo relacionado a video, tela cheia, resolução, AA, renderização entre outros. Já o segundo, o SpriteBacth, nos dará opções de monstrar elementos 2D, textos entre outros. Abaixo de "SpriteBatch spriteBatch" coloque "const String gameName = "Tutorial 1 - PCdubaum"; não se esqueça de terminar a linha com ponto e virgula. O Código fica assim:

GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;
const String gameName = "Tutorial 1 - PCdubaum";

Nós criamos uma constante(const) do tipo String(Texto) com o nome de gameName e inserimos um texto nessa String, que é "Tutorial 1 - PCdubaum" - esse será o nome de nossa janela, sinta-se livre para altera-lo. E para que essa alteração sejá feita procure o método Initialize(), falamos dele no post passado, e insira a seguinte linha "Window.Title = gameName;" o código ficará assim:

protected override void Initialize()
{
// TODO: Add your initialization logic here
Window.Title = gameName;
base.Initialize();
}

Debbug o código, F5 - Setinha verde - Menu Debug, E o nome de nossa janela terá mudado, agora vamos desenhar simples eixos em 3D. Na aréa de variaveis delare mais 3 variáveis. "VertexBuffer vertexBuffer;" "IndexBuffer indexBuffer;" "BasicEffect efeito;". VertexBuffer é onde os vértices de nossos eixos serão armazenados, IndexBuffer é onde os indices dos vértices de nossos Eixos 3D serão armazenados. BassicEffect é um efeito básico, tudo que será desenhado na tela, Modelos, Linhas, Malhas preica de pelo menos um efeito. Nosso código de variáveis fica assim:

GraphicsDeviceManager graphics;
SpriteBatch spriteBatch;
const String gameName = "Tutorial 1 - PCdubaum";

//Variaveis de Renderização
VertexBuffer vertexBuffer;
IndexBuffer indexBuffer;
BasicEffect effect;

Tudo o que estiver depois de //(Barras Duplas) serão comentários e não terão influência sobre o código.

Agora vamos pensar um pouco. O XNA assim como o DIRECTX usam 4 maneiras distinatas de desenhos simples(Primitivos), LineList, LineStrip, TriangleList e TriangleStrip, ou seja, ListaDeLinhas, LinhasConectadas, ListaDeTriângulos e Triângulos conectados. Se queremos desenhar os eixos X,Y e Z então temos de usar uma Lista de Linhas(LineList).

Vamos pensar de novo, o que é preciso para se criar uma linha? 2 pontos no espaço, você vai responder. Mas como fazemos isso em XNA? Vamos usar vértices, então para criar uma linha precisaremos de 2 vértices, no caso do eixo X será: X: -1, Y: 0, Z: 0 e o nosso segundo ponto será em: X: 1, Y: 0, Z: 0. Então temos dois pontos que serão um segmento de reta, para fazer um segmento para o eixo Y é só zerar a coordenada X e mudar as coordenadas de Y. e o mesmo para o eixo Z. Nesse ponto você já deve ter entendido como se fazer segmentos de reta em qualquer lugar do espaço. Vamos ao código. Procure o método LoadContent().

Nele vamos dar vida a variável effect com o seguinte código, que deve ficar abaixo de "spriteBatch = new SpriteBatch(GraphicsDevice);" então teremos:

// Create a new SpriteBatch, which can be used to draw textures.
spriteBatch = new SpriteBatch(GraphicsDevice);

//Cria o efeito que será usado para desenhar os eixos
effect = new BasicEffect(GraphicsDevice);

Agora masmo criar variáveis locais, o único metodo que pode alterál-as é o metodo LoadContent(), então essas variáveis não serão "visiveis" para o resto do jogo. Precisamos de uma variável para o tamanho dos Eixos em float(Ponto Flutuante), a quantidade de vértices(int) e uma matriz para guardar nossos índices. Espero que você ja tenha tido uma idéia de como seria essas declarações.

//Tamanho dos eixos 3D
float axisLenght = 1f;

//Numero de Vertices Usados
int vertexCount = 6;

//Os indices de nossas linhas
int[] indices = new int[6];

Continuando no mesmo método vamos precisar de uma declaração desses vértices, por agora tome como rotina o código, e na sequência vamos criar a lista de onde guardaremos os vértices, Ela é do Tipo Vértice com Posição e Cor por isso VertexPositionColor e ela terá o tamanho de vertexCount, que está a cima e é 6.

//Nossa declaração de Vertex
VertexDeclaration decl = new VertexDeclaration(VertexPositionColor.VertexDeclaration.GetVertexElements());

//Criando os nossos vertices
VertexPositionColor[] vertices = new VertexPositionColor[vertexCount];

Agora vamos preencher o Nosso VertexpositionColor com os vértices de nossos eixos. Eu vou explica a primeira e segunda linha dos vertices e sos índices e você já será capaz de deduzir as linhas dos outros eixos.

vertices[0] = new VertexPositionColor(new Vector3(-axisLenght, 0.0f, 0.0f), Color.Blue);
vertices[1] = new VertexPositionColor(new Vector3(axisLenght, 0.0f, 0.0f), Color.Blue);

indices[0] = 0;
indices[1] = 1;

A primeira linha diz que criaremos um vertice[0] que será um Vértice com Posição e com e logo a seguir vamos dizer a esse vértice que ele sera um novo vetor de 3 dimenções e a posição será(-axisLenght, 0.0f, 0.0f), repare que -axisLenght é uma variável que foi declarada mais acima, e que terá uma Cor e é que será Azul, Color.Blue. Depois adicionamos mais um vértice, sempre na sequência, então o vertice[1], que segue o mesmo ritual do anterior mas agora o ponto X muda, o -axisLenght se torna positivo axisLenght.

Criamos os indices, então o indice[0] é 0, o indice[1] é um e por assim e diante. Já falamos o que deve mudar para que os outro eixos sejam desenhados ó código fica assim:

//Vamos preencher nossos vertices e nossos indices
//Eixo x
vertices[0] = new VertexPositionColor(new Vector3(-axisLenght, 0.0f, 0.0f), Color.Blue);
vertices[1] = new VertexPositionColor(new Vector3(axisLenght, 0.0f, 0.0f), Color.Blue);

indices[0] = 0;
indices[1] = 1;

//Eixo y
vertices[2] = new VertexPositionColor(new Vector3(0.0f, -axisLenght, 0.0f), Color.Red);
vertices[3] = new VertexPositionColor(new Vector3(0.0f, axisLenght, 0.0f), Color.Red);

indices[2] = 2;
indices[3] = 3;

//Eixo z
vertices[4] = new VertexPositionColor(new Vector3(0.0f, 0.0f, -axisLenght), Color.Yellow);
vertices[5] = new VertexPositionColor(new Vector3(0.0f, 0.0f, axisLenght), Color.Yellow);

indices[4] = 4;
indices[5] = 5;

Para finalizar o método LoadContent() insira o seguinte código, para que nossos vértices e indices sejam desenhados corretamente, falaremos mais depois.

//Preencher o vertexBuffer com os vértices
vertexBuffer = new VertexBuffer(GraphicsDevice, decl, vertexCount, BufferUsage.WriteOnly);
vertexBuffer.SetData(vertices);

//Preenche o indexBuffer com os indices
indexBuffer = new IndexBuffer(GraphicsDevice, IndexElementSize.SixteenBits, 20 * sizeof(int), BufferUsage.WriteOnly);
indexBuffer.SetData(indices);

Já fizemos coisas pra caramba e você já deve se estar perguntando se já é possível ver alguma coisa em nossa tela e a resposta é: Não!, mas não vá embora, Ok. Pode beber uma água, se algongar e é o que vou fazer, quando voltarmos vamos ver o que fizemos... Voltei!

Procure o método Draw(), ele é o ultimo e cole o seguinte código abaixo de
GraphicDevice.Clear();

GraphicsDevice.SetVertexBuffer(vertexBuffer);
GraphicsDevice.Indices = indexBuffer;

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

GraphicsDevice.DrawPrimitives(PrimitiveType.LineList, 0, 12);
}

Pronto, já pode depurar e ver o que aconteceu, se tudo deu certo você está vendo duas linhas.

o método Draw() fica assim:

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

//Adicionamos o nossos indices e vertices ao nosso dispositivso para desenhar
GraphicsDevice.SetVertexBuffer(vertexBuffer);
GraphicsDevice.Indices = indexBuffer;

//Essa linha procura por todos os efeitos que vamos aplicar aos eixos
foreach (EffectPass pass in effect.CurrentTechnique.Passes)
{
//Adiciona e aplica o efeito
pass.Apply();

//Desenha a lista de linhas
GraphicsDevice.DrawPrimitives(PrimitiveType.LineList, 0, 12);
}

base.Draw(gameTime);
}

No próximo tutorial vamos mudar o âmgulo de visão, adicionar cor, melhorar nossos eixose usar o UnloadContent();

E aqui está o arquivo do Tutorial: http://www.megaupload.com/?d=KCEAMTLX