Aula 3 – Arquitetura XNA e desenho 2D O objetivo desta aula é apresentar aos alunos os elementos que compõe a arquitetura do XNA, e mostrar as facilidades para realizar desenhos 2D na tela Há diversos exemplos práticos para esta aula, cada exemplo é marcado por um slide escrito “demo” Ao fim da aula é reservado um tempo para os alunos exercitarem os conceitos apresentados, assim, não é recomendável que os alunos realizem os demos juntos com o professor, pois isso acaba tomando muito tempo da aula

XNA Game Studio Aula 3 Arquitetura XNA e desenho 2D 4/22/2017 4:30 PM XNA Game Studio Aula 3 Arquitetura XNA e desenho 2D Esteban Walter Gonzalez Clua Instituto de Computação Universidade Federal Fluminense

Agenda: Aula 3 Revisão Arquitetura de um programa XNA Desenho em 2D 4/22/2017 4:30 PM Agenda: Aula 3 Revisão Arquitetura de um programa XNA Desenho em 2D “Components” de um game Divisão dos grupos para o projeto da matéria

Revisão: Componentes do XNA Game Studio 4/22/2017 4:30 PM Revisão: Componentes do XNA Game Studio Framework

Pipeline de Conteúdo (content pipeline) 4/22/2017 4:30 PM Revisão: XNA Framework Jogos Starter Kits Código Conteúdo Componentes Framework (extensões) Modelo de Aplicação Pipeline de Conteúdo (content pipeline) Framework (núcleo) Graphics Audio Input Math Storage Network Plataforma Direct3D XACT XINPUT XCONTENT Legenda XNA já provê Você cria Comunidade

Arquitetura de um programa XNA Ao se criar um projeto, são gerados dois arquivos: Program.cs Game1.cs Além disso, é gerado um sub-projeto de conteúdo, dentro da pasta “Content”, que é responsável por armazenar e compilar todo o conteúdo (sons, texturas, modelos 3D, etc) do jogo

Arquitetura de um programa XNA Program.cs static void Main(string[] args) { using (Game1 game = new Game1()) game.Run(); -> Executa o Game Loop }

Arquitetura de um programa XNA Classe“Game” É a central da arquitetura XNA Tem, internamente, um game loop chamado a cada 1/60 de segundo (default) Propriedade TargetElapsedTime pode mudar esta velocidade A cada execução do game loop, são chamados métodos específicos para atualizar o jogo e executar as rotinas de desenho

Arquitetura de um programa XNA Game1.cs Construtor – cria o objeto Graphics e indica o diretório do sub-projeto de conteúdo, referenciado pelo objeto Content public Game1() { graphics = new GraphicsDeviceManager(this); Content.RootDirectory = "Content"; } A classe Game1 possui 5 métodos que serão usados pelo programador para incluir as rotinas específicas do jogo (detalhes nos próximos slides)

Arquitetura de um programa XNA Métodos chamados pela classe Game (1/2) Initialize() Chamado quando o jogo carrega Onde se inicializam os recursos não gráficos Por exemplo, Mousehelper, Som, etc LoadContent() Chamado sempre que é necessário carregar os recursos (conteúdos) gráficos Isso pode acontecer no início do jogo, ou quando a janela (no Windows) sai de trás de outra janela, ou quando por algum erro se perde a referência ao dispositivo (device) de video

Arquitetura de um programa XNA Métodos chamados pela classe Game (2/2) UnloadContent() Chamado sempre que é necessário liberar os recursos (conteúdos) gráficos Métodos chamados a cada game loop: Update(GameTime gameTime) Onde se coloca a lógica principal do jogo (cálculos) Draw(GameTime gameTime) Onde se colocam as rotinas de desenho do jogo

Arquitetura de um programa XNA GameTime Passado como parâmetro para os métodos Update e Draw Tem propriedades que permitem ler o tempo transcorrido desde a última chamada e desde o início do jogo O tempo pode ser lido em: “Real Time”: tempo em segundos reais (relógio) É o usado por quase todas as aplicações “Game Time”: número de passos fixos executados conforme o clock da máquina. Como não reflete o tempo “de relógio”, a performance de um jogo que se baseie em “Game Time” pode variar conforme a performance da máquina, caso não se tenha cuidado. Pode ser usado para criar jogos com performance controlável via programa, setando-se a propriedade IsFixedTimeStep do objeto Game para false (executa jogo em full speed, ignorando a propriedade TargetElapsedTime) Propriedade IsRunningSlowly indica se o TargetElapsedTime não está sendo atingido

Desenho de objetos 2D

Desenho de objetos 2D Três passos: Vejamos isso na prática Criar uma variável do tipo Texture2D na classe Game1 Incluir a textura no subprojeto Content Carregar a textura na variável via Content Pipeline, no método LoadContent Mostrá-la na tela no método Draw, usando o objeto spriteBatch já criado pelo XNA Vejamos isso na prática

Desenho de objetos 2D Na classe Game 1: Texture2D textura; SpriteBatch spriteBatch; No construtor da classe (opcional): // Definir - o tamanho da janela (se em modo janela) OU // - a resolução (se em modo tela cheia) graphics.PreferredBackBufferWidth = 400; graphics.PreferredBackBufferHeight = 400; No método LoadContent: protected override void LoadContent() { textura = Content.Load<Texture2D>("xna_thumbnail"); }

Desenho de objetos 2D Não é necessário “descarregar” a textura no método UnloadContent Todo conteúdo carregado via ContentPipeline é gerenciado totalmente por ela, inclusive a liberação de recursos não mais usados

Desenho de objetos 2D No Método Draw: protected override void Draw(GameTime gameTime) { graphics.GraphicsDevice.Clear(Color.CornflowerBlue); spriteBatch.Begin(SpriteBlendMode.AlphaBlend); spriteBatch.Draw(textura, Vector2.One, Color.White); spriteBatch.End(); base.Draw(gameTime); }

Carregando texturas Projeto: XNA 3.0 Demo - Desenho textura

“Components” de um game

“Components” de um game Coleção Components da Classe Game Informa ao XNA quais os componentes do jogo Passos para criar um componente: Criar uma classe derivada de GameComponent ou de DrawableGameComponent Criar um objeto desta classe Adicionar o objeto ao Game usando: this.Components.Add( objeto ); O XNA automaticamente chama os métodos: GameComponent: método Update DrawableGameComponent: métodos Update e Draw

“Components” de um game 1. Criar uma classe derivada de GameComponent (1/2) class clsSprite : GameComponent { public Texture2D textura; // sprite texture public Vector2 posicao; // sprite posicao on screen public Vector2 velocidade; // velocidade in pixels public clsSprite(Game game, Texture2D Textura, Vector2 Posicao) : base(game) textura = Textura; posicao = Posicao; }

“Components” de um game Criar uma classe derivada de GameComponent (2/2) public override void Update(GameTime gameTime) { // ajusta a velocidade para não sair pelas bordas da tela if(posicao.X + textura.Width + velocidade.X > this.Game.Window.ClientBounds.Width) velocidade.X = -velocidade.X; // direita if (posicao.Y + textura.Height + velocidade.Y > this.Game.Window.ClientBounds.Height) velocidade.Y = -velocidade.Y; // de baixo if (posicao.X + velocidade.X < 0) velocidade.X = -velocidade.X; // esquerda if (posicao.Y + velocidade.Y < 0) velocidade.Y = -velocidade.Y; // de cima // Atualiza a posição posicao += velocidade; }

“Components” de um game Para fazer cálculos com o gameTime, para independência da velocidade da máquina: // Tempo (em segundos) para mostrar cada tela // 0.02 quer dizer que teremos 50 telas por segundo (0.02 fDuração x 50 telas = 1 segundo private float fDuracao = 0.02f; // Tempo que passou desde a última tela desenhada private float fTimer = 0.0f; public void Update(GameTime gameTime) { fTimer += (float)gameTime.ElapsedGameTime.TotalSeconds; if (fTimer > fDuracao) fTimer = 0.0f; // Aqui entra o código de atualização da sprite (slide anterior) }

“Components” de um game 2. Criar um objeto desta classe 3. Adicionar o objeto ao Game private clsSprite Desenho2D; ... protected override void LoadContent() { // Load a 2D texture sprite Desenho2D = new clsSprite(this, content.Load<Texture2D>("xna_thumbnail"), Vector2.One); Desenho2D.velocidade = new Vector2(1, 2); this.Components.Add(Desenho2D); }

“Components” de um game Como criamos um classe herdada de GameComponent (e não de DrawableGameComponente) precisamos criar um método de desenho e explicitamente invocá-lo a partir da classe Game Na clsSprite: public void Draw(SpriteBatch spriteBatch) { spriteBatch.Draw(textura, posicao, Color.White); } E no método Draw da classe Game1: ... spriteBatch.Begin(SpriteBlendMode.AlphaBlend); Desenho2D.Draw(spriteBatch); spriteBatch.End(); A vantagem disso é que podemos usar um só spriteBatch para desenhar todas as sprites => melhor performance

Criando Game Components Projeto: XNA 3.0 Demo - Game Component

Desafio Criar classe herdada de GameComponent que desenhe uma sprite com transparência e colisão Projeto: XNA 3.0 Demo - Desafio 2D

Desafio - Dicas A cor magenta permite a criação de áreas transparentes Como calcular colisão de dois círculos, para sprites que armazenem o raio e o centro: public bool CircleCollides(clsSprite otherSprite) { return (Vector2.Distance(this.center, otherSprite.center) < this.radius + otherSprite.radius); }

Divisão dos grupos para o projeto da matéria Dividir a turma em grupos de no máximo 5 alunos cada Cada grupo deverá definir o jogo que irá produzir para avaliação ao fim da matéria Entregar um GDD (GDD = Game Design Document documento de definição de jogo) na próxima aula

4/22/2017 4:30 PM Perguntas? 30