Berikut ini kita akan sedikit mengembangkan penggunaan action di mana nantinya suatu tombol akan dapat mengontrol movie clip. Pada latihan ini, kita akan membuat tombol yang dapat menampilkan dan menyembunyikan movie clip.
1. Imporlah sebuah gambar; latihan ini menggunakan gambar kartun pensil (kartun3.wmf).
2. Klik/pilih gambar kartun pensil, lalu ubahlah menjadi simbol Movie clip.
3. Dengan gambar masih dalam keadaan terpilih, isikan namanya sebagai pensil pada Properties.
4. Masukkan layer baru (Layer 2). Pada Layer 2, masukkan dua buah tombol dari library Flash. Latihan ini menggunakan tombol Oval buttons - green dan Oval buttons - yellow dari kategori Ovals.
5. Klik/pilih tombol Oval buttons – green (tombol di sebelah kiri), lalu berikan Action on (release) dan setProperty.
6. Letakkan kursor di dalam kurung kode setProperty, lalu klik tombol Insert a target path.
7. Akan tampil kotak dialognya, lalu pilih pensil dan Absolute.
8. Akan terbentuk kode di dalam kurung kode setProperty seperti
9. Lengkapilah kodenya
10. Klik/pilih tombol Oval buttons - yellow, lalu berikan action on dan setProperty. Ulangilah langkah (6) hingga (9) sampai terbentuk kode Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol Oval berwarna hijau (tombol di sebelah kiri) agar gambar pensil akan menghilang (visible=0). Untuk menampilkannya kembali, klik tombol Oval berwarna kuning (visible=1).
Senin, 02 November 2009
Action untuk Mengatur Perilaku Movie Clip
Pada bagian-bagian sebelumnya, kita sudah mempelajari cara memberikan action pada frame dan tombol, tapi ada satu hal yang belum kita pelajari, yaitu memberikan action pada movie clip. Bagaimana caranya? Ikuti pembahasan berikut ini yang akan membahas cara mengatur perilaku movie clip.
1. Klik Rectangle Tool, lalu gambarlah kotak
2. Klik/pilih kotak tersebut, lalu ubah menjadi simbol Movie clip.
3. Dengan kotak masih dalam keadaan terpilih, berikan action onClipEvent dari kategori Movie Clip Control sehingga akan tampil Code Hints-nya, lalu pilihlah mouseDown.
4. Pada Script pane, letakkan kursor mouse di antara kurung kurawal kode onClipEvent (mouseDown), lalu berikan action setProperty.
5. Letakkan kursor di dalam tanda kurung kode setProperty dan isikan kode
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik objek kotak. Objek kotak akan berubah bentuknya menjadi lebih tinggi.
Keterangan Action:
Event-event Movie clip, yaitu:
1. Load: Keadaan ketika movie klip dibaca di timeline atau saat movie klip pertama kali dijalankan.
2. EnterFrame: Keadaan ketika setiap frame movie klip dimainkan.
3. Unload: Keadaan ketika movie klik dihapus di timeline.
4. Mouse down: Keadaan ketika tombol kiri mouse ditekan.
5. Mouse up: Keadaan ketika tombol mouse dilepaskan.
6. Mouse move: Keadaan ketika mouse digerakkan.
7. Key down: Keadaan ketika tombol keyboard ditekan.
8. Key up: Keadaan ketika tombol keyboard dilepaskan.
9. Data: Keadaan ketika data movie swf dibaca ke dalam movie Flash.
10. setProperty berfungsi untuk mendefinisikan suatu nilai bagi properti movie klip. setProperty mempunyai beberapa pilihan property, yaitu:
_alpha: Menentukan nilai transparansi movie klip.
_focusrect: Menentukan apakah tanda kotak akan muncul saat navigasi.
_height: Mengubah tinggi movie klip.
_highquality: Mengubah ketajaman objek dari movie klip.
_name: Memberikan nama baru pada movie klip.
_quality: Mengubah ketajaman objek dari movie klip secara keseluruhan.
_rotation: Memutar movie klip.
_soundbuftime: Menentukan waktu pada movie klip untuk memulai suara.
_visibile: Menentukan apakah movie klip terlihat atau tidak.
_width: Mengubah lebar movie klip.
_x: Mengubah posisi horisontal movie klip.
_xscale: Mengubah dimensi horisontal movie klip.
_y: Mengubah posisi vertikal movie klip._yscale: Mengubah dimensi vertikal movie klip.
1. Klik Rectangle Tool, lalu gambarlah kotak
2. Klik/pilih kotak tersebut, lalu ubah menjadi simbol Movie clip.
3. Dengan kotak masih dalam keadaan terpilih, berikan action onClipEvent dari kategori Movie Clip Control sehingga akan tampil Code Hints-nya, lalu pilihlah mouseDown.
4. Pada Script pane, letakkan kursor mouse di antara kurung kurawal kode onClipEvent (mouseDown), lalu berikan action setProperty.
5. Letakkan kursor di dalam tanda kurung kode setProperty dan isikan kode
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik objek kotak. Objek kotak akan berubah bentuknya menjadi lebih tinggi.
Keterangan Action:
Event-event Movie clip, yaitu:
1. Load: Keadaan ketika movie klip dibaca di timeline atau saat movie klip pertama kali dijalankan.
2. EnterFrame: Keadaan ketika setiap frame movie klip dimainkan.
3. Unload: Keadaan ketika movie klik dihapus di timeline.
4. Mouse down: Keadaan ketika tombol kiri mouse ditekan.
5. Mouse up: Keadaan ketika tombol mouse dilepaskan.
6. Mouse move: Keadaan ketika mouse digerakkan.
7. Key down: Keadaan ketika tombol keyboard ditekan.
8. Key up: Keadaan ketika tombol keyboard dilepaskan.
9. Data: Keadaan ketika data movie swf dibaca ke dalam movie Flash.
10. setProperty berfungsi untuk mendefinisikan suatu nilai bagi properti movie klip. setProperty mempunyai beberapa pilihan property, yaitu:
_alpha: Menentukan nilai transparansi movie klip.
_focusrect: Menentukan apakah tanda kotak akan muncul saat navigasi.
_height: Mengubah tinggi movie klip.
_highquality: Mengubah ketajaman objek dari movie klip.
_name: Memberikan nama baru pada movie klip.
_quality: Mengubah ketajaman objek dari movie klip secara keseluruhan.
_rotation: Memutar movie klip.
_soundbuftime: Menentukan waktu pada movie klip untuk memulai suara.
_visibile: Menentukan apakah movie klip terlihat atau tidak.
_width: Mengubah lebar movie klip.
_x: Mengubah posisi horisontal movie klip.
_xscale: Mengubah dimensi horisontal movie klip.
_y: Mengubah posisi vertikal movie klip._yscale: Mengubah dimensi vertikal movie klip.
Action untuk Navigasi antar Frame Number
Bagian ini hampir sama kegunaannya hanya saja kita tidak akan melakukan navigasi antar-frame label, tetapi dengan menyebutkan nomor frame yang dituju. Action yang
digunakan pun berbeda, yaitu action gotoAndPlay yang akan memperindah/memperhalus perpindahan antar-frame/halaman karena dapat disertakan animasi saat perpindahannya.
1. Klik Text Tool, lalu tulislah teks “Halaman Home” di sebelah kiri layar.
2. Pilih teks, lalu ubah menjadi simbol Graphic. Masukkan Keyframe pada frame 15. Pada frame 15, pindahkan teks ke tengah layar.
3. Klik frame 1, lalu berikan Tween Motion. Masih di frame 1, klik/pilih pada teks, kemudian pilih pada bagian Color: Alpha 0% pada Properties-nya.
4. Buat layer baru (Layer 2). Pada Layer 2, masukkan BlankKeyframe pada frame 16. Pada frame 16, tulislah teks ”Halaman produk” di sebelah kanan layar
5. Pilih teks, lalu ubah menjadi simbol Graphic. Masukkan Keyframe pada frame 30. Pada frame 30, pindahkan teks ke tengah layar.
6. Klik frame 16, lalu berikan Tween Motion. Masih di frame 16, klik/pilih pada teks, kemudian pilih bagian Color: Alpha 0% pada Properties-nya.
7. Pada Layer 1, klik frame 15, lalu berikan action stop pada frame tersebut. Lakukan hal yang sama pada Layer 2 di frame 30.
Sekarang frame yang terbentuk di Timeline Panel
8. Buat layer baru (Layer 3) dan masukkan dua buah tombol dari library Flash. Latihan ini menggunakan tombol playback – step forward dan playback - step back dari kategori Playback.
9. Klik/pilih tombol playback - step forward (tombol di kiri), lalu berikan action on dan gotoAndPlay. Isikan nilai frame yang akan dituju di dalam kurung action gotoAndPlay, yaitu 16 (frame 16).
10. Klik/pilih tombol playback – step back (tombol di kanan), lalu berikan action on dan gotoAndPlay. Isikan nilai frame yang akan dituju dalam kurung action gotoAndPlay, yaitu 1 (frame 1) sehingga terbentuklah kode di Script pane.
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol playback - step forward, Anda akan dibawa ke Halaman Produk. Coba klik lagi tombol playback - step back, Anda akan dibawa kembali ke halaman semula, yaitu Halaman Home. Sekarang coba Anda bandingkan hasilnya pasti beda kan? Lebih bagus mana? Pilihan ada di tangan Anda dan tentunya setiap orang biasanya punya pilihan dan selera yang berbeda.
Keterangan Action:1. gotoAndPlay berfungsi untuk melompat ke frame tertentu dan memainkan animasi dimulai dari frame tersebut sampai frame yang ditentukan.
digunakan pun berbeda, yaitu action gotoAndPlay yang akan memperindah/memperhalus perpindahan antar-frame/halaman karena dapat disertakan animasi saat perpindahannya.
1. Klik Text Tool, lalu tulislah teks “Halaman Home” di sebelah kiri layar.
2. Pilih teks, lalu ubah menjadi simbol Graphic. Masukkan Keyframe pada frame 15. Pada frame 15, pindahkan teks ke tengah layar.
3. Klik frame 1, lalu berikan Tween Motion. Masih di frame 1, klik/pilih pada teks, kemudian pilih pada bagian Color: Alpha 0% pada Properties-nya.
4. Buat layer baru (Layer 2). Pada Layer 2, masukkan BlankKeyframe pada frame 16. Pada frame 16, tulislah teks ”Halaman produk” di sebelah kanan layar
5. Pilih teks, lalu ubah menjadi simbol Graphic. Masukkan Keyframe pada frame 30. Pada frame 30, pindahkan teks ke tengah layar.
6. Klik frame 16, lalu berikan Tween Motion. Masih di frame 16, klik/pilih pada teks, kemudian pilih bagian Color: Alpha 0% pada Properties-nya.
7. Pada Layer 1, klik frame 15, lalu berikan action stop pada frame tersebut. Lakukan hal yang sama pada Layer 2 di frame 30.
Sekarang frame yang terbentuk di Timeline Panel
8. Buat layer baru (Layer 3) dan masukkan dua buah tombol dari library Flash. Latihan ini menggunakan tombol playback – step forward dan playback - step back dari kategori Playback.
9. Klik/pilih tombol playback - step forward (tombol di kiri), lalu berikan action on dan gotoAndPlay. Isikan nilai frame yang akan dituju di dalam kurung action gotoAndPlay, yaitu 16 (frame 16).
10. Klik/pilih tombol playback – step back (tombol di kanan), lalu berikan action on dan gotoAndPlay. Isikan nilai frame yang akan dituju dalam kurung action gotoAndPlay, yaitu 1 (frame 1) sehingga terbentuklah kode di Script pane.
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol playback - step forward, Anda akan dibawa ke Halaman Produk. Coba klik lagi tombol playback - step back, Anda akan dibawa kembali ke halaman semula, yaitu Halaman Home. Sekarang coba Anda bandingkan hasilnya pasti beda kan? Lebih bagus mana? Pilihan ada di tangan Anda dan tentunya setiap orang biasanya punya pilihan dan selera yang berbeda.
Keterangan Action:1. gotoAndPlay berfungsi untuk melompat ke frame tertentu dan memainkan animasi dimulai dari frame tersebut sampai frame yang ditentukan.
Action untuk Navigasi antar Frame Label
Navigasi berfungsi untuk membawa pengunjung menjelajah dari satu halaman ke halaman lainnya melalui media link, tombol, atau menu. Navigasi dalam Flash dapat dilakukan dengan berbagai cara, seperti navigasi antar-frame, navigasi antar-scene, navigasi antar-movie, dan navigasi melalui URL. Akan tetapi, cara terbaik di antara
keempat cara tersebut adalah navigasi antar-frame karena ukuran file yang dihasilkan paling kecil sehingga akan mempengaruhi kecepatan loading yang diutamakan dalam sebuah situs web. Pada latihan ini, kita akan membuat navigasi antar-frame label (frame yang diberi label/nama) menggunakan action gotoAndStop.
1. Klik Text Tool lalu tulislah teks “Halaman Home” di layar.
2. Klik frame 15, lalu klik menu Insert > Timeline > Blank Keyframe. Pada frame 15, tulislah teks “Halaman Profil”.
3. Klik frame 1, lalu berilah nama/label “home” pada frame tersebut melalui Properties-nya.
4. Lakukan hal yang sama untuk frame 15 dengan memberinya label “profil” sehingga sekarang ada dua label di frame, yaitu “home” di frame 1 dan “profil” di frame 15.
5. Masukkan layer baru (Layer 2). Pada Layer 2, masukkan dua buah tombol dari library Flash. Latihan ini menggunakan tombol circle button - previous dan circle button - next dari kategori Circle Buttons.
6. Klik/pilih tombol circle button - next (tombol di sebelah kanan), lalu berikan Actions on, kemudian berikan action gotoAndStop di antara tanda kurung kurawal kode on (release)
7. Letakkan kursor di dalam kurung kode gotoAndStop, lalu tuliskan “profil”. Hal ini bertujuan agar apabila tombol diklik, movie akan menuju label profil yang sudah diberikan pada frame sehingga kode gotoAndStop akan terlihat
8. Klik/pilih tombol circle button - previous, lalu ulangi langkah (6) hingga (7) sampai terbentuk kode
9. Klik frame 1 di Layer 2, lalu berikan action stop sehingga movie akan langsung berhenti pada frame 1 saat pertama kali dijalankan. Timeline Panel yang terbentuk
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol circle button - next, Anda akan dibawa ke Halaman Profil. Coba klik lagi tombol circle button - previous, Anda akan dibawa kembali ke halaman semula, yaitu Halaman Home. Cara kerjanya mirip link di halaman web.
Keterangan Action:1. gotoAndStop berfungsi untuk melompat ke frame tertentu dan berhenti di frame tersebut.
keempat cara tersebut adalah navigasi antar-frame karena ukuran file yang dihasilkan paling kecil sehingga akan mempengaruhi kecepatan loading yang diutamakan dalam sebuah situs web. Pada latihan ini, kita akan membuat navigasi antar-frame label (frame yang diberi label/nama) menggunakan action gotoAndStop.
1. Klik Text Tool lalu tulislah teks “Halaman Home” di layar.
2. Klik frame 15, lalu klik menu Insert > Timeline > Blank Keyframe. Pada frame 15, tulislah teks “Halaman Profil”.
3. Klik frame 1, lalu berilah nama/label “home” pada frame tersebut melalui Properties-nya.
4. Lakukan hal yang sama untuk frame 15 dengan memberinya label “profil” sehingga sekarang ada dua label di frame, yaitu “home” di frame 1 dan “profil” di frame 15.
5. Masukkan layer baru (Layer 2). Pada Layer 2, masukkan dua buah tombol dari library Flash. Latihan ini menggunakan tombol circle button - previous dan circle button - next dari kategori Circle Buttons.
6. Klik/pilih tombol circle button - next (tombol di sebelah kanan), lalu berikan Actions on, kemudian berikan action gotoAndStop di antara tanda kurung kurawal kode on (release)
7. Letakkan kursor di dalam kurung kode gotoAndStop, lalu tuliskan “profil”. Hal ini bertujuan agar apabila tombol diklik, movie akan menuju label profil yang sudah diberikan pada frame sehingga kode gotoAndStop akan terlihat
8. Klik/pilih tombol circle button - previous, lalu ulangi langkah (6) hingga (7) sampai terbentuk kode
9. Klik frame 1 di Layer 2, lalu berikan action stop sehingga movie akan langsung berhenti pada frame 1 saat pertama kali dijalankan. Timeline Panel yang terbentuk
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol circle button - next, Anda akan dibawa ke Halaman Profil. Coba klik lagi tombol circle button - previous, Anda akan dibawa kembali ke halaman semula, yaitu Halaman Home. Cara kerjanya mirip link di halaman web.
Keterangan Action:1. gotoAndStop berfungsi untuk melompat ke frame tertentu dan berhenti di frame tersebut.
Action untuk Mengontrol Animasi
Kita bisa mengontrol suatu animasi yang sedang dimainkan, misalnya menghentikan animasi tersebut saat gerakannya berada di tengah layar, kemudian memainkannya lagi. Action yang digunakan dalam kasus tersebut adalah action play dan stop. Pada latihan ini, kita akan mengontrol animasi bola memantul
1. Bukalah file animasi bola memantul.fla.
2. Klik menu Insert > Timeline > Layer untuk menambahkan layer baru (Layer 2). Pada Layer 2, masukkan dua buah tombol dari library Flash (Window > Other Panels > Common Libraries > Buttons). Latihan ini menggunakan tombol stop dan play dari kategori Circle Buttons.
3. Klik/pilih tombol stop, lalu buka Actions Panel. Bagian Actions Category berlabel Actions–Button yang menandakan bahwa kita akan memberikan action pada tombol/button.
4. Pada bagian Action toolbox, klik pada bagian Global Functions, lalu klik lagi bagian Movie Clip Control untuk menampilkan kumpulan Action di dalamnya. Kemudian, klik ganda action on sehingga pada Script pane akan tertulis kode on( ), dan Code Hints dari kode on juga akan tampil. Pilihlah release.
5. Pada Script pane, letakkan kursor mouse di antara kurung kurawal kode on (release).
6. Berikan Action stop
7. Selanjutnya, klik/pilih tombol play, lalu berikan Action on dengan Code Hints release. Berikan action play yang terdapat di bagian Timeline Control sehingga terbentuklah kode pada Script pane
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol stop agar animasi akan berhenti. Untuk memainkan animasi lagi, klik tombol play.
Keterangan Action:
1. stop berfungsi untuk menghentikan movie atau animasi.2. play berfungsi untuk memainkan movie atau animasi.
1. Bukalah file animasi bola memantul.fla.
2. Klik menu Insert > Timeline > Layer untuk menambahkan layer baru (Layer 2). Pada Layer 2, masukkan dua buah tombol dari library Flash (Window > Other Panels > Common Libraries > Buttons). Latihan ini menggunakan tombol stop dan play dari kategori Circle Buttons.
3. Klik/pilih tombol stop, lalu buka Actions Panel. Bagian Actions Category berlabel Actions–Button yang menandakan bahwa kita akan memberikan action pada tombol/button.
4. Pada bagian Action toolbox, klik pada bagian Global Functions, lalu klik lagi bagian Movie Clip Control untuk menampilkan kumpulan Action di dalamnya. Kemudian, klik ganda action on sehingga pada Script pane akan tertulis kode on( ), dan Code Hints dari kode on juga akan tampil. Pilihlah release.
5. Pada Script pane, letakkan kursor mouse di antara kurung kurawal kode on (release).
6. Berikan Action stop
7. Selanjutnya, klik/pilih tombol play, lalu berikan Action on dengan Code Hints release. Berikan action play yang terdapat di bagian Timeline Control sehingga terbentuklah kode pada Script pane
Untuk melihat hasilnya, klik menu Control > Test Movie. Coba klik tombol stop agar animasi akan berhenti. Untuk memainkan animasi lagi, klik tombol play.
Keterangan Action:
1. stop berfungsi untuk menghentikan movie atau animasi.2. play berfungsi untuk memainkan movie atau animasi.
Langganan:
Postingan (Atom)
