ActionScript merupakan bahasa program yang digunakan oleh para animator dalam menciptakan sebuah animasi dalam Flash. Penguasaan bahasa program ini tentu saja sangat berguna. Sebelum berkenalan lebih lanjut ada baiknya Anda mengetahui dasar-dasar pemrograman dengan ActionScript. Bahasa pemrograman digunakan untuk mengirim serta menerima informasi dari komputer. Bahasa pemrograman itu sendiri adalah kumpulan dari kode-kode yang digunakan untuk berkomunikasi. Program Macromedia Flash memiliki bahasa pemrogram yang dikenal dengan nama ActionScript yang dibuat berdasarkan model standar ECMAScript (ECMA-262). Bahasa pemrograman lain yang menggunakan model yang sama adalah JavaScript. Jadi, dengan kata lain struktur pemrograman Action-Script memiliki kesamaan dengan JavaScript yaitu (.) dot syntaxt. Pengenalan Action Panel & Library Panel Action Panel Dalam pemrograman di Flash semua kode syntaxt ditulis di dalam ActionPanel. Action Panel sendiri terdiri dari dua jenis yaitu Normal Mode dan Expert Mode. Penempatan ActionScript terdiri dari dua cara, yaitu:
Apabila Anda akan memasukkan ActionScript dalam mode normal, Anda harus memilih jenis syntaxt, kemudian menekan nama syntaxt di Action toolbox. Secara atomatis kode syntaxt yang Anda pilih akan tampil di Script pane yang tidak bisa diedit. Sedangkan dalam mode ahli (expert) Anda dapat memasukkan kode dalam script dengan carayang sama dengan mode normal. Atau, Anda dapat mengetikkannya langsung di Script pane, karena pada mode ini Script pane menjadi area yang dapat diedit secara manual. Library Panel Library Panel adalah tempat semua obyek yang kita gunakan dalam suatu file flash yang sedang kita kerjakan. Seperti yang dapat Anda lihat di atas, setiap obyek di dalam library panel dilambangkan oleh sebuah icon yang berada di samping setiap nama obyek tersebut. Bisa Anda perhatikan bahwa arti setiap symbol ini di jelaskan dalam kolom “Kind”. Symbol terdiri dari instance, seperti grafik dan sound. 1. Mengimpor Grafik dan Suara Sebaiknya grafik atau foto yang Anda gunakan berformat .PNG. Untuk mengconvert grafik atau foto ke dalam format tersebut, Anda dapat menggunakan Macromedia Fireworks. Software ini mengoptimisasikan grafik Anda untuk di gunakan ke dalam Flash. Selain itu, hasil akhir grafik Anda dalam Flash movie akan terlihat lebih baik. 2. Mengimpor Grafik dan Suara 3. Button Button adalah movie clip interaktif yang terdiri dari empat buah frame : Up , Over, Down & Hit. Pada button tersebut, Anda dapat menambahkan sound effect pada saat mouse over, link ke website, e-mail atau menentukan action dan behavior sebuah target movieclip. Tips : Actionscript digunakan pada symbol Button, bukan pada Timeline. 4. Movie Clip Dalam aplikasi Flash kita mengenal istilah movie clip.Movie clip adalah salah satu symbol yang sangat berguna dalam flash movie. Movie clip bisa terdiri dari object symbol, seperti Graphic symbol yang telah di-tweening atau dianimasikan. Advanced Actionscript bisa ditambahkan pada movie clip untuk kegunaan yang lebih besar. Apa sebenarnya kegunaan movie clip?
5. Sound Dengan Flash, kita bisa mengimpor langsung musik dengan format .WAV atau .MP3. Sound bisa digunakan dengan button melalui “timeline property” button symbol tersebut atau di-link dari library dengan actionscript untuk digunakan sebagai background sound. Setiap symbol yang sudah diletakkan ke stage maka selanjutnya disebut Instance. ActionScript Dasar Actions stop(), play(), gotoAndPlay(), gotoAndStop(), getURL(), loadMovie(), loadVariables() Operators +, -, >, <, ?, “”, |, ^, &, ~, %, / Functions getProperty(), getTimer(), getVersion(), escape() Properties _alpha, _currentFrame, _framesloaded, _x, _y, _height, _width Objects Anda dapat melihat referensi dari kategori-kategori yang lain dengan menekan tanda “+” pada Action Panel. Link ke website URL atau mengirim e-mail dengan Button Ambil sebuah button dari library, lalu letakkan di posisi yang Anda inginkan di atas stage. Klik kanan button tersebut, kemudian pilih “Actions”, yang akan memunculkan panel “Action” berisikan actionscript. Di dalam kategori “Browser/ Network” pilih “getURL”. Untuk membuka kolom isian, klik ganda “getURL”. Isi URL dan Windows property sesuai keinginan Anda. Actionscript Anda akan terlihat seperti di bawah ini: on (release) { getURL(“www.detik.com”, blank”); } Link ke website URL atau mengirim e-mail dengan text Gunakan Text tool yang ada dalam Flash dan ketik sesuai keinginan Anda, misalnya: “klik saya” Lihat gambar property window text di bawah. Anda bisa memilih Static Text atau Dynamic Text. Pastikan Anda mengklik tombol “Render text as HTML” untuk mengaktifkan link. Isi URL website Anda, misalnya: http://www.godote.com. Selanjutnya pilih target window pada bagian “Target”, misalnya _blank. Perhatikan stage, garis underline akan muncul dibawah teks Anda. Silahkan tes movie Anda. Mengirimkan javascript function dari Flash ke Browser menggunakan getURL Membuat window browser dengan javascript function melalui Flash on (release) { getURL(“javascript:shake(1)”); } Simpan atau save dan publish Flash Anda sebagai SWF dan HTML. Apabila Anda ingin agar browser tersebut bergetar lebih lama, Anda hanya perlu melakukan pengulangan kode berikut: parent.moveBy(0,i); parent.moveBy(i,0); parent.moveBy(0,-i); parent.moveBy(-i,0); Membuat Button untuk melakukan sesuatu dengan terhadap movie clip Persiapkan instance yang akan Anda gunakan:
Sebagai langkah pertama, letakkan movie clip Anda pada stage dan klik dua kali untuk masuk ke edit symbol mode. Selanjutnya klik frame ke-8, kemudian klik kanan dan pilih “Insert keyframe”. Anda bisa memperbesar objek bola Anda di frame ke-8 ini. Klik frame ke-15 dan “Insert Keyframe”. Sebagai gantinya, Anda bias memindahkan letak posisi bola Anda ke bawah. Create motion tweening dari frame pertama sampai ke frame 15. Tambahkan sebuah layer di atas dan namakan “action”. Pada layer tersebut, klik frame ke-8 kemudian klik kanan dan pilih “Insert Blank Keyframe”, lakukan dua kali. Pada layer yang sama, klik frame ke-15 dan “Insert Blank Keyframe” sekali lagi. Berikutnya, klik frame ke-8 tadi dan masukan actionscript. Caranya klik kanan frame tersebut, kemudian pilih “Actions”. Dalam panel “Action” yang muncul (di bawah stage) masuklah dalam kategori “Actions | Movie Control” dan klik ganda “stop”. Kini dalam frame tersebut Anda akan melihat sebuah lambang berbentuk seperti huruf “a”. Pindah ke frame 9. Berikan nama label “TURUN” untuk frame ini. Tambahkan actionscript yang sama dengan frame 8 kepada frame 15. Klik menu “Edit | Edit Document” untuk kembali ke stage semula. Kini movie clip “BOLA” Anda telah terpampang pada stage. Lihat property window movie clip Anda dan pastikan bahwa Anda telah mengisi instance name movie tersebut “BOLA”. Sekarang, ambil sebuah button dari library dan letakan di stage. Pilih button tersebut dan masukkan actionscript seperti di bawah ini: on (release) { BOLA.gotoAndPlay(“TURUN”); } Di mana saat button ini di klik, akan menyuruh movie clip bola memainkan frame yang telah di labelkan “turun”. Tips Menarik Penerapan action script dalam program Flash jelas akan memberikan kualitas yang baik terhadap sebuah animasi. Di atas telah dijelaskan dan dicontohkan dengan langkah-langkah singkat beberapa tips menarik yang bisa langsung Anda terapkan. Namun, tentu kurang ‘sreg’ rasanya jika tips yang tersaji hanya itu saja. Sebagai tambahan, berikut ini tersedia dua buah tips yang tentu akan menambah pengetahuan Anda dalam menciptakan animasi pada Flash. Penggunaan loadMovie() yang ideal Biasanya jika kita ingin me-load movie (.SWF) eskternal perintah yang digunakan adalah “loadMovie()”. Namun, para pemula yang ingin meload eksternal movie tersebut di level biasanya menggunakan script “loadMovieNum(“01.swf”,0)”. Script ini berarti; “akan meload file 01.swf pada level 0. Penentuan “level” juga dapat dilakukan dengan menggunakan target movie clip pada pilihan “Location”. Sebenarnya tidak ada yang salah dengan cara di atas. Hanya saja kita tidak leluasa untuk melakukan interaksi terhadap movie clip yang di-load. Agar kita dapat lebih leluasa, berikut adalah langkah-langkah yang dapat dilakukan: Pertama, buatlah symbol movie clip dan beri nama apa saja. Letakkan symbol covie clip tadi ke stage pada posisi X:0,0 dan Y:0,0, kemudian namakan instance tersebut “holder_mc”. Buka Action Panel dan ubah ke expert mode. Seperti yang telah dijelaskan sebelumnya bahwa dalam mode ini script pane menjadi area yang bisa diedit secara manual. Selanjutnya ketikkan script berikut ini: holder_mc.loadMovie(“01.swf”, this); Perintah ini berarti file eksternalchip.swf akan di-load pada holder_mc. Setelah file tersebut di-load pada holder_mc maka Anda dapat mengubah properties dari movie yang telah di-load tadi dengan menempatkan script pada movie clip lain atau button. Dalam contoh ini Anda akan menggunakan button untuk mengubah properties _x, _y dan _alpha dari movie clip holder_mc. 1. Pilih button, kemudian pada Action Panel ketikkan script berikut: } 2. Pilih frame pertama pada timeline kemudian pada Action Panel ketikkan script berikut: 01_btn.onRelease = function() { holder_mc._x = 100; holder_mc._y = 50; holder_mc._alpha = 50; } holder_mc._x = 100; akan mengubah posisi movie clip ini ke posisi x: 100. holder_mc._y = 50; akan mengubah posisi movie clip ini ke posisi x: 50 holder_mc._alpha = 50; akan mengubah movie clip ini lebih transparan dengan nilai alpha 50 (nilai yang bisa digunakan adalah 0 hingga 100). Dari kedua cara di atas disarankan untuk menggunakan cara kedua. Mengapa demikian? Hal itu dikarenakan cara ini akan lebih memudahkan dalam menempatkan dan mengedit script. Apabila Anda memilih cara pertama Anda harus memilih instance terlebih dahulu, kemudian barulah mengetikkan atau mengedit script. Hal ini tentu akan menyita waktu. Sekarang tes movie yang telah Anda buat dengan menekan kombinasi tombol “Ctrl + Enter”. Cobalah tekan button-nya. Terlihat bahwa movie clip yang di-load tadi berpindah posisi pada x:100 dan y:50, sedangkan movie-nya menjadi lebih transparan. Silahkan Anda mencoba mengubah properties lainnya, seperti _width dan _height. Memberi nama instance yang baik Jika kita sering menggunakan Action Panel dalam expert mode maka banyak sekali keuntungan yang bisa kita dapatkan seperti lebih mempermudah dalam proses edit. Mungkin Anda pernah mendengar istilah ‘Code Hints’. Ini adalah feature yang sangat membatu untuk user yang tidak hafal dengan semua syntaxt yang ada. Code Hints sendiri akan muncul secara otomatis di Action Panel pada saat kita mengetikkan syntaxt tertentu. Hanya saja perlu penulisan nama instance atau obyek yang baku agar Code Hints dapat muncul. Ini daftar beberapa penulisan instance/ obyek agar feature Code Hints dapat aktif jika setiap nama instance diberi akhiran sebagai berikut:
Beberapa syntax dasar yang sering digunakan this onClipEvent (load) { this.gotoAndStop(“5”); } onClipEvent (load) : Pada saat movie clip ini tampil di stage. this : movie clip ini gotoAndStop (“5”) : menuju dan berhenti di frame 5 dalam movie clip ini. _parent on (release) { _parent.gotoAndPlay(“5”); } on (release) : Pada saat button ini di klik, _root Digunakan untuk menspesifikasikan akar dari sebuah movie clip atau obyek. Sebuah flash movie (.SWF ) bias terdiri dari banyak level. Level adalah susunan flashmovie (swf) yang di panggil untuk masuk ke dalam Flash movie utama yang kita referensikan sebagai _root atau _level0. Syntax ini sangat luas kegunaannya. Actionscript di bawah ini di tempatkan pada button untuk menyuruh timeline di movie utama menuju ke frame 3. on (release) { _root.gotoAndStop(“3”); } on (release): Pada saat button ini di klik, Frame label getURL URL Window _parent : Membuka halaman URL dengan window baru _blank : Membuka halam URL di window utama bukan di dalam frame HTML dimana flash movie itu berada. _self : Membuka halaman URL di dalam frame HTML yang sama dimana flash movie itu berada Variables Don’t send : Gunakan variable ini untuk membuka website Send using GET : Mengirim variable yang di spesifikasikan diakhiran getURL ke server side script seperti Perl, ASP, dan PHP. Send using POST : Digunakan untuk mengirim informasi dalam flash movie misalnya search engine atau contact form ke server side script seperti Perl, ASP, dan PHP. Sumber: Majalah CHIP |