Scene2D: DragDrop

Lanjutan dari tutorial tentang menangani event touch di actor.

Scene2D sebenarnya telah menyediakan class untuk dragdrop. Tapi dokumentasinya terbatas dan ada bug saat saya coba. Jadi dalam tutorial ini kita akan buat sendiri.

Misalnya kita akan membuat actor bergerak saat user melakukan touch-drag. Maka yang terpikir pertama adalah code sebagai berikut (code merupakan lanjutan dari tutorial sebelumnya):

public void touchDragged (InputEvent event, float x,float y, int pointer) {
	Gdx.app.log("yw","touch dragged x="+x+" y="+y);
	setPosition(x, y);
}

Coba jalankan maka hasilnya akan salah. Mengapa? karena koordinat touch menggunakan koordinat actor yang berbeda dengan koordinat layar. Koordinat 0,0 pada touch adalah kiri bawah actor sedangkan koordinat 0,0 pada layar adalah kiri bawah layar. Solusinya adalah mengambil koordinat layar actor dengan event.getStageX() dan event.getStageY().

public void touchDragged (InputEvent event, float x,float y, int pointer) {
      Gdx.app.log("yw","touch dragged x="+x+" y="+y);
      setPosition(event.getStageX(), event.getStageY());
}

Jalankan, hasilnya akan lebih baik. Tetapi masih ada yang aneh, posisi kiri-bawah actor seolah-olah “loncat” mengikuti posisi touch. Mengapa? Karena kita harus memperhitungkan posisi relatif touch pada saat pertama kali menyentuh actor. Solusinya, tambahkan pencatatan koordinat actor pada saat touch dan perhitungkan saat di drag.

     float xAwal,yAwal;
     public boolean touchDown (InputEvent event, float x, float y, int pointer, int button) {
	  Gdx.app.log("yw","touch down; pointer="+pointer);
	  //posisi relatif saat touch pertama berlangsung
          xAwal = event.getStageX() - getX();
          yAwal = event.getStageY() - getY();
	  return true;
      }

      public void touchDragged (InputEvent event, float x, float y, int pointer) {
	   Gdx.app.log("yw","touch dragged x="+x+" y="+y);
	   setPosition(event.getStageX()-xAwal, event.getStageY()-yAwal);
      }

Jalankan dan proses drag akan berjalan sesuai yang diinginkan.

Selanjutnya akan dibahas tutorial mengenai dragdrop ditambah dengan snap source saat sudah mendekati target.

Leave a Reply

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

Time limit is exhausted. Please reload CAPTCHA.