LIBGDX Preparando o esqueleto

De MediaWiki
Saltar a: navegación, buscar

UNDIDADE 2: Preparando o 'esqueleto' do noso xogo

Preparando o 'esqueleto' do noso xogo

Como comentamos anteriormente, a clase que usan os diferentes proxectos debe ser unha subclase da clase ApplicationAdapter, pero tamén comentamos que podía ser unha subclase da clase Game.

Que diferenza hai entre unha opción e outra ?

A diferenza se atopa en que se usamos a clase Game imos poder ter (a nivel de programación) unha clase por cada pantalla para o noso xogo e podemos xestionalas-programalas independentemente. Moito máis práctico, claro e doado de manter. En caso de usar a ApplicationAdapter, todo o código de noso xogo debería ir dentro do render de dita clase (que é o método que se chama de forma continuada) e se o xogo tivera varias pantallas teríamos que engadir algunha lóxica de programación para que amosara unha ou outra segundo o caso.


Polo tanto imos preparar o noso proxecto para utilizar a clase Game.

  • Primeiro imos crear unha nova clase no proxecto Xogo2D-Core, e dentro deste no paquete com.plategaxogo2d.o_voso_nome, que é o paquete onde se atopa a clase MeuXogo. Dámoslle de nome MeuXogoGame e facemos que derive da clase Game.


Nota: Ó facelo deberemos de importar dita clase coa combinación de teclas Control+Shift+O ou ben situarnos enriba da clase e escoller a opción Import .....


Despois de facelo veremos que aparece un erro no nome da clase. Se nos situamos enriba dela aparecerá unha ventá para engadir os métodos que deben estar definidos na clase.

LIBGDX xogos2d desenrolo 1.jpg

Aparecerá o método create...


Agora debemos de cambiar a clase que usan as diferentes plataformas pola nova clase creada.


  1. package com.plategaxogo2d.angel.desktop;
  2.  
  3. import com.badlogic.gdx.backends.lwjgl.LwjglApplication;
  4. import com.badlogic.gdx.backends.lwjgl.LwjglApplicationConfiguration;
  5. import com.plategaxogo2d.angel.MeuXogoGame;
  6.  
  7. public class DesktopLauncher {
  8.         public static void main (String[] arg) {
  9.                 LwjglApplicationConfiguration config = new LwjglApplicationConfiguration();
  10.                 new LwjglApplication(new MeuXogoGame(), config);
  11.         }
  12. }

Nota: Exemplo feito sobre a versión Desktop do xogo. Deberemos facelo en todos os proxectos (html-android).


Agora imos crear un paquete onde van estar as pantallas do noso xogo. Dito paquete terá de nome com.plategaxogo2d.pantallas. Para crear o paquete prememos o botón dereito sobre o cartafol 'src' do proxecto Xogo2D-Core e escollemos a opción New => Package.

LIBGDX xogos2d desenrolo 2.jpg

Dentro de dito paquete creamos unha clase de nome PantallaPresentacion que implemente a interface Screen (despois da definición da clase deberemos poñer implements Screen).

Ó facelo e despois de facer o import da clase (control+shift+O) aparecerá un erro enriba da clase. Igual que fixemos anteriormente, nos situamos enriba do nome da clase e escollemos a opción de Add Unimplemented Methods.

LIBGDX xogos2d desenrolo 3.jpg


TAREFA A REALIZAR: Faremos as seguintes pantallas (repetiremos o proceso anterior):

  • A da HighScores. Chamarémoslle PantallaMarcadores.
  • A de pausa. Chamarémoslle PantallaPause
  • A principal coas opcións de menú. Chamarémoslle PantallaPresentacion
  • A do xogo. Chamarémoslle PantallaXogo.



Como facemos agora para pasar o control a cada unha das pantallas ? Faise a través do método setScreen da clase Game.

Imos facer no noso xogo que o control pase á pantalla de xogo. Podemos facelo de dúas formas:

Opción a): Neste caso creamos un obxecto da clase PantallaXogo e seremos nos dende a clase MeuXogoGame quen chamaremos ó método dispose de dito obxecto. Só instanciamos unha vez cada pantalla de xogo.

  1. package com.plategaxogo2d.angel;
  2.  
  3. import com.badlogic.gdx.Game;
  4. import com.plategaxogo2d.pantallas.PantallaXogo;
  5.  
  6. public class MeuXogoGame extends Game {
  7.  
  8.         private PantallaXogo pantallaxogo;
  9.        
  10.         @Override
  11.         public void create() {
  12.                 // TODO Auto-generated method stub
  13.                
  14.                 pantallaxogo = new PantallaXogo();
  15.                 setScreen(pantallaxogo);
  16.         }
  17.  
  18. }


Opción b): Creamos implicitamente un obxecto de clase PantallaXogo pero non gardamos referencia ningunha a el. Teremos que chamar dende a propia pantalla ó método dispose cando rematemos (cambiemos de pantalla). USAREMOS ESTA OPCIÓN.

  1. package com.plategaxogo2d.angel;
  2.  
  3. import com.badlogic.gdx.Game;
  4. import com.plategaxogo2d.pantallas.PantallaXogo;
  5.  
  6. public class MeuXogoGame extends Game {
  7.  
  8.         @Override
  9.         public void create() {
  10.                
  11.                 setScreen(new PantallaXogo());
  12.         }
  13.  
  14. }


A partir deste momento, o framework páselle o control o método render da clase PantallaXogo e se queda nese método ata que decidamos cambiar de pantalla...

Analizamos agora os métodos implementados na clase PantallaXogo.

  1. package com.plategaxogo2d.pantallas;
  2.  
  3. import com.badlogic.gdx.Screen;
  4. import com.plategaxogo2d.angel.Utiles;
  5.  
  6. public class PantallaXogo implements Screen {
  7.  
  8.         @Override
  9.         public void render(float delta) {
  10.                 // TODO Auto-generated method stub
  11.                
  12.         }
  13.  
  14.         @Override
  15.         public void resize(int width, int height) {
  16.                 // TODO Auto-generated method stub
  17.                 Utiles.imprimirLog("Resize", "RESIZE", "RESIZE");
  18.                
  19.         }
  20.  
  21.         @Override
  22.         public void show() {
  23.                 // TODO Auto-generated method stub
  24.                 Utiles.imprimirLog("PantallaXogo", "SHOW", "SHOW");
  25.         }
  26.  
  27.         @Override
  28.         public void hide() {
  29.                 // TODO Auto-generated method stub
  30.                 Utiles.imprimirLog("PantallaXogo", "HIDE", "HIDE");
  31.                
  32.         }
  33.  
  34.         @Override
  35.         public void pause() {
  36.                 // TODO Auto-generated method stub
  37.                 Utiles.imprimirLog("PantallaXogo", "PAUSE", "PAUSE");
  38.                
  39.         }
  40.  
  41.         @Override
  42.         public void resume() {
  43.                 // TODO Auto-generated method stub
  44.                 Utiles.imprimirLog("PantallaXogo", "RESUME", "RESUME");
  45.                
  46.         }
  47.  
  48.         @Override
  49.         public void dispose() {
  50.                 // TODO Auto-generated method stub
  51.                 Utiles.imprimirLog("PantallaXogo", "DISPOSE", "DISPOSE");
  52.                
  53.         }
  54.  
  55. }

Como vemos son moi parecidos os vistos anteriormente na clase ApplicationAdapter pero con algunha pequena diferenza...

Se executados o proxecto Desktop, por exemplo, aparecerá unha ventá negra (é normal). Se minimizades a ventá e despois pechades o xogo veredes a secuencia de eventos.

LIBGDX xogos2d desenrolo 4.jpg

Como vemos, cando pechamos o xogo non executa o método dispose, se non o método hide. Por qué é así ? Podemos ver que é o que fai a clase Game cando chama o método dispose.

Situar o cursor sobre o nome Game na clase MeuXogoGame, situarvos enriba da parte amarela na ventá que aparece, e premede sobre o botón de Open Declaration...

LIBGDX xogos2d desenrolo 5.jpg

Abrirase unha nova ventá có código de dita clase. Podemos observar o que fai cando se chama ó método dispose...

LIBGDX xogos2d desenrolo 6.jpg


Polo tanto, temos que ser nos o que chamemos a dito método, ou ben dende a clase MeuXogoGame cando se produza o evento de dispose ou ben no método hide, dependendo como chamaramos dende MeuXogoGame a esta pantalla.

Opción a): Para facelo só temos que sobrescribir dito método.

  1. package com.plategaxogo2d.angel;
  2.  
  3. import com.badlogic.gdx.Game;
  4. import com.plategaxogo2d.pantallas.PantallaXogo;
  5.  
  6. public class MeuXogoGame extends Game {
  7.  
  8.         private PantallaXogo pantallaxogo;
  9.        
  10.         @Override
  11.         public void create() {
  12.                 // TODO Auto-generated method stub
  13.                
  14.                 pantallaxogo = new PantallaXogo();
  15.                 setScreen(pantallaxogo);
  16.         }
  17.  
  18.         @Override
  19.         public void dispose(){
  20.                 super.dispose();
  21.                 pantallaxogo.dispose();
  22.         }
  23. }

É IMPORTANTE LEMBRAR QUE SEMPRE TEREMOS QUE SER NOS O QUE DEBEMOS CHAMAR O MÉTODO DISPOSE DA CLASE QUE IMPLEMENTE A INTERFACE SCREEN.

Opción b): A que seguiremos nos.

Clase MeuXogoGame:

  1. package com.plategaxogo2d.angel;
  2.  
  3. import com.badlogic.gdx.Game;
  4. import com.plategaxogo2d.pantallas.PantallaXogo;
  5.  
  6. public class MeuXogoGame extends Game {
  7.  
  8.         @Override
  9.         public void create() {
  10.                
  11.                 setScreen(new PantallaXogo());
  12.         }
  13.  
  14. }

Nesta forma, imos ter que distinguir cando cambiamos de pantalla por ir á pantalla de PAUSA do xogo e cando cambiamos de pantalla por SAÍR do xogo ou por REMATAR o xogo. É dicir. imos ter estas posibilidades:

  • O xogador remata o xogo. Cambiamos á pantalla de HighScores e debemos chamar ó método dispose.
  • O xogador preme o control de saír do xogo. Cambiamos á pantalla PRINCIPAL e debemos chamar ó método dispose.
  • O xogador preme pausa. Cambiamos á pantalla de PAUSE mantendo o estado completo do xogo. Non debemos chamar ó método dispose.
  • EN ANDROID:
  • O xogador preme o botón de cambio de aplicación ou atende a unha chamada. O estado se mantén. Non facemos nada (non imos cambiar de pantalla).
  • O xogador preme o botón de BACK para saír. Cambiamos á pantalla PRINCIPAL e debemos chamar ó método dispose.


Para atender a todas estas posibilidades imos facer uso de tres variables, pausa, sair e finXogo de tipo booleano. A propiedade finXogo será true cando remate o tempo do xogo. Pause e Sair serán utilizadas cando prememos os controis.

Clase PantallaXogo:

  1. public class PantallaXogo implements Screen {
  2.  
  3.         private boolean pause;
  4.         private boolean finxogo;
  5.         private boolean sair;
  6.  
  7.  
  8.         ...........



  • Vos estaredes preguntando, e por que é tan importante o método dispose...? Porque escribiremos nese método as ordes necesarias para liberar da memoria os recursos que teña dita pantalla, como poden ser os gráficos...



Como comentamos anteriormente, imos usar ó método setScreen da clase Game para poder cambiar de pantalla. Agora mesmo, o control está na clase PantallaXogo, no método render. Ó cabo dun tempo quereremos cambiar de pantalla e acceder á pantalla principal, ou a de HighScores ou outra calquera. Como vimos, deberemos chamar ó método setScreen da clase Game, pero isto agora mesmo só o podemos facer dende a clase MeuXogoGame que é a que deriva de Game. Como podemos chamar ó método setScreen dende a clase PantallaXogo ?

Unha forma de facelo é pasando ó constructor da clase PantallaXogo o obxecto que deriva da clase Game da seguinte forma.


Código da clase PantallaXogo:

  1. public class PantallaXogo implements Screen {
  2.  
  3.         private boolean pause;
  4.         private boolean finxogo;
  5.         private boolean sair;
  6.  
  7.         private MeuXogoGame meuxogogame;
  8.        
  9.         public PantallaXogo(MeuXogoGame meuxogogame){
  10.                 this.meuxogogame=meuxogogame;
  11.         }
  12.        
  13.         ..............
  14. }

Código da clase MeuXogoGame:

  1. public class MeuXogoGame extends Game {
  2.  
  3.         @Override
  4.         public void create() {
  5.                 // TODO Auto-generated method stub
  6.                
  7.                 setScreen(new PantallaXogo(this));
  8.         }
  9.  
  10.         @Override
  11.         public void dispose(){
  12.                 super.dispose();
  13.                 Utiles.imprimirLog("MeuXogoGame", "DISPOSE", "DISPOSE");
  14.         }
  15. }

Agora podemos dende a clase PantallaXogo facer uso do obxecto meuxogogame e chamar ó método setScreen para cambiar de pantalla...


TAREFA A REALIZAR: Facer o mesmo que na PantallaXogo e crear o contructor para pasarlle un obxecto da clase MeuXogoGame ás pantallas:

PantallaPresentacion.
PantallaMarcadores.
PantallaPause.


Agora imos crear un novo paquete de nome com.plategaxogo2d.renderer onde van ir as clases necesarias para debuxar cada unha das pantallas. Poderíamos facer unha clase Renderer para cada pantalla pero normalmente a complexidade das pantallas (menos a do xogo) é mínima polo que normalmente só o faremos sobre á do xogo (RendererXogo).

Nota: Loxicamente poderíamos aproveitar as posibilidades da programación orientada a obxectos e facer unha clase con todo o común e herdar dela, pero como estamos a facer unha primeira aproximación a como funciona o framework isto xa quedaría para máis adiante unha vez que teñades soltura no manexo do framework.

Igual que fixemos antes, crearemos un paquete que terá de nome com.plategaxogo2d.renderer. Para crear o paquete prememos o botón dereito sobre o cartafol 'src' do proxecto Xogo2D-Core e escollemos a opción New => Package.

LIBGDX xogos2d desenrolo 7.jpg

  • Dentro de dito paquete creamos unha clase de nome RendererXogo.

Esta clase é a que vai a debuxar todos os elementos gráficos do xogo. Poderíamos facelo na mesma clase PantallaXogo ? Si. Por que non o facemos ? Por facilidade á hora de manter o xogo. Desta forma imos separar a parte de 'Control' da parte de 'Visualización' ou 'Render'.


Lembrar que ata o visto ata aquí, agora mesmo o control do programa se atopa no método render da clase PantallaXogo. É esta clase a que vai recibir o control do programa, a que ten o método resize que se chama de forma automática cando se cambia o tamaño,o método dispose que o temos que chamar nos... o que imos facer será chamar ós métodos da clase RendererXogo que imos usar: dispose, render e resize.

  • Agora temos que chamar a un método da clase RendererXogo de forma continua. Creamos por tanto un método en dita clase. Imos chamarlle render e vai levar un parámetro de tipo float de nome delta (xa falaremos para que serve).
  • Imos definir un método de nome dispose no que poñeremos o código necesario para liberar á memoria dos recursos utilizados pola clase RendererXogo.
  • Imos definir un método resize que levará dous parámetros (width e height de tipo int) no que modificaremos o tamaño da cámara se é necesario(o veremos posteriormente).

Código da clase RendererXogo:

  1. package com.plategaxogo2d.renderer;
  2.  
  3. public class RendererXogo {
  4.  
  5.         /**
  6.          * Debuxa todos os elementos gráficos da pantalla
  7.          * @param delta: tempo que pasa entre un frame e o seguinte.
  8.          */
  9.         public void render(float delta){
  10.  
  11.         }
  12.         public void resize(int width, int height) {
  13.  
  14.                
  15.         }
  16.         public void dispose(){
  17.                
  18.         }
  19. }


Agora dende a PantallaXogo crearemos un obxecto de dita clase e chamaremos ós métodos render, dispose e resize.

Código da clase PantallaXogo:

  1. package com.plategaxogo2d.pantallas;
  2.  
  3. import com.badlogic.gdx.Screen;
  4. import com.plategaxogo2d.angel.MeuXogoGame;
  5. import com.plategaxogo2d.renderer.RendererXogo;
  6.  
  7. public class PantallaXogo implements Screen {
  8.         private boolean pause;
  9.         private boolean finXogo;
  10.         private boolean sair;
  11.  
  12.         private MeuXogoGame meuxogogame;
  13.         private RendererXogo rendererxogo;
  14.        
  15.         public PantallaXogo(MeuXogoGame meuxogogame){
  16.                 this.meuxogogame=meuxogogame;
  17.                 rendererxogo=new RendererXogo();
  18.         }
  19.        
  20.         @Override
  21.         public void render(float delta) {
  22.                 // TODO Auto-generated method stub
  23.  
  24.                 rendererxogo.render(delta);
  25.         }
  26.  
  27.         @Override
  28.         public void resize(int width, int height) {
  29.                 // TODO Auto-generated method stub
  30.                 rendererxogo.resize(width, height);            
  31.         }
  32.  
  33.         @Override
  34.         public void show() {
  35.                 // TODO Auto-generated method stub
  36.         }
  37.  
  38.         @Override
  39.         public void hide() {
  40.                 // TODO Auto-generated method stub
  41.                
  42.         }
  43.  
  44.         @Override
  45.         public void pause() {
  46.                 // TODO Auto-generated method stub
  47.                
  48.         }
  49.  
  50.         @Override
  51.         public void resume() {
  52.                 // TODO Auto-generated method stub
  53.                
  54.         }
  55.  
  56.         @Override
  57.         public void dispose() {
  58.                 // TODO Auto-generated method stub
  59.  
  60.                 rendererxogo.dispose();
  61.         }
  62.  
  63. }

Neste punto podedes facer unha copia de todos os proxectos e así tedes unha copia para restaurar ademais de ter unha base para empezar outro xogo.



-- Ángel D. Fernández González -- (2015).