Transformando Sprites com XNA no Windows Phone 7

Transformar significa mudar, portanto transformar um Sprite significa muda-lo de alguma forma, ou mais especificamente alterar suas propriedades.

Como sei que você é um ótimo leitor, tenho certeza que acompanhou todos os posts anteriores sobre Sprites, e como pode reparar, até agora alteramos somente algumas propriedades. As principais foram:

"image" – onde definimos uma imagem bitmap (jpeg ou png por exemplo) para nosso Sprite

"position" – onde declaramos exatamente a posição do Sprite na tela

"color" – onde definimos a cor do nosso Sprite

No reino da programação de gráficos, "transformar" normalmente refere-se a  três coisas que podemos fazer com nosso Sprite ou Malha 3D, são elas:

"moving" (também conhecido como "translation" )

"rotation" (nossa simples e querida rotação)

"scaling" (que é o dimensionamento do elemento)

Estas mesmas propriedade afetam objetos 2D e 3D. Estas, embora sejam simples, são extremamente importantes e utilizadas frequentemente, por isso daremos atenção especial a cada uma de suas particularidades.

Neste post, mergulharemos de cabeça na propriedade moving ok?  Are you ready? So.. let's go!

Um movimento de Sprite pode ser feito diretamente ou indiretamente. O movimento direto envolve escrever código para mover um Sprite especificamente para um local especifico. O movimento indireto refere-se a ajustar (ou "setar") propriedades e variáveis que causam o movimento do Sprite, movendo-o através do gerenciamento de suas próprias propriedades. Simples?

Obviamente, a esta altura do campeonato, você já sabe que precisamos trabalhar no Update e Draw do Sprite, mas quem determina o movimento são suas propriedades.

Pensando em movimentos entre dos pontos (como em um plano cartesiano) você, a primeira vista, pode ter em mente que nossos movimentos serão somente retilíneos e simples ao extremo, mas não se engane, com isto que estamos aprendendo, você poderá também traçar arcos ou seguir uma curva, mas falaremos disso mais tarde.

Agora veremos como movimentar um Sprite por uma distância curta por frame. E lembre-se, falando em frame, uma game feito em XNA para Windows ou XBOX normalmente desenhará 60 fps (frames por segundo) porém no Windows Phone 7 teremos 30 fps somente.

Neste momento, iremos poupa-lo de detalhes que compliquem seu entendimento, mas por exemplo, quando digo que um elemento pode seguir uma curva ou arco, na verdade o XNA irá processar uma circunferência completa, e seu elemento irá navegar pelo raio de um específico ponto.

Não tem mágica. No fundo, a matemática e geometria está nos auxiliando o tempo todo, e todos movimentos são reproduzidos através do apoio de figuras geométricas em um plano cartesiano, simples assim Smiley

Iremos começar por um plano cartesiano 2D e trabalhar com um sistema de coordenadas.

Neste exemplo existem 2 eixos, o X e o Y. Ambos iniciam no centro do nosso gráfico, chamado de origem ou ponto zero (0,0)

Quando fazemos cálculos trigonométricos para transformar a posição de um Sprite, o eixo Y precisa ser revertido.

Não se assuste, olhando para a imagem, você conseguirá visualizar, basta imaginar que o canto da tela, neste caso o extremo superior esquerdo do Windows Phone 7, é nosso ponto zero (0,0) , com o eixo X aumentando e o eixo Y diminuindo para atingirmos a posição desejada.

A propriedade moving é a mais simples das três que estamos abordando. Só precisamos ter certeza que você está totalmente confortável com o sistema de plano cartesiano para darmos continuidade, por isso mais um exemplo.

 

 

Super Facil? Ótimo!

No próximo post falaremos sobre o método Move() e enriqueceremos nossa classe Sprite criada no post anterior. Aí a coisa vai começar a ficar bacana Smiley

Acredito que deva estar acompanhando todos os posts sem dificuldades certo? Qualquer sugestão, dúvida, por favor, não deixe de me comunicar, meu twitter é @fernandomartin

 

abraços!!

 

 

Posts anteriores

Visão geral do MVA - entendendo o roteiro de Windows Phone

O Windows Mobile e o Windows Phone

Visão geral do Windows Phone 7.5 (codinome Mango)

Visão geral do conceito Metro

Visão geral do SDK do Windows Phone

Visão geral das ferramentas de desenvolvimento para Windows Phone

Visão geral do Emulador

Testando sua app no device

Criando Protótipos

O que é o Windows Phone Marketplace parte 1 - Publicando sua app no Marketplace

O que é o Windows Phone Marketplace parte 2 - Publicando sua app no Marketplace

Marketplace Test Kit

Crie seu primeiro projeto XNA 4.0 para Windows Phone 7

Entendendo o User Input no Windows Phone 7 com XNA

Utilizando gestos no Windows Phone 7

Desenhando Bitmaps com XNA no Windows Phone 7

Tratando Bitmaps como Sprites utilizando XNA no Windows Phone 7

Desenhando muitos bitmaps com XNA no Windows Phone 7

Desenhando muitos bitmaps com XNA no Windows Phone 7 - parte 2

Criando uma simples classe Sprite com XNA no Windows Phone 7

 

*Se você ainda não baixou o Windows Phone 7 SDK, clique aqui para o donwload