MonoGame — Menu de Jogo
Neste artigo será apresentado uma forma de criar o menu de jogo utilizando sprite (Não é o refrigerante..rs), ele será desenvolvido utilizando o conceito de componentes, desta forma o menu ficará reutilizável para dispositivos que possuem tela sensível ao toque.
Para desenvolver o jogo de exemplo as sprite sheets abaixo serão utilizadas:
Show me the code!
Com o Visual Studio aberto, façamos o nosso saudoso ritual, File → New → Project, selecionando o Template MonoGame Android Project.
Com o projeto já criado, na guia Solution Explorer navegue até a pasta Content e realize um duplo clique no arquivo Content.mgcb, assim que o MonoGame Pipeline Tool abrir execute os seguintes passos para adicionar as sprites:
Para manipular qual botão foi clicado e a ação que deverá ser executada, será necessário representar o botão como um objeto, para solucionar este problema criei a classe abstrata Botao.cs para manipular o estado e a ação de cada botão.
Variáveis
- _larguraBotao — Armazena a largura de um botão.
- Textura — Armazena o sprite do botão com o estado clicado e normal.
- Posicao — Armazena a posição do botão na tela do dispositivo.
- RetanguloOrigem — Define qual parte da sprite será renderizada.
- EstadoDoBotao — Define se o botão está em seu estado normal ou clicado, por padrão é definido para o estado normal
Métodos
- LoadContent — É carregado o sprite sheet do botão, atribuindo o mesmo para a variável Textura, logo em seguida e setado a variável _larguraBotao com a metade da largura da textura (Largura da textura dividida por 2), e na variável RetanguloOrigem definido a área inicial da sprite que deverá ser renderizada.
Observe que para a largura de um botão e a área que será renderizada, está sendo levando em consideração que o sprite sheet utilizado contém apenas dois estados do botão.
Ao final do arquivo da classe Botao.cs foi criado o enum EstadoBotao para facilitar o entendimento é manipulação do código.
Com a classe abstrata criada, podemos criar as classes que irão representar o botão de Play, Menu e Exit.
As classes BotaoPlay.cs, BotaoMenu.cs e BotaoExit.cs fazem herança da classe Botao.cs, implementando o método abstrato AcaoClick, como é um projeto de exemplo, fiz apenas a implementação de um System.Console.WriteLine que irá mostrar uma mensagem na janela de output do Visual Studio.
Lembra do conceito de componentes que citei no inicio deste artigo!? Ele está sendo aplicado na classe de MenuComponente.cs que está fazendo herança com a classe Microsoft.Xna.Framework.DrawableComponent.
Na classe MenuComponent.cs foi definido no construtor os parâmetros do tipo Game, SpriteBatch e List<Botao>, onde o primeiro é passado para o construtor da classe base é o segundo e terceiro são armazenados em variáveis privadas com seus respetivos tipos.
No construtor também é feito a chamada ao método privado SetaPosicaoBotoes, onde é definido a posição de acordo com o tamanho da tela do dispositivo e da textura do botão.
O eixo X é definido pela largura da tela subtraída pela largura da área de renderização dividido por 2.
O eixo Y é definido pela altura da variável RetanguloOrigem multiplicada pelo índice do botão atual mais 100.
Após definido os eixos X e Y, a posição do botão é setada com um novo objeto do tipo Rectangle com largura igual a textura do botão dividida por 2 e altura igual a altura da textura.
Métodos
- Update —É Obtido a possível ação de touch no dispositivo, armazenando o resultado na variável touchLocations, em seguida, após verificar se existe touch (touchLocations maior que zero) e se o estado do primeiro touch em touchLocations é igual a TouchLocationState.Release (touch liberado), é criado um objeto do tipo Rectangle e atribuído para a variável limiteDoTouch, está variável é utilizada para verificar se o touch ocorre sobre algum dos botões para mudar o estado e disparar o método AcaoClick do mesmo, logo abaixo o método Update do botão iterado é disparado para atualizar a área do sprite que será renderizada (Que muda de acordo com o estado do botão).
- Draw — É realizado a iteração na lista de botões para renderiza-los na tela do dispositivo de acordo com a sua textura, posição e origem de renderização.
Com a implementação de um componente, ganhamos a facilidade de não precisar fazer chamadas explícitas de métodos, na classe principal Game1.cs, para atualizar e/ou desenhar objetos na tela.
Como pode ser visto, na classe Game1.cs foi criado as variáveis que representam os botões do menu já instanciadas com seus respectivos tipos.
No método LoadContent é efetuado o carregamento dos sprites de cada botão, em seguida a variável botoes do tipo List<Botao> é criada e inicializada com os objetos _botaoPlay, _botaoMenu e _BotaoExit.
É em fim o tão citado componente entra em ação realizando a criação da variável menuComponent passando como parâmetro para o seu construtor a referência da classe Game1.cs, o spriteBatch e a lista de botoes.
Após realizar a instanciação do componente só precisamos adicionar o mesmo na coleção de componentes utilizando a propriedade Components do tipo Microsoft.Xna.Framework.GameComponentCollection herdada da classe Microsoft.Xna.Framework.Game.
Ét voila…
Repositório do Exemplo: https://github.com/RonildoSouza/MonoGameMenuDeJogo
Baixe o APK: https://bit.ly/2E40dj8
REFERÊNCIAS:
https://www.deviantart.com/piratekiki/art/Global-Game-Jam-Tiki-Torcher-game-sprites-589940793
https://docs.microsoft.com/pt-br/dotnet/csharp/language-reference/keywords/enum
