Rabu, 14 Desember 2011

Membuat Animasi Kumbang Mengikuti Mouse

Kali ini saya akan membuat sebuah objek yang bergerak seakan-akan mengikuti mouse. Yang ini beda sama yang mengganti kursor lho. Kalo bingung, langsung aja deh lanjut….. 8)

  • Seperti biasa, kita buat sebuah dokumen baru. :wink:
  • Sekarang yang mengikuti kursor adalah kepik, atau kumbang, gambar yang bagus ya.. :p
    kumbang

    kumbang

  • Setelah kita gambar kumbang yang bagus, kemudian seleksi kumbang tersebut atau tekan Ctrl + A (Seleksi semua).
  • Kemudian kita klik kanan pada kumbang tersebut dan pilih Convert To Symbol, lalu pilih MovieClip (Setting seperti di gambar ya :wink: ).
    convert to symbol

    convert to symbol

  • Oke, sekarang Kumbang kita jadi sebuah MovieClip. :)
  • Terlebih dahulu kita klik kumbangnya dulu terus kita pergi ke panel properties (caranya tekan Ctrl + F3) dan ubah instance name-nya menjadi kumbang_mc.
    properties kumbang

    properties kumbang

  • Sekarang kita beralih ke Actionscript nih, siap2 ya.. :lol:
  • Buka Panel Actions dengan menekan F9 pada keyboard, jika yang muncul adalah Panel Actions – MovieClip, berarti kita harus meng-klik Layer 1 frame 1 agar Panelnya menjadi Actions – Frame.
    actions - frame

    actions - frame

  • Kemudian ketikkan script berikut :
    01 _root.onEnterFrame=function(){
    02 //mencari selisih dari koordinat
    03 var deltaX = _xmouse - kumbang_mc._x;
    04 var deltaY = _ymouse - kumbang_mc._y;
    05 //menggerakkan kumbang ke kursor sebesar 1/10 dari jarak ke kursor
    06 kumbang_mc._x += deltaX / 10;
    07 kumbang_mc._y += deltaY / 10;
    08 //kumbang menghadap ke mouse
    09 kumbang_mc._rotation = -Math.atan2(-deltaX,-deltaY)*180/Math.PI;
    10 }

Tidak ada komentar:

Posting Komentar