Pengenalan Action di dalam Movie Flash

Presentasi berjudul: "Pengenalan Action di dalam Movie Flash"— Transcript presentasi:

1 Pengenalan Action di dalam Movie Flash
R0312 – Grafik Komputer

2 Memahami ActionScript
ActionScript adalah bahasa pemograman di dalam Macromedia Flash ActionScript digunakan untuk mengontrol objek di Flash, untuk membuat navigasi, dan elemen interaktif lainnya

3 Fungsi ActionScript Membuat sistem navigasi situs
Hal ini berkaitan dengan bagaimana ActionScript dapat mengantar user menjelajahi situs Anda. Menambahkan interaktivitas dengan user Dengan ActionScript user dapat berinteraksi dengan setiap elemen di dalam movie Flash, bait itu tombol, movie clip, maupun teks Membuat situs yang dinamis ActionScript dapat digabungkan dengan berbagai bahasa lain, seperti Javascrip, ASP, PHP, CGI, MySQL, XML untuk membuat berbagai aplikasi yang sulit atau tidak dapat dibuat hanya dengan ActionScript saja Mempertahankan user untuk kembali mengunjungi situs ActionScript dapat membuat situs Flash yang menarik, interaktif, yang akan menambah kualitas user experience daat menjelajah situs. Misalnya dengan adanya game di dalam situs, Anda secara tidak langsung dapat mempertahankan user untuk kembali mengunjungi situs Anda.

4 Menggunakan Action Panel
The Actions panel lets you create and edit actions for an object or frame. Selecting a frame, button, or movie clip instance makes the Actions panel active. The Actions panel title changes to Button Actions, Movie Clip Actions, or Frame Actions, depending on what is selected The ActionScript editor environment consists of two sections. The section on the right is the Script pane, the area where you type your code. The section on the left is an Actions toolbox that contains an entry for each ActionScript language element. In the Actions panel, the Actions toolbox also contains a Script navigator, which is a visual representation of the locations in the FLA file that have associated ActionScript; you can navigate through your FLA file here to locate ActionScript code. If you click an item in the Script navigator, the script associated with that item appears in the Script pane, and the playhead moves to that position on the Timeline. If you double-click an item in the Script navigator, the script gets pinned You edit actions, enter parameters for actions, or delete actions directly in the Script pane. You can also double-click on an item in the Actions toolbox or the Add (+) button above the Script pane to add actions to the Script pane

5 Menggunakan Action Panel (lanjutan)

6 Menerapkan Action pada Frame
Penerapan action pada frame akan memerintahkan frame untuk melakukan aksi pada saat movie mencapai frame tersebut. Sebagai contoh jika pada frame 5 diterapkan action gotoAndstop (10); maka pada saat movie mencapai frame 5, movie akan melompat langsung ke frame 10 dan berhenti di sana. Hal ini berarti movie tidak akan memainkan frame 6 sampai 9

7 Menerapkan Action pada Frame (lanjutan)
Berikut dipraktekan penerapan action pada frame: Buat movie baru dengan memilih File>New, dan gunakanlah default properti movie yang diberikan Mocromedia Flash Buat animasi sesuai keinginan yang menggunakan 5 frame, yaitu dari frame 1 sampai frame 5 Pada panel Timeline, tambahkan layer baru dengan mengklik tombol New Layer Pada layer baru tersebut, klik kanan frame 10 kemudian pilih perintah Insert Keyframe. Setelah itu ketikan teks FRAME 10 Pada panel Timeline, buatlah layer baru dan berikan nama Action. Setelah itu klik kanan frame 5 dan pilihlah perintah Insert Keframe Tampilkan panel Actions dengan mengklik menu Window>Actions

8 Menerapkan Action pada Frame (lanjutan)
Pastikan frame 5 pada layer Action dalam keadan tersorot. Pada panel Action, pada bagian Actions toolbox, bukalah Global Function > Time Control > gotoAndstop. Pada Script Editor masukkan angka 10 pada tanda kurung gotoAndstop Lakukan test movie dengan menekan tombol Ctrl + Enter pada keyboard

9 Menerapkan Action pada Button
Penerapan action pada button akan memerintahkan movie melakukan aksi pada saat button berinteraksi dengan mouse Berikut dipraktekan penerapan action button: Dengan meneruskan praktek sebelumnya, buatlah symbol button sesuai keinginan Pada panel Timeline, buatlah layer baru dan berikan nama layer Tombol Pastikan layer yang tersorot adalah layer Tombol, kemudian sisipkan button ke dalam Stage

10 Menerapkan Action pada Button (lanjutan)

11 Menerapkan Action pada Button (lanjutan)
Gunakan tool Arrow dan klik instance symbol button di dalam Stage untuk memilihnya Pada panel Actions, di bagian Script Editor masukkan: on (release) { gotoAndPlay(1); }

12 Menerapkan Action pada Button (lanjutan)
Dengan melakukan pengaturan tersebut, pada saat tombol diklik, movie akan mulai dimainkan dari frame 1. Namun, tombol tersebut belum berfungsi sepenuhnya, karena movie Flash secara otomatis akan memainkan movie pada saat dijalankan. Untuk mengatasi masalah tersebut, movie Flash harus dihentikan pada saat dimainkan pertama kali. Oleh karena itu, pada panel Timeline, klik frame 1 pada layer Action untuk menyorotnya Pada panel Action, di bagian Script Editor masukkan : stop(); Lakukan test movke dengan memilih menu Control > Test Movie. Pada saat movie dimainkan, movie akan berhenti di frame 1. Jika tombol diklik, maka movie akan mulai dimainkan. Oleh karena tombol berada di frame 1 sampai 10, maka pada saat movie dimainkan dan setiap kali tombol diklik, movie akan kembali ke frame1

13 Penerapan Action pada Movie Clip
Dengan penerapan action pada movie clip, movie akan dapat menjalankan aksi pada saat movie clip di load Action harus diterapkan pada saat instance movie clip Penerapan action pada satu instance movie clip tidak akan mempengaruhi instance lainnya

14 Penerapan Action pada Movie Clip (lanjutan)
Berikut dipraktekkan penerapan action pada movie clip Buat dokumen baru dengan memilih menu File > New, dan gunakanlah default properti movie Pilih menu Insert > Symbol sehingga muncul kotak dialog Create New Symbol Pada kotak tersebut, ketikkan Clip dan pilihlah Movie Clip pada opsi behavior-nya Pada jendela pengeditan symbol Clip, buatlah objek segiempat

15 Penerapan Action pada Movie Clip (lanjutan)
Pada panel Timeline, klik kanan frame 20 kemudian pilihlah perintah Insert Keyframe Gunakan tool Free Transform kemudian seret objek segiempat di dalam frame 20 untuk memperpanjang gambar Kilk salah satu frame di antara frame 1 dan 20, kemudian pada jendela Property Inspector pilihlah opsi Shape pada kotak Tween Kembalilah ke jendela movie utama dengan mengklik ikon Scene 1

16 Penerapan Action pada Movie Clip (lanjutan)
Tampilkan panel Library kemudian seret symbol Clip ke dalam Stage untuk membuat instance Clip pertama Seret kembali symbol Clip ke dalam Stage untuk membuat instance Clip kedua, kemudian aturlah posisinya sehingga berada di bawah instance pertama

17 Penerapan Action pada Movie Clip (lanjutan)
Gunakan tool Arrow kemudian klik instance Clip pertama untuk memilihnya (instance yang berada di atas) Pada panel Action, di bagian Script Editor masukkan: onClipEvent (mouseUp) { stop (); } Lakukan test movie dengan memilih menu Control > Test Movie. Pada saat movie dimainkan, jika tombol mouse diklik, instance clip pertama akan berhenti sedangkan instance Clip kedua tidak akan terpengaruh dan tetap berjalan.