LibGDX: Menangani multi resolusi

Catatan: Ini kelanjutan setelah posting tentang instalasi LibGDX di Android Studio. Alternatif lain yang mungkin lebih mudah adalah menggunakan Scene2D

Jika kita coba code standard yang dihasilkan oleh libGDX, code tsb menghasilkan tampilan yang berbeda pada device yang memiliki resolusi berbeda. Untuk menghindari hal ini, dapat digunakan OrthographicCamera. Silahkan lihat code berikut beserta komentar di dalamnya. Yang perlu diperhatikan adalah koordinat yang digunakan dan acuan posisi sprite. Gambar berikut mengilustrasikan objek kotak berukuran 500×500 yang diletakan pada “dunia” dengan ukuran 1794 x 885.


package edu.upi.cs.yudiwbs.libgdx;

import com.badlogic.gdx.ApplicationAdapter;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.graphics.Color;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.OrthographicCamera;
import com.badlogic.gdx.graphics.Pixmap;
import com.badlogic.gdx.graphics.Texture;
import com.badlogic.gdx.graphics.g2d.Sprite;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;

public class Coba1 extends ApplicationAdapter {
	SpriteBatch batch;
	Texture img;

    //resoulsi nexus 1794 x 885
    private float wWorld = 1794;
    private float hWorld = 885;

    //ukuran kotak
    private int  wBox = 500;
    private int  hBox = 500;
    private Pixmap pm;
    private Sprite sp;
    private OrthographicCamera camera;

	@Override
	public void create () {

        camera = new OrthographicCamera(wWorld, hWorld);
       	batch = new SpriteBatch();

        //siapkan gambar kotak berwarna merah dengan line hitam
        pm  = new Pixmap(wBox,hBox,Pixmap.Format.RGBA8888);
        pm.setColor(Color.RED);
        pm.fill();
        pm.setColor(Color.BLACK);
        pm.drawRectangle(0,0, pm.getWidth(), pm.getHeight());

        //buat texture dari pixmap, kemudian buat sprite
        img = new Texture(pm);
        pm.dispose(); //!! harus ada
        sp = new Sprite(img);
        sp.setSize(wBox,hBox);
	}

	@Override
	public void render () {
        Gdx.gl.glClearColor(1, 1, 1, 1);
        Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
        batch.setProjectionMatrix(camera.combined);
        batch.begin();
        /*
        set posisi, ingat posisi sprite dihitung dari kiri-bawah.
        Koordinat layar menggunakan koordinat kartesian dengan 0,0 berada di tengah
        karena ukuran dunia adalah 1794 x 885 maka nilai x minimum adalah -(1794/2) = -897
        sedangkan nilai x maksimum adalah 897.
        Lalu nilai y minimum adalah -(885/2) = -442.5 dan y maksimum 442.5

        Karena ukuran objek 500x500, agar objek berada di tengah  
        maka kotak diletakan di posisi (-250,-250). Ingat posisi acuan adalah kiri bawah
        */
        sp.setPosition(-(wBox/2f), -(hBox/2f));
        sp.draw(batch);
        batch.end();
	}
}

Agar versi desktop mempunyai rasio yang sama, buka file DesktopLauncher di direktori /desktop/java dan masukan code berikut:

public static void main (String[] arg) {
		LwjglApplicationConfiguration config = new LwjglApplicationConfiguration();
        int  wWord = 1794;
        int hWord = 885;
        config.height = hWord;
        config.width = wWord;
		new LwjglApplication(new Coba1(), config);
	}

Jika dijalankan untuk Android, hasilnya dapat dilihat seperti ini (Nexus 5, Android One dan Nexus 7):

Catatan:
SpriteBatch menyimpan semua perintah menggambar antara batch.begin() dan batch.end(). Saat end() dipanggil, semua perintah tersebut disubmit sekaligus sehingga mempercepat proses render. Untuk jumlah sedikit mungkin tidak terlalu terlihat perbedaan kinerjanya, tapi saat sprite mencapai ratusan akan terlihat bedanya.

Texture vs Sprite: Texture adalah gambar (misal png) yang didecode dan masuk ke memori GPU (Graphics Processing Unit). Sprite tidak hanya menyimpan gambar tetapi juga menyimpan informasi tambahan seperti posisi dan rotasi. Texture harus di-dispose secara manual dengan memanggil dispose(), sedangkan Sprite tidak perlu karena hanya merefer texture.

Lanjutan: animasi sederhana

2 comments on “LibGDX: Menangani multi resolusi

Leave a Reply

Your email address will not be published. Required fields are marked *

Time limit is exhausted. Please reload CAPTCHA.