【libGDX入門】TextureAtlasを使う【TexturePacker】

TextureAtlasの生成方法とlibGDXでの読み込み方法について紹介します。テクスチャアトラス(TextureAtlas)とは複数の画像をひとつに結合し、読み込み時間や描画の効率化を行うための仕組みです。

TexturePackerを使ってTextureAtlasを作る

まず、複数の画像からTextureAtlasを作り出すためのツールであるTexturePackerを以下のリンクからダウンロードしてインストールします。

TexturePacker - Create Sprite Sheets for your game!

起動時にデータ形式について聞かれるので、libGDXを選択。
f:id:ttlg:20151103153103p:plain

まず右のメニューから、Trim modeをNoneに設定。
その後、アトラス化したい画像を真ん中にドラッグアンドドロップして追加。
f:id:ttlg:20151103153113p:plain
終わったら上のメニューから、Publish sprite sheetをクリックして、出力先のフォルダを決定する。

以下の画像が今回アトラス化した画像二枚です。
left.png
f:id:ttlg:20151103153148p:plain
right.png
f:id:ttlg:20151103153142p:plain

そして出力されたアトラスが以下になります。
atlas.png
f:id:ttlg:20151103153137p:plain
atlas

atlas.png
format: RGBA8888
filter: Linear,Linear
repeat: none
left
  rotate: false
  xy: 2, 2
  size: 128, 128
  orig: 128, 128
  offset: 0, 0
  index: -1
right
  rotate: false
  xy: 132, 2
  size: 128, 128
  orig: 128, 128
  offset: 0, 0
  index: -1

TextureAtlasからテクスチャの一部を読み込む

作ったアトラスはテキストファイルと画像ファイル両方ともAndroid/assetsフォルダにいれておきます。
f:id:ttlg:20151103155143p:plain

アトラスの読み込みは簡単です。 TextureAtlasクラスにファイルパスを与えれば完了。

public class MyGdxGame extends ApplicationAdapter {
    private SpriteBatch batch;
    TextureAtlas atlas;
    TextureRegion left;
    TextureRegion right;

    public void create () {
        batch = new SpriteBatch();
        atlas = new TextureAtlas(Gdx.files.internal("atlas"));
        left = atlas.findRegion("left");
        right = atlas.findRegion("right");
    }

    public void render () {
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
        Gdx.gl.glClearColor(1,1,1,1);
        batch.begin();
        batch.draw(left, 100, 100);
        batch.draw(right, 100, 300);
        batch.end();
    }
    public void dispose(){
        atlas.dispose();
    }
}