Jika pada tutorial yang lalu kita sudah sedikit
menyinggung soal GESTURE.SWIPE untuk menjalankan tween didalam movieClip. Nah,
sekarang kita akan membuat simple gallery untuk aplikasi Android yang bisa anda
gunakan untuk menampilkan berbagai konten. Oke, langsung saja buka lembar kerja
Flash Anda!
Pertama, buat lembar kerja AIR for Android. Buatlah
movieClip dengan ketentuan sebagai berikut:
Jika objek sudah jadi, klik kanan dan convert to symbol. Pilih
movie clip. setelah itu, masuklah kedalam lembar kerja movie clip yang baru
saja kita buat. Kita akan menambahkan konten-konten baru! perhatikan ilustrasi
berikut:
Pada contoh ini, kita akan memakai 5 konten! Jadi,
buatlah 5 konten didalam movieclip dengan cara seperti tergambar di atas. Jika sudah,
keluar dari lembar kerja movieclip dengan cara doble klik di luar objek atau
cukup dengan klik Scene 1 yang berada di samping Symbol 1. Berikan nama movie
clip tersebut dengna nama “container”.
Setelah itu, tuliskan script berikut pada frame 1:
import
flash.events.TransformGestureEvent;
var
item_tampil:Number = 1;// pertama ditampilkan item ke-1..
var
total_item:Number = 4;// jumlah konten yang kita buat..
Multitouch.inputMode
= MultitouchInputMode.GESTURE;
function
geser_layar(event:TransformGestureEvent):void
{
if (event.offsetX == 1)
{
if (item_tampil>1)
{
item_tampil--;
trace("geser
kanan");
}
}else if(event.offsetX==-1)
{
if(item_tampil<total_item)
{
item_tampil++;
trace("gser kiri");
}
}
}
stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE,geser_layar);
Sampai disini, lakukan test movie dan aktifkan Touch
Screen untuk GESTURE SWIPE. Jika benar, maka ketika dilakukan geser maka akan
muncuk kalimat “Geser Kanan” atau “geser kiri” pada output.
Oke, kita lanjutkan ke penulisan script selanjutnya. Tambahkan
fungsi berikut:
// fungsi gser kiri
function
geser_kiri()
{
container.addEventListener(Event.ENTER_FRAME,galeri_geser_kiri);
}
function
geser_kanan()
{
container.addEventListener(Event.ENTER_FRAME,galeri_geser_kanan);
}
var
timer:Number=0;// membuat variable timer dan memberikan nilai 0..
function
galeri_geser_kiri(event:Event):void
{
container.x-=50;
timer++;
trace(timer);
if(timer==16)
{
container.removeEventListener("enterFrame",galeri_geser_kiri);
timer=0;
}
}
function
galeri_geser_kanan(event:Event):void
{
container.x+=50;
timer++;
trace(timer);
if(timer==16)
{
container.removeEventListener("enterFrame",galeri_geser_kanan);
timer=0;
}
}
Jika sudah, masukkan fungsi geser_kanan() dan
geser_kiri() kedalam kondisi swipe di awal tadi. Sehingga script perubahannya
menjadi:
import
flash.events.TransformGestureEvent;
import
flash.events.Event;
var
item_tampil:Number = 1;// pertama ditampilkan item ke-1..
var
total_item:Number = 4;// jumlah konten yang kita buat..
Multitouch.inputMode
= MultitouchInputMode.GESTURE;
function
geser_layar(event:TransformGestureEvent):void
{
if (event.offsetX == 1)
{
if (item_tampil>1)
{
item_tampil--;
geser_kanan(); // script tambahan
trace("geser
kanan");
}
}else if(event.offsetX==-1)
{
if(item_tampil<total_item)
{
item_tampil++;
geser_kiri(); // script tambahan
trace("gser kiri");
}
}
}
stage.addEventListener(TransformGestureEvent.GESTURE_SWIPE,geser_layar);
Nah, sekarang Anda bisa mencobanya! Lakukan test movie.
Cara Kerja Script:
Pertama, berikan nilai timer=0 sebagai pengendalinya. Ketika
nilai offsetX untuk swipe adalah -1 (layar digeser dari kanan ke kiri) maka
fungsi geser_kiri() akan dijalankan. Dimana fungsi geser_kiri() berisi perintah
untuk menjalankan fungsi galeri_geser_kiri(). Nah, saat fungsi
galeri_geser_kiri() berjalan maka nilai timer akan selalu bertambah 1 sementara
nilai x untuk movieClip ‘container’ akan
selalu berkurang 50px (bergerak ke kiri).
Ketika timer=16 maka fungsi galeri_geser_kiri()
dihentikan oleh container.removeEventListener("enterFrame",galeri_geser_kiri);sedangkan
nilai timer dikembalikan ke timer=0.