LIBGDX TextureAtlas

De MediaWiki
Saltar a: navegación, buscar

UNIDADE 3: TextureAtlas

Introdución

Nota: Esta explicación está relacionada cos gráficos.




Información da wiki: https://github.com/libgdx/libgdx/wiki/Texture-packer

Información da clase TextureAtlas: http://libgdx.badlogicgames.com/nightlies/docs/api/com/badlogic/gdx/graphics/g2d/TextureAtlas.html.

Cando cargamos os gráficos do noso xogo estamos accedendo a disco por cada un deles. Existe unha forma máis óptima de carga que consiste en cargar todos os gráficos de vez.


Para facelo o proceso é o seguinte:

  • Primeiro temos que deixar nun cartafol todos os gráficos que queiramos xuntar.
  • Cun programa externo ou cunha ferramenta de Libgdx indicámoslle onde se atopan os gráficos a xuntar (o cartafol) e cal vai ser o cartafol de saída. Esta ferramenta ten, entre os seus parámetros, o ancho e alto do arquivo de saída, pudendo dar como resultado máis dun arquivo de saída. O resultado de executar esta ferramenta serán dous arquivos:
Un arquivo gráfico onde estean todos os gráficos xuntos.
Un arquivo de texto cunha extensión .atlas (se pode editar) onde estean recollidas as coordenadas de cada un dos gráficos 'soltos' e o seu nome para poder referencialo (coincide có nome individual, o que tiña antes de xuntalo).
  • Dende Libgdx, unha vez cargado o atlas, podemos referenciar cada un dos gráficos utilizando unha clase TextureRegion en vez da clase Textura utilizada ata o de agora.

Ferramenta para crear o Atlas

  • No mercado existen varias ferramentas que fan o que necesitamos, como por exemplo:
http://www.codeandweb.com/texturepacker/download
http://renderhjs.net/shoebox/
  • TexturePacker: Ferramenta do propio Libgdx que ven dentro dun paquete de aplicacións.

Neste manual vou explicar a ferramenta do Libgdx.

Dende terminal / consola

Necesitamos instalar un conxunto de ferramentas que veñen nun paquete de nome GDX-TOOLS.

O proceso para instalalo é moi simple grazas a Gradle e a súa forma de tratar as dependencias.



Tamén podemos descargalo directamente cando xeramos o proxecto coa ferramenta de xeración de proxectos, marcando la opción GDX-TOOLS.

Graficamente


Podemos descargar a ferramenta dende este enlace: https://code.google.com/p/libgdx-texturepacker-gui/

Proceso para crear o Atlas

Dende consola / terminal


  • Debemos crear unha clase de nome XerarGraficos có método main no proxecto Desktop.
LIBGDX UD3 TextureAtlas 7.JPG


  • Escribiremos este código:
  1. import com.badlogic.gdx.tools.texturepacker.TexturePacker;
  2.  
  3. public class XerarGraficos {
  4.  
  5.         public static void main(String[] args) {
  6.                 // TODO Auto-generated method stub
  7.  
  8.                 TexturePacker.process("C:\\temporal\\in", "C:\\temporal\\out", "packimaxes");
  9.         }
  10.  
  11. }

O método process leva tres parámetros. O cartafol onde están os gráficos a xuntar, o cartafol onde vai xerar o atlas, e o nome do atlas e arquivo gráfico xerado.

Importante: Necesitamos poñer a dobre barra xa que é un caracter de escape.

  • Executamos a clase e teremos de saída o atlas.
Exemplo de saída do arquivo gráfico
LIBGDX UD3 TextureAtlas 8.png


Exemplo de saída do arquivo .atlas
  1. packimaxes.png
  2. size: 435,126
  3. format: RGBA8888
  4. filter: Nearest,Nearest
  5. repeat: none
  6. LIBGDX_itin1_alien
  7.   rotate: false
  8.   xy: 56, 3
  9.   size: 26, 22
  10.   orig: 26, 22
  11.   offset: 0, 0
  12.   index: -1
  13. LIBGDX_itin1_alien_dead
  14.   rotate: false
  15.   xy: 322, 49
  16.   size: 26, 22
  17.   orig: 26, 22
  18.   offset: 0, 0
  19.   index: -1

Fixarse como o único que ten este arquivo son o conxunta de nomes que tiñan os arquivos gráficos individuais e a súa posición e tamaño.

Graficamente

Executaremos a ferramenta previamente descargada.

LIBGDX UD3 TextureAtlas 9.jpg

Só debemos de seguir os pasos indicados:

  • Crear un novo pack.
  • Escoller o cartafol onde están os gráficos a empaquetar (input).
  • Escoller o cartafol de saída (output).
  • Premer o botón Pack´em all.


Dará como resultado o mesmo que a opción de consola explicada anteriormente.

Uso do Atlas

Temos que copiar os dous arquivos xerados ó cartafol assets da versión Android.

O proceso de carga do atlas será:

  • Definir as clases que imos utilizar.
Para o caso do atlas vai ser a clase TextureAtlas.
Para o caso dos gráficos individuais vai ser a clase TextureRegion.
  1.         private static TextureAtlas texturas_todas;
  2.         public static TextureRegion textureAlien;  
  3.         public static TextureRegion textureNave;
  • Cargamos o atlas e as textureregion:
  1.                 texturas_todas = new TextureAtlas("packimaxes.atlas");
  2.  
  3.                 textureAlien = texturas_todas.findRegion("LIBGDX_itin1_alien");
  4.                 textureNave = texturas_todas.findRegion("LIBGDX_itin1_nave");
Nota: Fixarse como para referenciar as rexións non necesitamos escribir a extensión dos arquivos, só o seu nome (no exemplo: LIBGDX_itin1_alien)
  • Agora as debuxamos como sempre:
  1.         @Override
  2.         public void render () {
  3.                 Gdx.gl.glClearColor(1, 0, 0, 1);
  4.                 Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
  5.                 batch.begin();
  6.                 batch.draw(textureAlien, 0, 0);
  7.                 batch.draw(textureNave, 100, 100);
  8.                 batch.end();
  9.                
  10.         }
  • Liberamos o atlas, as textureregion non fai falla.
Nota: Lembrar que se estades a desenvolver o xogo do manual, a liberación das texturas (neste caso do atlas) se fai no método liberarTexturas da clase AssetsXogo.
  1.         @Override
  2.         public void dispose(){
  3.                 if (texturas_todas!=null)
  4.                         texturas_todas.dispose();
  5.         }

Exemplo de código

Deberedes de cambiar a clase co que inician as diferentes plataformas pola seguinte:

Un exemplo completo baseado no xogo desenvolto.

  • Descargade e descomprimide o arquivo seguinte. Copialo ó cartafol assets do proxecto Android.

Media:LIBGDX_textureAtlas.zip

  • Crear unha nova clase.

Código da clase TextureAtlasCarga
Obxectivo: amosar como utilizar un Atlas

  1. package com.plategaxogo2davanz.angel;
  2.  
  3. import com.badlogic.gdx.ApplicationAdapter;
  4. import com.badlogic.gdx.Gdx;
  5. import com.badlogic.gdx.graphics.GL20;
  6. import com.badlogic.gdx.graphics.g2d.SpriteBatch;
  7. import com.badlogic.gdx.graphics.g2d.TextureAtlas;
  8. import com.badlogic.gdx.graphics.g2d.TextureRegion;
  9.  
  10. public class TextureAtlasCarga extends ApplicationAdapter {
  11.         SpriteBatch batch;
  12.        
  13.         private static TextureAtlas texturas_todas;
  14.         public static TextureRegion textureAlien;  
  15.         public static TextureRegion textureNave;
  16.            
  17.         @Override
  18.         public void create () {
  19.                 batch = new SpriteBatch();
  20.                
  21.                 texturas_todas = new TextureAtlas("packimaxes.atlas");
  22.  
  23.                 textureAlien = texturas_todas.findRegion("LIBGDX_itin1_alien");
  24.                 textureNave = texturas_todas.findRegion("LIBGDX_itin1_nave");
  25.                
  26.                
  27.         }
  28.  
  29.         @Override
  30.         public void render () {
  31.                 Gdx.gl.glClearColor(1, 0, 0, 1);
  32.                 Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
  33.                 batch.begin();
  34.                 batch.draw(textureAlien, 0, 0);
  35.                 batch.draw(textureNave, 100, 100);
  36.                 batch.end();
  37.                
  38.         }
  39.  
  40.         @Override
  41.         public void dispose(){
  42.                 if (texturas_todas!=null)
  43.                         texturas_todas.dispose();
  44.         }
  45. }


TAREFA OPTATIVA A FACER






TAREFA OPTATIVA A FACER: Modifica a clase AssetsXogo para cargar os gráficos do xogo utilizando un atlas.
Nota:

  • Lembra borrar do cartafol assets todos os gráficos que estean no atlas xa que non os vas necesitar.
  • Lembra modificar ó método dispose para liberar o atlas.




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