Crie seu primeiro projeto XNA 4.0 para Windows Phone 7

  • Article

Abra o Visual Studio. O processo que faremos agora é similar mesmo em diferentes versões (Express, Professional, Ultimate..)

Clique em New Project e selecione em Installed Templates o item XNA Game Studio 4.0 e em seguida, ao lado direito, clique em Windows Phone Game 4.0

Se você ainda não baixou o Windows, clique aqui e baixe o SDK!

Você irá notar que tanto uma estrutura de pastas como arquivos e trechos de código virão automaticamente no seu projeto. Isso acontece porque estamos utilizando um template, onde o próprio Visual Studio já inclui no início do projeto o que você muito provavelmente fará uso.

Nota, o código gerado é extremamente similar ao gerado também para projetos para Windows e XBOX 360.

Pressione F5 (Build / Run). Detalhe, irei considerar neste exercício que você não está com um device acoplado no PC para um deploy no próprio Windows Phone 7, utilizando assim o emulador.

 

Somente uma tela azul como resultado? Não se preocupe, não começamos a escrever o código do nosso game ainda.

Agora vamos adicionar um SpriteFont no Content Project da nossa solução. Clique com o botão direito em Content Project (no Solution Explorer) e selecione Add, New Item.

Na janela Add Item, selecione Sprite Font na lista. Em filename defina SpriteFont1.spritefont

 

Mais para frente falaremos sobre sprites e como eles são responsáveis por tudo o que aparece na tela de um game.

Cara contextualizar, tenha em mente que tudo o que aparece na tela de um game como o herói, o placar, sua barra de energia, ícones de magia.. todos são sprites! Na imagem abaixo temos muitos deles caso na minha descrição você não tenha conseguido visualizar:

Não fique preocupado em entender todo código abaixo neste momento. Este blogpost a dedicado a iniciar sua jornada relacionada a Windows Phone 7 e XNA e não mergulhar a fundo da linguagem, neste caso C#.

Aproveitando, caso deseje mergulhar no aprendizado da linguagem, sugiro fortemente o livro Programando C# da MAKRON Books.

Agora, no código já existe no arquivo Game1.cs:

 public class Game1 : Microsoft.XNA.Framework.Game
{
GraphicsDeviceManager grafics;
SpriteBatch spriteBatch;


public Game1()
{
graphics = new GraphicsDeviceManager(this);
Content.RootDirectory = "Content";
TargetElapsedTime = TimeSpan.FromTicks (333333);
}

Insira o seguinte código  entre as linhas 4 e 7:

 
//new font variable 
SpriteFont font;

Pronto, a fonte já está definida, mas ainda é necessário carregar na inicialização do programa o código que acabamos de digitar. Para isso, insira no método LoadContent logo após a linha spriteBatch = new SpriteBatch(GraphicsDevice); estas duas linhas:

 

 //load the font
Font = Content.Load<SpriteFont>(“SpriteFont1”);

 

Estamos quase lá. Já definimos nossa fonte e carregamos na memoria no nosso game, porém agora é necessário "escrever" algo na nossa tela, literalmente.

 

Chamamos isto de Print, e é através dos objetos SpriteBatch e SpriteFont que podemos escrever o que desejarmos. Rótulos (ou Label de preferir) títulos, mensagens, grandes blocos de texto, etc.

 

Não entraremos em detalhe neste momento no ciclo de execução de um game feito em XNA (que por sinal é totalmente diferente do que você deve estar habituado caso já tenha conhecimentos em desenvolvimento Web ou Desktops convencionais, sempre orientados a eventos). Por enquanto é importante que saiba que nosso código precisa ser chamado no método Draw.

Vá até o método Draw e insira após a linha GraphicsDevice.Clear(Color.CornflowerBlue); o seguinte código:

 //print a message
spriteBatch.Begin();
string text = “XNA Rocks!!!”;
Vector2 pos = font.MeasureString(text);
spriteBatch.DrawString(font, text, pos, Color.White);
spriteBatch.End();

base.Draw(gameTime);

 

Hora de rodar nosso programa novamente (Debug, Start Debugging ou simplesmente pressionando F5, o que você preferir).

 

Detalhe, o emulador não precisa ser fechado toda vez que desejar rodar sua aplicação. Você pode simplesmente dar stop no Debugging e deixa-lo aberto. Ele irá retornar para a tela inicial do Windows Phone 7 e aguardar novamente seu deploy (através do release ou debug). Isto fará com que economize tempo em seus testes.

 

Veja como ficou seu teste. O que achou?

 

Acredito que tenha achado a fonte do nosso sprite pequeno demais e o alinhamento não era bem o que esperava, estou certo?

Isto é porque, por padrão, aplicações feitas em XNA utilizam o formato landscape, mas já o emulador, também por padrão, sempre é inicializado no formato portrait.

O que fazer? Simples. Mouse-over na parte superior direita do emulador do Windows Phone 7. Um pequeno menu será mostrado. Umas das opções que temos é justamente rotacionar o emulador. Faça com que fique na posição landscape (na horizontal) e com os botões Start, Search e Back voltados para a direita.

O formato lanscape não necessariamente prevê que os botões do telefone ficarão nesta posição, embora a grande maioria dos desenvolvedores focados em devices "hand-sized" esperam que este seja o comportamento do usuário, girar o aparelho no sentido anti-horário para ativa-lo em nova orientação, e obviamente horário para retornar ao formato portrait.

Pronto, agora está bem melhor não?

 

 

Para finalizar esta sua primeira experiência com XNA para Windows Phone 7, acesse novamente o arquivo SpriteFont1.spritefont e altere o valor da fonte do nosso texto para maior. Só para deixar um "olá XNA" bem feito.

Tabém acredito que a esta altura você percebeu que nosso SpriteFont1.spritefont nada mais que é um XML.

 

  <!--
    Size is a float value, measured in points. Modify this value to change
    the size of the font.
    -->
    <Size>14</Size>

XNA Rocks! E se você tem interesse em Mobile e XNA.. YOU ROCK AS WELL Smiley

Bem vindo ao Windows Phone 7 com XNA.

[]'s!