Projeto XNAF: colocar imagens do nosso jogo em XNA

Olá
Vamos continuar com o joguinho de torre de Hanói usando XNA? Lembra, é o nosso projeto, meu e seu, leitor imaginário. XD
Lembrando que vamos começar por baixo, fazendo coisas simples e depois aumentando a dificuldade.

Bom, primeiro vamos pegar essas imagens ai e salva-las, e é bom deixar com o mesmo nome que eu dei. Só para ajudar.

barra

disco_1

disco_2

disco_3

Bom, salvaram elas? Agora abra o Visual Studio ou o Visual C# Express. Abra o projeto da torre de Hanói. Você pode ir por File>>Open>>Project/Solution e escolher o arquivo dentro da pasta torre de Hanói com o nome de Game1.cs

Ou você clica no nome do projeto na abinha de Recents Project.

Bom, vá à abinha da Solution Explore, que é onde mostrar todos os componentes (arquivos) do projeto. Se ela não estiver visível vá ao menu View>>Solution Explore. Ou dê Ctrl+Alt+L.

Bom, Tá vendo onde está escrito Content? Clique sobre ele (para selecionar) e depois clique com o botão direito e escolha add e crie uma pasta. A pasta deve ter o nome de Sprites. Sprites? Ah pai, a tia MayogaX explica depois. Enfim:

Solution Explore

Agora clique com o botão direito na pasta criada e escolha add>>existing item e ai escolha as imagens. Uma de cada vez.

Bom, primeiro tenho que contar uma coisa: como testar seu jogo. É claro que por enquanto não tem nada, mas só para você já ficar sabendo, olhe a imagem abaixo:

Ta vendo o botãozinho verde? Se você clicar nele pode ver como está ficando o sue jogo. Ou seja, por enquanto uma tela azul. Vamos trocar a cor dele primeiro?

Vá onde tem o código:  protected override void Draw(GameTime gameTime){

Vá na linha depois e onde tem escrito a cor de tonalidade azul escreva White:

GraphicsDevice.Clear(Color.White);

É importante que escreva White com ‘w’ maisculo. Em C# há distinção de letras maisculas de minusculas.

Agora clique no botãozinho verde que eu acabei de falar. A tela tá branca, né? Por enquanto, por enquanto, vamos deixa-lá assim.

Bom, poderiamos criar jeitos muito imaginários para controlar as imagens… por enquanto vamos fazer do metodo mais simples, certo?

Agora vamos criar a váriavel  que chama a imagem e a variavel que diz em que posição da tela cada coisa vai ficar. A começar com a barra. Pense comigo: por que variavel a posição na tela? Oras os discos vão ter que se mover, né?

Vá na classe publica Game1 e escreva logo depois de onde está escrito:

public class Game1 : Microsoft.Xna.Framework.Game

{

GraphicsDeviceManager graphics;

SpriteBatch spriteBatch;

Ai escreva:

Texture2D barra1;

Vector2 barra1posicao = Vector2.Zero;

Texture2D barra2;

Vector2 barra2posicao = Vector2.Zero;

Texture2D barra3;

Vector2 barra3posicao = Vector2.Zero;

NOTA IMPORTANTE: Onde é letra maiscula deve ser maiscula e minuscula deve ser minuscula. Espaços devem ser respeitado. Depois falamos mais sobre isso, mas como eu já disse letras maisculas e minusculas são diferentes em C#.

Bom, percebeu que eu criei 3 barras? Ué, no jogo não são 3 barras? Ai você pergunta por que temos só um desenho de barra e eu respondo: não podemos copiar todas as barras?

Criamos as variaveis de textura e as variáveis de vetor. As variáveis de vetor são para colocarmos as possições nas barras.

Agora vamos dizer qual imagem de cada um e qual a possição.

Vá em  protected override void LoadContent()

E escreva logo depois do segundo cometário:

// TODO: use this.Content to load your game content here

barra1 = Content.Load<Texture2D>(“Sprites\\barra”);

barra2 = Content.Load<Texture2D>(“Sprites\\barra”);

barra3 = Content.Load<Texture2D>(“Sprites\\barra”);

Bom, já criamos as variáveis e já dizemos que cada uma delas é a imagem da barra. É isso que diz essas linhas.

barra1 é o nome da variável. Content.Load diz que dentro da variável vai caber tal conteúdo que deve ser carregado. <Texture2D> diz que é 2d. E depois o arquivo que deve ser carregado.

Bom, agora precisamos mandar desenhar as barras. Onde tiver o código:

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.White);

// TODO: Add your drawing code here

Escreva logo depois:

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra1, barra1posicao, Color.White);

spriteBatch.End();

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra2, barra2posicao, Color.White);

spriteBatch.End();

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra3, barra3posicao, Color.White);

spriteBatch.End();

Dê o play, Macaco! Digo… ahn… teste o joguinho (dica: apertar F5 é a mesma coisa que clicar no botãozinho de play verde).

Você vê só uma barra, certo? Bem, estão as três, mas agente pôs como todas na mesma posição ZERO. Vamos mudar as posições?

Vá em protected override void Update(GameTime gameTime) e logo depois do comentário // TODO: Add your update logic here escreva:

barra1posicao = new Vector2(170.0f, 200.0f);

barra2posicao = new Vector2(370.0f, 200.0f);

barra3posicao = new Vector2(570.0f, 200.0f);

Teste o jogo agora. Bom, por hoje é só. Depois o resto e depois faremos leitura do mouse no jogo (esse jogo será rodado só em pcs).

Bom, até a próxima!

Olá
Vamos continuar com o joguinho de torre de Hanói usando XNA? Lembra, é o nosso projeto, meu e seu, leitor imaginário. XD
Lembrando que vamos começar por baixo, fazendo coisas simples e depois aumentando a dificuldade.

Bom, primeiro vamos pegar essas imagens ai e salva-las, e é bom deixar com o mesmo nome que eu dei. Só para ajudar.

barra

disco_1

disco_2

disco_3

Bom, salvaram elas? Agora abra o Visual Studio ou o Visual C# Express. Abra o projeto da torre de Hanói. Você pode ir por File>>Open>>Project/Solution e escolher o arquivo dentro da pasta torre de Hanói com o nome de Game1.cs

Ou você clica no nome do projeto na abinha de Recents Project.

Bom, vá à abinha da Solution Explore, que é onde mostrar todos os componentes (arquivos) do projeto. Se ela não estiver visível vá ao menu View>>Solution Explore. Ou dê Ctrl+Alt+L.

Bom, Tá vendo onde está escrito Content? Clique sobre ele (para selecionar) e depois clique com o botão direito e escolha add e crie uma pasta. A pasta deve ter o nome de Sprites. Sprites? Ah pai, a tia MayogaX explica depois. Enfim:

Agora clique com o botão direito na pasta criada e escolha add>>existing item e ai escolha as imagens. Uma de cada vez.

Bom, primeiro tenho que contar uma coisa: como testar seu jogo. É claro que por enquanto não tem nada, mas só para você já ficar sabendo, olhe a imagem abaixo:

Ta vendo o botãozinho verde? Se você clicar nele pode ver como está ficando o sue jogo. Ou seja, por enquanto uma tela azul. Vamos trocar a cor dele primeiro?

Vá onde tem o código:  protected override void Draw(GameTime gameTime){

Vá na linha depois e onde tem escrito a cor de tonalidade azul escreva White:

GraphicsDevice.Clear(Color.White);

É importante que escreva White com ‘w’ maisculo. Em C# há distinção de letras maisculas de minusculas.

Agora clique no botãozinho verde que eu acabei de falar. A tela tá branca, né? Por enquanto, por enquanto, vamos deixa-lá assim.

Bom, poderiamos criar jeitos muito imaginários para controlar as imagens… por enquanto vamos fazer do metodo mais simples, certo?

Agora vamos criar a váriavel  que chama a imagem e a variavel que diz em que posição da tela cada coisa vai ficar. A começar com a barra. Pense comigo: por que variavel a posição na tela? Oras os discos vão ter que se mover, né?

Vá na classe publica Game1 e escreva logo depois de onde está escrito:

public class Game1 : Microsoft.Xna.Framework.Game

{

GraphicsDeviceManager graphics;

SpriteBatch spriteBatch;

Ai escreva:

Texture2D barra1;

Vector2 barra1posicao = Vector2.Zero;

Texture2D barra2;

Vector2 barra2posicao = Vector2.Zero;

Texture2D barra3;

Vector2 barra3posicao = Vector2.Zero;

NOTA IMPORTANTE: Onde é letra maiscula deve ser maiscula e minuscula deve ser minuscula. Espaços devem ser respeitado. Depois falamos mais sobre isso, mas como eu já disse letras maisculas e minusculas são diferentes em C#.

Bom, percebeu que eu criei 3 barras? Ué, no jogo não são 3 barras? Ai você pergunta por que temos só um desenho de barra e eu respondo: não podemos copiar todas as barras?

Criamos as variaveis de textura e as variáveis de vetor. As variáveis de vetor são para colocarmos as possições nas barras.

Agora vamos dizer qual imagem de cada um e qual a possição.

Vá em  protected override void LoadContent()

E escreva logo depois do segundo cometário:

// TODO: use this.Content to load your game content here

barra1 = Content.Load<Texture2D>(“Sprites\\barra”);

barra2 = Content.Load<Texture2D>(“Sprites\\barra”);

barra3 = Content.Load<Texture2D>(“Sprites\\barra”);

Bom, já criamos as variáveis e já dizemos que cada uma delas é a imagem da barra. É isso que diz essas linhas.

barra1 é o nome da variável. Content.Load diz que dentro da variável vai caber tal conteúdo que deve ser carregado. <Texture2D> diz que é 2d. E depois o arquivo que deve ser carregado.

Bom, agora precisamos mandar desenhar as barras. Onde tiver o código:

protected override void Draw(GameTime gameTime)

{

GraphicsDevice.Clear(Color.White);

// TODO: Add your drawing code here

Escreva logo depois:

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra1, barra1posicao, Color.White);

spriteBatch.End();

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra2, barra2posicao, Color.White);

spriteBatch.End();

spriteBatch.Begin(SpriteBlendMode.AlphaBlend);

spriteBatch.Draw(barra3, barra3posicao, Color.White);

spriteBatch.End();

Dê o play, Macaco! Digo… ahn… teste o joguinho (dica: apertar F5 é a mesma coisa que clicar no botãozinho de play verde).

Você vê só uma barra, certo? Bem, estão as três, mas agente pôs como todas na mesma posição ZERO. Vamos mudar as posições?

Vá em protected override void Update(GameTime gameTime) e logo depois do comentário // TODO: Add your update logic here escreva:

barra1posicao = new Vector2(170.0f, 200.0f);

barra2posicao = new Vector2(370.0f, 200.0f);

barra3posicao = new Vector2(570.0f, 200.0f);

Teste o jogo agora. Bom, por hoje é só. Depois o resto e depois faremos leitura do mouse no jogo (esse jogo será rodado só em pcs).

Bom, até a próxima!