Animasi Flash Membuat Masking dengan ActionScript

Written By batikbumi on 7 Jun 2012 | 03.14

animasi flash

Berikut ini adalah animasi flash dengan membuat masking pada gambar. Teknik masking biasanya dilakukan dengan cara klik kanan pada sebuah layer dan pada dropdown menu yang muncul dipilih Mask.

Teknik masking juga dapat dilakukan dengan menggunakan ActionScript. Caranya yaitu dengan menggunakan metode setMask() yang dimiliki oleh setiap movie clip. Sintaks penggunaan metode tersebut adalah:

movieclip.setMask(namaMask)

movieclip adalah movie clip yang akan diberi masking, sedangkan namaMask adalah movie clip yang akan dijadikan masking.

Baiklah langsung saja ke TKP :

Pertama, tambahkan sebuah gambar pada stage. Aturlah agar ukuran gambar sama dengan ukuran stage dan terletak tepat di tengah. Konversikan gambar tersebut menjadi sebuah movie clip dengan menekan tombol F8 pada keyboard, beri nama simbol dengan "gambar" dan nama instance dengan "gambar_mc".

animasi flash
Nama Simbol
animasi flash
Nama Instance

Setelah itu tambahkan layer baru dan gambarlah sebuah kurva, disini saya gunakan lingkaran. Konversikan gambar tersebut  menjadi sebuah movie clip seperti cara di atas, dengan nama simbol "lingkaran" dan nama instance "lingkaran_mc". Jangan lupa untuk menempatkan titik registrasi tepat di tengah.

Pada frame pertama tambahkan script berikut:

_root["lingkaran_mc"].startDrag(true);
_root["gambar_mc"].setMask(_root["lingkaran_mc"]);

Sebagai alternatif, script juga bisa ditambahkan pada movie clip "gambar_mc" dengan isi script sebagai berikut:

onClipEvent(load){
       _root["lingkaran_mc"].startDrag(true);
       this.setMask(_root["lingkaran_mc"]);
}

Lakukan test movie dan perhatikan hasilnya. Hasil yang diberikan kedua script tersebut sama.

File .swf dapat anda download di sini

Dapat anda lihat script di atas, masking dikombinasikan dengan dragging. Dragging adalah gerakan objek animasi yang mengikuti gerakan pointer mouse. Dragging dilakukan dengan memanfaatkan metode startDrag() yang dimiliki oleh Movie clip. Sintaksnya adalah :

movieclip.startDrag([lock[kiri,atas,kanan,bawah]])

Argumen lock berupa nilai boolean yang digunakan untuk menentukan letak movie clip relatif terhadap pointer mouse. Jika bernilai true maka letak movie clip akan berada di tengah posisi pointer mouse, Jika false maka posisi movie clip akan "terkunci" pada posisi saat mouse di klik di dalam movie.

Argumen kiri, atas, kanan, bawah digunakan untuk menentukan batas area yang dapat dilalui movie clip selama di drag.

0 komentar:

Posting Komentar