bytes.cat

La wiki d'FP d'informàtica

Eines de l'usuari

Eines del lloc


jocs_libgdx

Diferències

Ací es mostren les diferències entre la revisió seleccionada i la versió actual de la pàgina.

Enllaç a la visualització de la comparació

Ambdós costats versió prèvia Revisió prèvia
Següent revisió
Revisió prèvia
jocs_libgdx [2024/04/09 16:31]
enric_mieza_sanchez [Comunicacions]
jocs_libgdx [2025/02/26 22:31] (actual)
enric_mieza_sanchez [Controls Touchscreen]
Línia 3: Línia 3:
  
 En aquest article utilitzarem una llibreria específica, libGDX per realitzar el joc. Aquesta té molts avantatges, sobretot que permet compilar en diverses plataformes (Android, Desktop, iOS, HTML). A més, ens permetrà utilitzar recursos gràfics específics que ens facilitaran operacions complexes en 2D i 3D amb acceleració OpenGL. En aquest article utilitzarem una llibreria específica, libGDX per realitzar el joc. Aquesta té molts avantatges, sobretot que permet compilar en diverses plataformes (Android, Desktop, iOS, HTML). A més, ens permetrà utilitzar recursos gràfics específics que ens facilitaran operacions complexes en 2D i 3D amb acceleració OpenGL.
- +{{ libgdx.png?250 }}
 {{tag> #FpInfor #Dam #DamMp08 #DamMp08Uf3 #DamMp08Uf03 jocs games}} {{tag> #FpInfor #Dam #DamMp08 #DamMp08Uf3 #DamMp08Uf03 jocs games}}
  
  
 Enllaços: Enllaços:
-  - [[libGDX Comunicacions]] en aquesta wiki.+  - [[libGDX Comunicacions]] per a crides HTTP i websockets (en aquesta wiki). 
 +  - [[libGDX Stage]] per a objectes de la llibreria Scene2D (en aquesta wiki).
   - [[https://github.com/libgdx/libgdx/wiki|Documentació libGDX]].   - [[https://github.com/libgdx/libgdx/wiki|Documentació libGDX]].
   - [[https://libgdx.com/dev/project_generation/|Descàrrega eina per iniciar projectes]].   - [[https://libgdx.com/dev/project_generation/|Descàrrega eina per iniciar projectes]].
Línia 22: Línia 22:
  
 ==== Troubleshooting ==== ==== Troubleshooting ====
 +
 +<WRAP alert>
 +**Aquest problema està DEPRECATED i només succeïa en versions anteriors**.
 +
 +Ho deixem aquí com a //reminder// per problemes futurs.
 +
 Si t'apareix l'[[https://stackoverflow.com/questions/70340427/unable-to-find-method-void-org-apache-commons-compress-archivers-zip-zipfile|error relacionat amb la llibreria ZIP]] tens 2 opcions: Si t'apareix l'[[https://stackoverflow.com/questions/70340427/unable-to-find-method-void-org-apache-commons-compress-archivers-zip-zipfile|error relacionat amb la llibreria ZIP]] tens 2 opcions:
   - Eliminar la compilació de la plataforma iOS.   - Eliminar la compilació de la plataforma iOS.
Línia 27: Línia 33:
 buildToolsVersion "33.0.0" buildToolsVersion "33.0.0"
 </file> </file>
 +</WRAP>
 +
 +\\
 +
 +===== Definicions =====
 +Objectes principals del //framework//:
 +  * ''Game'': classe principal del joc, contenidor de pantalles.
 +  * ''Screen'': hi encapsulem una pantalla (game over, presentació, etc.), nivell, minijoc. Cadascuna és independent de l'altra.
 +  * ''OrtographicCamera'': objecte per traduir coordenades. Pot servir per adaptar tamanys de pantalla o per projectar en 2D una imatge 3D.
 +  * ''SpriteBatch'': objecte per pintar //sprites// (imatges, animacions).
 +  * ''ShapeRenderer'': objecte per pintar formes geomètriques (cercles, el·lipses, rectangles, triangles, etc.
 +  * ''BitmapFont'': objecte per pintar lletres.
 +  * ''Texture'': imatge.
 +  * ''TextureRegion'': fragment d'una imatge.
 +  * ''Animation'': objecte per gestionar les animacions i //spritesheets//.
 +  * ''Actor'': objecte tipus //widget//, que pot ser alhora un element gràfic i una entrada de dades. Exemples: Button, Dialog, TextInputListener, etc.
 +  * ''Stage'': objecte per renderitzar ''Actors''.
 +  * ''Skin'': conjunt de imatges i fonts per renderitzar ''Actors''. Imprescindible si es vol emprar ''Actor'' i ''Stage''.
  
 \\ \\
Línia 203: Línia 227:
 // TextureRegion ens permet retallar un fragment de la Texture // TextureRegion ens permet retallar un fragment de la Texture
 // retallem el fragment de background des de la posició del personatge (posx, posy) // retallem el fragment de background des de la posició del personatge (posx, posy)
-bgRegion.setRegion(posx,posy,game.SCR_WIDTH,game.SCR_HEIGHT);+bgRegion.setRegion( (int)posx, (int)posy, 
 +                    (int)game.SCR_WIDTH, (int)game.SCR_HEIGHT );
  
 // (2) PINTAR // (2) PINTAR
Línia 214: Línia 239:
 game.batch.end(); game.batch.end();
 </code> </code>
 +
 +<WRAP important>
 +ULL amb la funció [[https://javadoc.io/doc/com.badlogicgames.gdx/gdx/1.4.0/com/badlogic/gdx/graphics/g2d/TextureRegion.html|TextureRegion.setRegion]] ja que té 2 variants que no son iguals:
 +  * ''TextureRegion.setRegion(int x, int y, int width, int height)'': retalla en píxels i coordenades estàndard.
 +  * ''TextureRegion.setRegion(float u, float v, float u2, float v2)'': retalla en base a u,v que son coordenades de textura, normalment entre 0 i 1.
 +
 +Només que un dels paràmetres sigui un ''float'' el compilador emprarà la 2a funció (u,v) amb resultats força inesperats.
 +</WRAP>
  
 {{ietiwalk.gif}} {{ietiwalk.gif}}
Línia 294: Línia 327:
 \\ \\
  
-===== Controls Touchscreen ===== +===== Controls - Inputs ===== 
-Els controls d'entrada al joc poden ser molts+Els controls d'entrada al joc poden ser diversos
-  * Teclat (només per versions Desktop) +  * Teclat (per versions Desktop) 
-  * Pantalla+  * Pantalla (touch)
   * Acceleròmetre   * Acceleròmetre
   * Brúixola/Giròscop   * Brúixola/Giròscop
  
-Convé llegir la [[https://libgdx.com/wiki/input/polling|documentació dels controls en libGDX]].+Hi ha 2 estratègies importants per gestionar els //inputs//: 
 +  * [[https://libgdx.com/wiki/input/polling|Polling]]: durant el ''render'' podem decidir "sondejar" l'estat del dispositius. 
 +  * [[https://libgdx.com/wiki/input/event-handling|Events]]: quan es dispara un event (touchDown, keyUp, etc.) es crida a una //callback//
 + 
 + 
 +Per saber les tecles que s'han premut consulta els [[https://javadoc.io/doc/com.badlogicgames.gdx/gdx/latest/com/badlogic/gdx/Input.Keys.html|Key Code]].
  
  
Línia 368: Línia 406:
  
 ===== Ortographic Camera ===== ===== Ortographic Camera =====
-Tal i com explica el tutorial del Drop Game, la ''OrtographicCamera'' ens facilitarà la traducció entre les coordenades que hem definit pel joc les coordenades reals del dispositiu, que pot ser molt diferent.+Tal i com explica el tutorial del Drop Game, la ''OrtographicCamera'' ens facilitarà la traducció entre les coordenades que hem definit pel joc (o "coordenades virtuals") i les coordenades reals del dispositiu (//device//), que poden tenir dimensions diferents. A més, al treballar amb una llibreria multiplataforma, voldrem fer un sol joc a la carpeta ''core/'', i el codi de les carpetes de les plataformes (''android/'', ''ios/'', ''html/'') haurà de ser fix (no hem de repetir el joc a cada plataforma).
  
 +Les operacions que realitzarà la càmera seran:
 +  Coordenades virtuals -> project -> Coordenades reals (//device//)
 +  Coordenades virtuals <- unproject <- Coordenades reals (//device//)
 +
 +Posant que volem una pantalla de 800x480
 +
 +<file java DesktopLauncher.java>
 +public class DesktopLauncher {
 +    public static void main (String[] arg) {
 +        Lwjgl3ApplicationConfiguration config = new Lwjgl3ApplicationConfiguration();
 +        config.setWindowedMode(480, 800);
 +</file>
 +
 +A l'arxiu de ''Game'' o ''Screen'':
 +
 +<code java>
 +public final int GAME_WIDTH = 800;
 +public final int GAME_HEIGHT = 480;
 +
 +public void create() {
 +        camera = new OrthographicCamera();
 +        camera.setToOrtho(false, GAME_WIDTH, GAME_HEIGHT);
 +        
 +        //...
 +}
 +</code>
 +
 +Per fer que el ''SpritBatch'' tradueixi automàticament en totes les accions de dibuix, el configurarem a l'inici del ''render()'': 
 +
 +<code java>
 +public void render() {
 +        camera.update();
 +        spriteBatch.setProjectionMatrix(camera.combined);
 +        
 +        //...
 +}
 +</code>
 +
 +Si estem capturant entrades de la pantalla, caldrà la operació contrària: ''unproject()''
 +
 +<code java>
 +protected int virtual_joystick_control() {
 +    // iterar per multitouch
 +    // cada "i" és un possible "touch" d'un dit a la pantalla
 +    for(int i=0;i<10;i++)
 +    if (Gdx.input.isTouched(i)) {
 +        Vector3 touchPos = new Vector3();
 +        touchPos.set(Gdx.input.getX(i), Gdx.input.getY(i), 0);
 +        // traducció de coordenades reals (depen del dispositiu) a 800x480
 +        game.camera.unproject(touchPos);
 +        // les dades convertides s'enregistren a la mateixa variable touchPos
 +        //...
 +</code>
 +
 +\\
 +
 +===== Actors, Scenes i Skins =====
 +Per fer controls avançats com Buttons, Dialogs, etc. hem de tenir en compte que son elements tant de renderització com de entrada de dades, i es tracten de forma especial. En caldrà emprar els objectes ''Stage'' i ''Skin'':
 +
 +Algunes referències:
 +  * [[https://stackoverflow.com/questions/33062574/how-to-properly-implement-a-dialog-box-using-libgdx|Com fer un Dialog]].
 +  * [[https://github.com/BlueBoxWare/LibGDXPlugin|libGDX plugin per IntelliJ (Android Studio)]]
 +  * [[https://github.com/libgdx/libgdx-skins/tree/master/skins|Skins bàsics]]
 +  * [[https://github.com/czyzby/gdx-skins|Mes skins]]
 +
 +IMPORTANT: perquè funcioni el skin cal descarregar tots els arxius a la carepta assets.
 +
 +\\
  
jocs_libgdx.1712680310.txt.gz · Darrera modificació: 2024/04/09 16:31 per enric_mieza_sanchez