Drag dan Snap
Pada contoh di atas untuk mendeteksi apakah movieclip kepala sudah berada tepat diposisi movieclip badan digunakan metode jarak, yaitu menggunakan teori pitagoras sederhana dengan menghitung akar (Math.sqrt) kuadrat dari selisih kordinat 2 objek. Sehingga ketika movieclip kepala berjarak (ber radius) kurang dari 50 pixel dan tombol mouse dilepas, maka kordinat movieclip kepala dijadikan sama dengan kordinat movieclip badan sehingga akan muncul efek Snap.
Sebenarnya kode AS3 memiliki sistem deteksi antara 2 objek
yang di drag mouse, yaitu
dropTarget.
Kodenya kurang lebih sebagai berikut :
Akan tetapi kode tersebut kurang
optimal, karena deteksi posisi masih terlalu luas, sehingga ketika kepala baru
menyentuh titik terluar badan sudah dianggap sebagai dropTarget, sehingga lebih baik menggunakan metode pengukuran jarak
agar akurasi lebih tepat. Untuk lebih jelasnya, perhatikan langkah berikut :
1. Lanjutkan
file pada tutorial sebelumnya (drag movieclip).
2. Klik frame 1 layer 2 buka panel Action (F9) dan ubah kodenya menjadi
sebagai berikut :
3. Jalankan aplikasi dengan menekan Ctrl+Enter. Klik dan drag kepala panda tersebut mendekati posisi yang tepat (sekitar leher panda) untuk menguji coba kode.
Penjelasan kode :
var
awal_x:Number = kepala.x; Pada awalnya kordinat x dan y dari movieclip
kepala disimpan di dalam variabel awal_x dan awal_y. Hal ini dimaksudkan agar
apabila kepala tidak didrag pada posisi yang tepat, maka akan kembali ke posisi
awal
kepala.addEventListener(MouseEvent.MOUSE_DOWN,pencetMouse);
Selanjutnya movieclip
kepala diberikan listener ketika mouse ditekan. Ketika event terjadi (yaitu
ketika Mouse ditekan), maka fungsi pencetMouse akan dijalankan.
kepala.startDrag(); merupakan
kode untuk memulai mode drag sebuah objek.
kepala.stopDrag(); merupakan
kode untuk mengakhiri mode drag sebuah objek.
var
jarak = Math.sqrt(...); merupakan perhitungan jarak menggunakan metode
pitagoras yaitu akar dari selisih kuadrat jarak antara movieclip kepala dengan
movieclip badan.
if (jarak < 50){...}else {...} merupakan kondisi untuk melakukan proses snap. Apabila jarak kurang dari 50 pixel maka posisi akan di snap, sedangkan jika lebih akan dikembalikan ke posisi awal_x dan awal_y.
“Sumber Informasi”
Thanks for reading Drag dan Snap. Please share...!
