Tutorial Aplikasi Touch Sensor Pada Android berbasis Adobe Air

Salah satu fasilitas yang sangat umum dijumpai pada smartphone berbasis android adalah touch sensor pada layar. Selain Touch ada juga fasilitas yang dinamakan gesture yaitu kombinasi penekanan beberapa jari untuk mendapatkan efek tertentu.  Kali ini kita akan bermain-main dengan fasilitash touch dan drag. Seperti pada pembahasan sebelumnya, adobe air besutan pengembang Adobe memiliki keunggulan pada kemudahan desain yang bisa dibilang 10x lebih mudah jika dibanding dengan SDK asli yang berbasis eclipse-java.

klik pada gambar untuk melihat lebih jelas

Sebelum memulai ada baiknya melihat pembahasan sebelumnya karena beberapa pembahasan yang serupa akan di lewati. Langkah awal yang kita buat adalah sebuah lingkaran atau bentuk geometri lain. Bentuk geometri ini nantinya akan digerak-gerakkan oleh jari-jemari. Pada contoh yang dibuat penulis, bentuk geometry berupa lingkaran dan memiliki animasi lingkaran luar yang mengembang-kempis. Jangan lupa untuk merubah bentuk geometri ini menjadi movieclip agar bisa dipanggil sebagai library class , seperti contoh pada gambar dibawah.

Cara penamaan class adalah dengan melakukan click kanan pada nama library lingkaran tadi kemudian pilih properties, atau bisa juga pada saat merubah kedalam movieclip. Beri nama class sesuai keinginan.

Pada gambar diatas adalah contoh membuat animasi lingkaran kembang-kempis dengan menggunakan tweening. Proses twieen akan secara otomatis membuat animasi sesuai perubahan antara key frame start dan key frame selanjutnya, tanpa harus merubah gambar pada semua frame.

Selanjutnya kita akan menuju ke scripting. Class yang paling penting dalam pemrograman touch sensor adalah :

Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

Selanjutnya experimen pertama adalah dengan menampilkan gambar lingkaran setiap kali layar ditekan. Script nya seperti dibawah ini:

Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 



function mulai(evt:TouchEvent):void{


bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;

}

Jika ingin mempublish ke HandHeld Android kamu, sebaiknya baca dulu pembahasan sebelumnya disini

Hasil dari script pertama adalah munculnya gambar lingkaran setiap kali layar ditekan. Bagaimana jika kita ingin menghilangkan lingkaran saat jari diangkat dari layar ? ubah scriptnya seperti ini :

Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 
stage.addEventListener(TouchEvent.TOUCH_END, selesai);


function mulai(evt:TouchEvent):void{

if(bola == null){

bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;
}


}


function selesai(evt:TouchEvent) {
 
 removeChild(bola);
 bola=null;
 
}

Well...kenapa tidak kita gerak-gerakkan saja lingkaran ini ? Hajar saja bos !!

Multitouch.inputMode=MultitouchInputMode.TOUCH_POINT; 

var bola:lingkaran;

stage.addEventListener(TouchEvent.TOUCH_BEGIN, mulai); 
stage.addEventListener(TouchEvent.TOUCH_END, selesai);
stage.addEventListener(TouchEvent.TOUCH_MOVE, gerak); 



function mulai(evt:TouchEvent):void{

if(bola == null){

bola=new lingkaran;
addChild(bola);

bola.x=evt.stageX;
bola.y=evt.stageY;
}


}

function gerak(evt:TouchEvent) {
 
bola.x=evt.stageX;
bola.y=evt.stageY;
 
}

function selesai(evt:TouchEvent) {
 
 removeChild(bola);
 bola=null;
 
}

MUDAH BUKAN ?   untuk file tutorial selengkapnya (adobe flash cs5.5) dapat didownload disini