Chapter 7
ActionScript 1
Yang perlu dipahami sebelumnya adalah tentang ActionScript. Berikut, sedikit summary tentang ActionScript
ActionScript dalam Flash adalah scripting untuk cara untuk berkomunikasi dengan program. Intinya, scripting adalah cara untuk memberi perintah tentang semua hal yang berkaitan dengan jalannya movie di Flash. Seperti halnya dengan scripting yang lain, ActionScript memiliki sintak-sintak khusus, fungsi, repository dan juga operator. Sekilas, actionscript memiliki kemiripan dengan Javascript.
Semua action yang akan dikerjakan, dibuat dari panel action. Tampilan Panel Action, biasanya di bawah panel properties.
I. ACTION
1. Movie Control: untuk mengatur jalannya movie • go to atau go to andPlay
penggunaan: gotoAndPlay(scene, frame)
scene: nama scene yang dipilih, frame: nomor frame yang akan dikirimi action • on
penggunaan: on(mouseEvent) { statement(s); }
Mouseevent:
• press. Event press akan dikerjakan pada button saat mouse pointer di atas button.
• release. Event release akan dikerjakan pada button saat mouse pointer di atas button.
• releaseOutside. Event release akan dikerjakan pada button saat mouse pointer di luar button, biasanya setelah event press.
• rollOver. Mouse pointer bergeser ke atas button
• dragOut. Saat mouse pointer di atas button, button akan di-press kemudian mouse digeser keluar area button.
• dragOver. Saat mouse pointer di atas button, button sudah di-press, mouse digeser keluar area button, kemudian bergeser ke atas button lagi.
• keyPress ("key"). Key tertentu telah di-press. • Play
Penggunaan: play()
Artinya, mainkan movie. • Stop
Penggunaan: stop
Artinya, stop movie yang sedang dimainkan. • stop all sound
Penggunaan: stopAllSounds()
Artinya, stop semua sound yang dimainkan di movie tanpa menghentikan movie. 2. Browser/ Network: mengontrol web browser dan network
• fscommand
Penggunaan: fscommand("command", "parameters")
Command: script untuk stand-alone Flash Player. Parameters: script untuk semua Flash Player.
Dengan script ini,memungkinkan Flash untuk berkomunikasi dengan Player lain, web browser, Director, VB dll.
Command Parameters Purpose
quit None Close project
fullscreen true or false Mendefinisikan fullscreen allowscale true or false Mendefinisikan skala player showmenu true or false Menampilkan menu
trapallkeys true or false Mendefinisikan event key
• getURL
Penggunaan: getURL(url [, window [, "variables"]])
url: URL yang dipilih
window: (optional) pilihan window untuk membuka document. •_self: dibuka di current frame-window.
•_blank: dibuka di jendela baru
•_parent: dibuka di parent current frame.
•_top: dibuka di top-level frame di current window.
GET atau POST adalah metode untuk mengirimkan variabel. GET: mengirimkan variabel di akhir URL
POST: mengirimkan variable dalam bagian header http, yanpa menyertakan URL.
• LoadMovie
Penggunaan: loadMovie("url",level/target[, variables])
url: alamat file yang akan di-load. Target: Path untuk movie
Level: (integer) mendefinisikan level dalam Flash Player Variables: (optional) menggunakan metode GET atau POST • LoadVariables
Penggunaan: loadVariables ("url" ,level/"target"[, variables])
url: lokasi variable berada
level: (integer) medefinisikan level dalam Flash Player yang akan dikirimi variabel target: Path target yang akan me-load variable.
Variables: (optional) menggunakan metode GET atau POST • unloadMovie
Penggunaan: unloadMovie[Num](level/"target")
Level: level dari loaded movie. Target: Path target dari movie
• duplicateMovieClip
Penggunaan: duplicateMovieClip(target, newname,depth)
Target: movie yang akan diduplicate Newname: penamaan duplicated. Depth: Level untuk duplicated movie. • onClipEvent
Penggunaan: onClipEvent(movieEvent){ statement(s); }
movieEvent is: sebuah event
Event :load, unload, enterFrame, mouseMove, mouseDown, mouseUp, keyDown, keyUp, data
statement(s): instruksi yang akan dikerjakan • removeMovieClip
Penggunaan: removeMovieClip(target)
Target: Path target action • setProperty
Penggunaan: setProperty("target",property,value/expression)
Target: path target
Property: property yang akan diset Value: nilai baru dri properti Expression: Formula nilai baru • startDrag
Penggunaan: startDrag(target,[lock ,left ,top ,right,bottom])
Target: path target untuk men-drag movie
Lock: (optional) nilai boolean kondisi lock dari movie
left, top, right, bottom: (optional) nilai koordinat dari posisi movie sebelumnya • stopDrag
Penggunaan: stopDrag()
Peggunaan: updateAfterEvent()
4. Variables: script untuk mengakses dan manipulasi variable • delete
Penggunaan: delete reference
Reference: nama variable/ object yang akan di delete • set variable
Penggunaan: set(variable,expression)
Variable: penamaan variable
Expression: proses assignment variable. • Var
Penggunaan: var variableName1 [= value1][...,variableNameN [=valueN]]
VariableName: nama variabel Value: nilai yang diassignmentkan • With
Penggunaan: with (object) {
statement(s); }
object: objek yang akan dikenai script statement(s): instruksi yang akan dijalankan
5. Conditions/ Loops: Kendali percabangan dan perulangan • Break
Penggunaan: break
• Case
Penggunaan: case expression: statements
Expression: sebuah pernyataan/ syarat
Statements: sebuah statetement yang akan dijalankan jika syarat terpenuhi • Continue
Penggunaan: continue
Penggunaan: default: statements
Statements: blok statements. • do while
Penggunaan: do {
statement(s) } while (condition)
condition: sebuah syarat yang akan dievaluasi
statement(s): blok statement yang sdikerjakan jika syarat terpenuhi • else
Penggunaan: else statement
else {...statement(s)...}
condition: sebuah ekspresi syarat yang akan dievaluasi untuk mengetahui nilainya.
statement(s): blok statement yang akan dieksekusi jika nilai syarat False. • else if Penggunaan: if (condition){ statement(s); } else if (condition){ statement(s); } • for
Penggunaan: for(init; condition; next) { statement(s); }
init: deklarasi sebelum perulangan
condition: syarat yang akan dievaluasi, bisa True atau False next: ekspresi untuk melakukan increament
statement(s): instruksi yang akan diulang • dst…
6. Printing. Action untuk mencetak movie.
7. User-Defined Function. Fungsi yang didefinisijkan sendiri oleh user. 8. Miscellaneus Action. Fungsi yang berhubungan dengan fungsi lain
dalam movie yang berhubungan langsung dengan jalannya movie. II. OPERATOR. Operator yang bisa digunakan dalam action Flash.
III. FUNCTIONS.
IV. CONSTANTS.
V. PROPERTIES.
VI. OBJECT.
VII. DEPREDECATED.
VIII. FLASH UI COMPONENT.
(untuk kamus lengkap, buka reference di Flash)
Selain action, hal lain yang perlu dipahami adalah: Pengorganisasian movie Berikut pengorganisasian movie dalam Flash:
Objek Frame Scene Movie
STOP, PLAY, GO TO
Stop untuk menghentikan movie. Play untuk menjalankan movie . Go To untuk untuk berpindah frame atau scene
1. Buat sebuah animasi, motion/ shape tween atau frame by frame. Dalam contoh ini shape tween.
2. Biasanya, setelah selesai dimainkan, akan terus diulang
3. Di keyframe terakhir, tambahkan action stop untuk menghentikan looping, dengan membuka panel action, cari dalam movie control > stop. Akan terlihat di timeline sebuah tanda yang menunjukkan ada penyisipan action si keyframe tersebut 4. Simpan mainkan
Lat38
Dapat digunakan untuk multilayer
GO TO
Terdapat GoToAndPlay dan GoToAndStop
GoToAndPlay, melompat ke frame atau scene yang dituju dan memainkan movie di frame atau scene tersebut
GoToAndStop, melompat ke frame atau scene yang dituju dan meghentikannya di frame atau scene tersebut
1. Buat sebuah animasi, dalam kasus ini melanjutkan Lat39 2. Klik Insert > Scene, untuk menambahkan scene
3. Buat animasi di scene 2, berisi movie
4. Keyframe terakhir di scene1 beri action gotoAndPlay(scene2)
5. Keyframe terakhir di scene2 beri action gotoAndPlay(scene1), untuk mengulang movie
6. Simpan, mainkan
NOTE: PENAMAAN LAYER, FRAME ATAUPUN ACTION AKAN MEMPERMUDAH EDITING DAN PENELUSURAN ALUR MOVIE
Lat40
7. Coba hilangkan gotoAndPlay(scene2) dari scene1
Lat41
8. Perhatikan, seandainya tidak diberi action gotoAndPlay(scene2), otomatis movie akan menjalankan scene berikutnya.
9. Tambahkan sebuah scene lagi, sebuah animasi end. Kemudian di scene1 beri action
gotoPlay(scene3) lihat perbedaannya
Lat42
Terlihat dari scene1 langsung menuju scene3
10. Tambahkan action di scene3 gotoStop(“scene1”), lihat perbedaannya
Lat43
Terlihat, movie akan dihentikan di frame yang dipilih
Penggunaan action STOP, GOTO,PLAY seperti di atas dapat juga dikenakan untuk perpindahan frame
1. Menggunakan movie frame by frame. Misal 3 animasi 1-10(nama=”a”, 11-20 (nama=”be”), 21-30(nama=”ce”).
2. Beri nama masing-masing animasi frame tersebut.
3. Untuk action STOP. Di frame terakhir beri action stop. Buka panel action > movie control > stop()
4. Simpan, mainkan
Lat44
Perhatikan hasilnya, di frame “ce” movie akan berhenti 5. Di frame “be” beri action gotoPlay(“a”).
Lat45
Perhatikan, setelah “be” movie akan melompat ke “a” dan terus berulang 6. Di frame “be” ganti beri action gotoStop(“a”)
Lat46
Perhatikann, setelah “be”, movie melompat ke “a” dan berhenti.
ACTION Untuk OBJEK
Sebuah action yang diberikan ke objek. Seperti action sebelumnya, hanya saja user dapat berinteraksi dengan movie menggunakan objek interaktif, seperti tombol
Membuat mainan animasi sederhana.
1. Layer1, buat sebuah animasi objek cahaya melingkar 2. Buat layer baru, Layer2, untuk menempatkan action
3. Frame pertama layer 2, beri action stop(), untuk menghentikan semua animasi sebelum berinteraksi dengan action objek yang akan dibuat
4. Buat 2 button untuk interaksi dengan movie, play dan stop. Bisa juga mengambil dalam windows >common library> button.
5. Di button play klik kanan>action> object> movie> button> event>
on(Release){ play(); }
on(Release){ stop (); }.
Lat47
On(release) adalah action yang memerintahkan sebuah sekumpulan event/ action saat pointer mouse di atas button.
Membuat slide
1. Layer1, Buat animasi frame by frame, atau scene by scene, beri nama di masing2 frame/ masing2 scene
2. Layer2, frame 1, beri action stop(). Beri button untuk navigasi 3. Button diberi action. Sisipkan action. Klik kanan>action>
on(release){
gotoAndStop(“nama frame”/”nama scene”,frame); }
4. Di frame berikutnya, lakukan langkah 1 dan 2
5. Button beri action. Sisipkan action. Klik kanan>action
on(release){
GotoAndPlay(“nama frame”/ “nama scene”,frame); }
6. Simpan, mainkan
Lat48
Membuat Galeri Foto
1. Layer1. Buat urutan foto dengan animasi frame by frame. Atur ukuran dan posisi di properties. Beri nama masing-masing layer. Misal nama: 1, 2, 3 dst.
2. Layer 2 buat navigasi next, previous sesuai posisi frame masing-masing foto, kecuali di foto pertama berikan navigasi next saja dan foto terakhir beri previous saja. Bisa ditambahkan navigasi posisi awal.
3. Untuk navigasi next foto 1 beri action
GotoAndStop(“2”); }
4. Di foto 2, untuk navigasi next
On (release){
GotoAndStop(“3”); }
dan navigasi previous
On (release){
GotoAndStop(“2”); }
5. Untuk foto selanjutnya, gunakan action yang sama cukup diubah parameter nya. 6. Demikian seterusnya untuk setiap foto
7. Jika ditambahkan navigasi ke posisi awal, buat navigasinya dan beri action yang memerintahkan untuk ke frame “1”.
Lat49
Membuat Animasi Warna. Angka, Bentuk dll
1. Layer1, buat animasi frame by frame warna latar. Buat sebuah kotak seukuran stage flash.
2. Masing-masing frame beri warna yang berbeda-bed, beri nama di masing-masing frame misal hitam, merah etc.
3. Di frame 1, beri action stop untuk menghentikan semua animasi sebelum diberi event.
4. Layer2, buat menu pemilihan warna latar. Berikan pilihan menu sesuai warna latar yang dibuat di Layer1
5. Setiap menu pilihan warna berikan action
on (release){
gotoAndStop("biru"); //biru, adalah nama frame di mana animasi latar berwarna biru
6. Copykan pilihan menu tersebut sesuai banyaknya animasi latar. Jika membuat animasi frame di Layer1 sebanyak lima. Berarti pilihan menu di Layer2 juga dicopy sebanyak lima frame.
7. Simpan, mainkan
Lat50
Membuat menu pulldown.
1. Misal akan dibuat menu Home dengan isi Profil, Sejarah, Terkini. 2. Layer1, frame1 buat button menu HOME, edit button.
3. Layer1, frame2 copykan button dari frame1.
4. Di frame1, berikan action sto() untuk menghentikan semua animasi. 5. Berikan action di objek button HOME
on (release){ gotoAndStop(2); } atau on (rollOver){ gotoAndStop(2); }
6. Layer2, frame1, buat button untuk submenu PROFIL. Letakkan di bawah button HOME atau di samping kanannya
7. Lakukan hal yang sama untuk submenu lain dengan layer yang berbeda. 8. Simpan, mainkan.
9. Tambahkan layer animasi untuk memeperjelas penggunaan menu yang telah dibuat
Lat51
Memunculkan movie
1. Memanggil, file *.swf untuk dimasukkan dalam scene. Menggunakan action
loadmovie/ loadmovienum
3. Buat lagi sebuah animasi kedua (level1) yang akan diload dari intro, misal namai utama
4. Di frame terakhir animasi intro berikan action
Stop() // untuk menghentikan animasi intro
Loadmovie(“utama.swf”,1), atau Loadmovienum(“utama.swf”,1) // langsung membuka animasi utama.swf
Atau bisa juga Loadmovie(“utama.swf”,_parent),
Lat52
Terlihat animasi Utama.swf diload dari intro
(kreatifitas anda mempengaruhi baiknya aplikasi anda) Memainkan Musik dengan Action
1. Buat sebuah symbol button
2. Berikan action untuk symbol button berikut: (action untuk memainkan music)
on (rollOver) {
CobaSound = new Sound(this); CobaSound.attachSound("soul"); CobaSound.start(); } on (rollOut){ CobaSound.stop(); }
3. Pastikan sound yang akan dimainkan telah tersimpan di Library dan memiliki nama linkage:soul
4. Simpan, mainkan
Sedikit modifikasi
Lat54
Mencari Posisi Kursor
1. Layer1, buat kotak untuk meletakkan koordinat kursor dengan menggunakan tool teks. Ubah propertis menjadi dynamic teks dan var:posx untuk kotak koordinat x dan var:posy untuk kotak koordinat y. Berikan keterangan untuk posisi x dan y.
2. Layer2, buat 2 buah garis dengan posisi vertikal dan horizontal untuk menunjukkan koordinat mouse. Buat 2 garis tersebut sebagai symbol.
3. Untuk garis vertikal beri action objek:
onClipEvent(enterFrame) {
this._x = _root.posx = _root._xmouse; }
4. Untuk garis horizontal beri action objek:
onClipEvent(enterFrame) {
this._y = _root.posy = _root._ymouse; }
5. Simpan, mainkan
Lat55
Animasi mengikuti gerakan Mouse
1. Animasi dikerjakan di posisi mouse pointer berada
2. Buat sebuah animasi yang akan mengikuti gerak mouse, misal sebuah bulatan, jadikan symbol, movie clip, beri nama instancenya dari propertis, misal: animouse 3. Di frame objek beri action:
startDrag("animouse");
4. Simpan, mainkan
Modifikasi startDrag("animouse", true);
Lat56* Lat57
Dapat dibuat modifikasi. Buat 2 layer. Layer 1 berisi objek yang akan mengikuti gerakan mouse, layer 2 berisi action.
