OBJEK DAPAT DI DRAG

Pada tutorial kali ini kita akan membuat sebuah objek yang dapat didrag ketika mouse ditekan pada objek tersebut dan berhenti di drag ketika tekanan mouse dilepas.

1. Buatlah sebuah lingkaran dan ubah menjadi movieclip.

2. Seleksi movieclip tersebut kemudian tekan F9

3. Akan muncul kotak dialog Action. Tulis actionscript dibawah ini kedalam kotak dialog tersebut :

1 2 3 4 5 6 7 8 9 10

//ketika mouse ditekan on (press) { //movieclip ini dapat didrag startDrag(this); } //ketika melepas tekanan setelah mouse ditekan on (release) { //movieclip ini berhenti didrag stopDrag(); }

4. Test movie dengan menekan CTRL+ENTER.

GELEMBUNG MELETUS

Animasi yang akan kita buat berikut ini berupa gelembung udara yang bergerak ke atas. Apabila kita menyentuh gelembung udara tersebut dengan kursor mouse maka gelembung udara itu akan otomatis menghilang.

1. Buatlah sebuah flash document berwarna biru.

2. Buatlah sebuah lingkaran berwarna biru dengan putih sebagai warna garisnya dan buatlah juga seperempat garis lingkaran berwarna putih yang ditempatkan ditengah lingkaran tersebut seperti gambar di bawah ini :

3. Seleksi lingkaran dan seperempat garis lingkaran tadi kemudian tekan F8. Pada panel yang muncul masukkan gelembung sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah.

4. Hapus movie clip gelembung dari stage kemudian tekan Ctrl+L. Pada panel library yang muncul klik kanan movie clip gelembung dan pilih linkage.

5. Pada panel yang muncul berikan tanda contreng pada Export for ActionScript dan masukkan gelembung sebagai idetifier lalu tekan ok.

6. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45

//perintah yang dijalankan ketika frame ini dimainkan onEnterFrame = function () { //jika nilai acak 10 bernilai 5 if (random(10) == 5) { //masukkan movie clip berlinkage gelembung ke dalam stage dengan posisi x sesuai nilai acak panjang stage dan posisi y sesuai lebar stage ditambah 20 gelembung = attachMovie("gelembung", "gelembung"+_root.getNextHighestDepth(), _root.getNextHighestDepth(), {_x:random(Stage.width), _y:Stage.height+20}); //membuat variable waktu di dalam movie clip gelembung dengan nilai acak 40 gelembung.waktu = random(40); //perintah yang dijalankan ketika frame di dalam movie clip gelembung dimainkan gelembung.onEnterFrame = function() { //koordinat y movie clip ini dikurangi 5 //movie clip gelembung bergerak ke atas this._y -= 5; //variable waktu movie clip ini ditambah 1 this.waktu++; //jika nilai variable waktu kurang dari 20 if (this.waktu<20) { //koordinat x movie clip ini ditambah 1 //movie clip gelembung bergerak ke kanan this._x++; } //jika nilai variable waktu lebih dari 20 dan jika nilai variable waktu kurang dari 40 if (this.waktu>20 && this.waktu<40) { //koordinat x movie clip ini dikurangi 1 //movie clip gelembung bergerak ke kiri this._x--; } //jika nilai variable waktu lebih dari 40 if (this.waktu>40) { //ubah nilai variable waktu menjadi 0 this.waktu = 0; } //jika koordinat y movie clip ini kurang dari -20 if (this._y<-20) { //hapus move clip ini removeMovieClip(this); } }; //ketika mouse berada di atas movie clip gelembung gelembung.onRollOver = function() { //hapus movie clip ini removeMovieClip(this); }; } };

7. Tekan Ctrl+Enter untuk melihat hasilnya.

HUJAN DAN RIAK

Sebelumnya kita pernah membuat animasi hujan. Tetapai pada animasi hujan sebelumnya tidak ada riak air ketika hujan jatuh. Oleh karena itu pada tutorial kali ini kita akan membuat sebuah animasi hujan yang disertai riak air apabila hujan tersebut menyentuh tanah.

1. Buatlah sebuah flash document.

2. Buatlah garis lingkaran berwarna hitam. Seleksi garis lingkaran ini kemudian tekan F8. Pada panel yang muncul masukkan garis_lingkaran sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

3. Seleksi movie clip garis_lingkaran di stage kemudian tekan F8. Pada panel yang muncul masukkan riak sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

4. Klik kanan movie clip riak kemudian pilih Edit. Anda akan masuk ke dalam stage movie clip riak. Ubah bentuk movie clip garis_lingkaran menjadi seperti di bawah ini :

5. Klik kanan frame 15 kemudian tekan F6. Ubah ukuran movie clip garis_lingkaran pada frame 15 menjadi seperti di bawah ini :

6. Pastikan anda masih menyeleksi movie clip garis_lingkaran di frame 15 kemudian tekan Ctrl+F3. Pada panel properties yang muncul ubah Color menjadi Alpha 0%.

7. Klik kanan frame 1 dan pilih Create Motion Tween. Seleksi frame 15 kemudian tekan F9. Pada panel actions yang muncul masukkan script berikut :

1

stop();

8. Tekan Ctrl+E untuk kembali ke stage scene 1. Hapus movie clip riak yang ada di stage.

9. Buatlah sebuah garis miring berwarna hitam. Seleksi garis ini kemudian tekan F8. Pada panel yang muncul masukkan garis_miring sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

10. Seleksi movie clip garis_miring di stage kemudian tekan F8. Pada panel yang muncul masukkan hujan sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

11. Klik kanan movie clip hujan kemudian pilih Edit. Anda akan masuk ke dalam stage movie clip hujan. Ubah bentuk dan posisi movie clip garis_miring menjadi seperti di bawah ini :

12. Klik kanan frame 14 kemudian tekan F6. Ubah letak movie clip garis_miring di frame 14 seperti gambar di bawah ini :

13. Seleksi frame 15 kemudian tekan F7. Pastikan anda masih berada di frame 15 kemudian tekan Ctrl+L. Pada panel library yang muncul drag movie clip riak ke dalam stage dan letakkan ditengah-tengah titik registration seperti gambar di bawah ini :

14. Seleksi movie clip riak di frame 15 kemudian pada panel properties masukkan riak sebagai instance name. Klik frame 15 kemudian pada panel actions masukkan script berikut :

1

stop();

15. Klik kanan frame 1 kemudian pilih Create Motion Tween. Jika sudah tekan Ctrl+E untuk kembali ke stage scene 1. Hapus movie clip hujan yang ada di stage.

16. Klik kanan movie clip hujan yang ada di panel library kemudian pilih Linkage. Pada panel yang muncul berikan tanda contreng pada Export for ActionScript dan masukkan hujan sebagai identifier kemudian tekan ok.

17. Klik frame 1 dan pada panel actions masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

//membuat variable waktu dengan nilai 0 waktu = 0; //perintah yang dijalankan ketika frame ini dimainkan onEnterFrame = function () { //nilai variable waktu ditambah 1 waktu++; //jika nilai variable waktu sama dengan 2 if (waktu == 2) { //masukkan movie clip dengan identifier hujan ke dalam stage dengan instance name hujan pada kedalaman paling atas, pada p0sisi x sesuai nilai acak 300 yang ditambah 50 dan posisi y sesuai nilai acak 300 yang ditambah 50 hujan = attachMovie("hujan", "hujan", _root.getNextHighestDepth(), {_x:random(300)+50, _y:random(350)+50}); //perintah yang dijalankan ketika frame pada movie clip hujan dimainkan hujan.onEnterFrame = function() { //jika movie clip ini berada di frame 10 dan movie clip riak yang terdapat di dalam movie clip ini berada di frame 15 if (this._currentframe == 10 && this.riak._currentframe == 15) { //hapus movie clip ini dari stage this.removeMovieClip(); } }; //ubah nilai variable waktu menjadi 0 waktu = 0; } };

18. Tekan Ctrl+Enter untuk melihat hasilnya.

SCROLLING BACKGROUND DENGAN TOMBOL KEYBOARD

Kali ini kita akan memodifikasi tutorial scrolling background dengan motion tween. Kita akan membuat background bergerak hanya jika tombol panah kanan/kiri pada keyboard ditekan.
1. Bukalah fla dari tutorial scrolling background dengan motion tween.
2. Tekan tombol insert layer pada timeline sehingga akan muncul layer baru bernama Layer 2. Klik frame 1 Layer 2 kemudian buatlah sebuah lingkaran kecil berwarna kuning dengan hitam sebagai warna garisnya.
3. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan pemain sebagai name dan movie clip sebagai type lalu tekan ok.
4. Seleksi movie clip pemain di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan pemain sebagai instance name. Letakkan movie clip pemain ini pada stage bagian kiri atas.
5. Klik frame 1 Layer 2 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

//membuat variable kecepatan dengan nilai 2 kecepatan = 2; //membuat variable angka dengan nilai 1 angka = 1; //perintah yang dijalankan jika frame pada movie clip pemain dimainkan pemain.onEnterFrame = function() { //jika tombol panah kiri pada keyboard ditekan if (Key.isDown(Key.LEFT)) { //koordinat x movie clip ini dikurangi nilai variable kecepatan this._x -= kecepatan; //nilai variable angka dikurangi 1 angka--; //jika nilai variable angka kurang dari 1 if (angka<1) { //ubah nilai variable angka menjadi jumlah frame pada timeline scene 1 angka = _totalframes; } } //jika tombol panah kanan pada keyboard ditekan if (Key.isDown(Key.RIGHT)) { //koordinat x movie clip ini ditambah nilai variable kecepatan this._x += kecepatan; //nilai variable angka ditambah 1 angka++; //jika nilai variable angka lebih dari jumlah frame pada timeline scene 1 if (angka>_totalframes) { //ubah nilai variable angka menjadi 1 angka = 1; } } //jika tombol panah atas pada keyboard ditekan if (Key.isDown(Key.UP)) { //koordinat y movie clip ini dikurangi nilai variable kecepatan this._y -= kecepatan; } //jika tombol panah bawah pada keyboard ditekan if (Key.isDown(Key.DOWN)) { //koordinat y movie clip ini ditambah nilai variable kecepatan this._y += kecepatan; } //mainkan frame pada scene 1 sesuai nilai pada variable angka gotoAndStop(angka); };

6. Tekan Ctrl+Enter untuk melihat hasilnya.

JAM ANALOG

Pada tutorial yang lalu, kita telah mempelajari cara membuat jam digital. Kali ini kita akan mempelajari cara membuat sebuah jam analog. Tampilan jam analog yang akan kita buat di sini masih sederhana. Anda dapat mengembangkannya dengan memperbaiki bagian grafiknya. Sehingga nantinya jam akan terlihat lebih bagus lagi.
1. Buatlah flash document.
2. Buatlah sebuah gambar seperti di bawah ini. Anda dapat menggunakan oval tool, text tool, dan panel transform untuk membuatnya.

3. Untuk garisnya kami akan membuat ukurannya seperti ini : garis jam lebih panjang dari garis menit, garis menit lebih panjang dari garis detik, garis detik lebih panjang dari garis jam Anda dapat mengubah ukurannya sesuai keinginan anda.
4. Buatlah tiga buah garis seperti gambar di bawah ini :

5. Seleksi garis yang paling kecil, kemudian tekan F8. Pada panel yang muncul masukkan jam_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.

6. Seleksi movie clip jam_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan jam_mc sebagai instance name.
7. Seleksi garis kedua (garis yang tidak terlalu panjang), kemudian tekan F8. Pada panel yang muncul masukkan detik_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
8. Seleksi movie clip detik_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan detik_mc sebagai instance name.
9. Seleksi garis ketiga (garis yang paling panjang), kemudian tekan F8. Pada panel yang muncul masukkan menit_mc dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah bagian bawah lalu tekan ok.
8. Seleksi movie clip menit_mc di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan menit_mc sebagai instance name.
9. Letakan movie clip jam_mc di tengah lingkaran yang kita buat sebelumnya.

10. Selanjutnya letakan movie clip menit_mc di tengah lingkaran (ditempat yang sama movie clip jam_mc berada).

11. Lalu letakan juga movie clip detik_mc di tengah lingkaran (ditempat yang sama movie clip jam_mc dan menit_mc berada).

12. Setelah semuanya terpasang, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22

//perintah yang dijalankan ketika frame dimainkan onEnterFrame = function () { //membuat variable waktu sebagai date object waktu = new Date(); //membuat variable jam dengan nilai sama dengan jam pada komputer jam = waktu.getHours(); //membuat variable menit dengan nilai sama dengan menit pada komputer menit = waktu.getMinutes(); //membuat variable detik dengan nilai sama dengan detik pada komputer detik = waktu.getSeconds(); //digunakan jika komputer menggunakan sistem 12 jam //jika nilai variable jam lebih dari 12 maka akan dikurangi 12 if (jam>12) { jam -= 12; } //movie clip jam_mc akan berotasi sesuai nilai variable jam dikali 30 yang ditambah nilai variable menit di bagi 2 jam_mc._rotation = jam*30+(menit/2); //movie clip jam_mc akan berotasi sesuai nilai variable menit dikali 6 menit_mc._rotation = menit*6; //movie clip detik_mc akan berotasi sesuai nilai variable detik dikali 6 detik_mc._rotation = detik*6; };

13. Tekan Ctrl+Enter untuk melihat hasilnya.

SLIDESHOW DENGAN TOMBOL

Kali ini kita akan membuat sebuah slideshow gambar. Gambar akan berganti secara otomatis dalam waktu yang sudah ditentukan. Gambar juga akan berganti jika anda menekan tombol 1 sampai 5 dan juga tombol next.
1. Buatlah sebuah flash document.
2. Buatlah sebuah persegi berukuran cukup besar berwarna putih dengan hitam sebagai warna garisnya. Buatlah sebuah static text bertuliskan Gambar 1. Letakkan static text ini di tengah tengah kotak yang anda buat.

3. Seleksi kotak dan static text yang dibuat dan tekan F8. Pada panel yang muncul masukkan gambar sebagai name dan movie clip sebagai type lalu tekan ok.
4. Seleksi movie clip gambar dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan gambar sebagai instance name
5. Klik kanan movie clip gambar dan pilih edit. Anda akan masuk ke dalam stage movie clip gambar.
6. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1

stop();

7. Klik kanan frame 1 dan pilih copy frames. Klik kanan frame 2 dan pilih paste frame. Klik kanan frame 3 dan pilih paste frame. Klik kanan frame 4 dan pilih paste frame. Klik kanan frame 5 dan pilih paste frame.
8. Ubah tulisan Gambar 1 pada static text di frame 2 menjadi Gambar 2. Ubah tulisan Gambar 1 pada static text di frame 3 menjadi Gambar 3. Ubah tulisan Gambar 1 pada static text di frame 4 menjadi Gambar 4. Ubah tulisan Gambar 1 pada static text di frame 5 menjadi Gambar 5.
9. Tekan Ctrl+E untuk kembali ke stage scene 1. Buatlah sebuah persegi berukuran kecil berwarna putih dengan hitam sebagai warna garisnya. Seleksi persegi ini dan tekan F8.
10. Pada panel yang muncul masukkan kotak sebagai name dan movie clip sebagai type lalu tekan ok. Seleksi movie clip kotak lalu tekan Ctrl+D sebanyak 5 kali sehingga di stage muncul movie clip kotak sebanyak 6 buah.
11. Buatlah 6 buah static text masing-masing bertuliskan 1, 2, 3, 4, 5, Next.
12. Letakkan 6 buah movie clip kotak tersebut seperti gambar di bawah ini. Ubah ukuran movie clip kotak menggunakan Free Transform Tool agar sesuai dengan gambar di bawah ini.

13. Masukkan instance name pada masing-masing movie clip kotak seperti gambar di bawah ini :

14. Klik frame 1 dan masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89

//membuat variable no dengan nilai 1 no = 1; //membuat variable waktu dengan nilai 0 waktu = 0; //membuat variable jumlah_frame dengan nilai 5 jumlah_frame = 5; //membuat variable i dengan nilai 1 sampai bernilai sesuai nilai variable jumlah_frame for (i=1; i<=jumlah_frame; i++) { //nilai variable id pada movie clip kotak+i sama dengan nilai pada variable i _root["kotak"+i].id = i; //ketika movie clip kotak+i ditekan _root["kotak"+i].onPress = function() { //nilai variable no sama dengan nilai variable id movie clip ini no = this.id; //ubah nilai variable waktu menjadi 0 waktu = 0; }; //ketika kursor mouse berada di atas movie clip kotak+i _root["kotak"+i].onRollOver = function() { //mainkan frame 2 movie clip ini this.gotoAndStop(2); }; //ketika kursor mouse tidak berada di atas movie clip kotak+i _root["kotak"+i].onRollOut = function() { //jika nilai variable id movie clip ini tidak sama dengan nilai variable no if (this.id != no) { //mainkan frame 1 movie clip ini this.gotoAndStop(1); } }; } //perintah yang dijalankan ketika frame pada movie clip gambar dimainkan gambar.onEnterFrame = function() { //nilai variable waktu ditambah 1 waktu++; //jika nilai variable waktu sama dengan 1 if (waktu == 1) { //membuat variable i dengan nilai 1 sampai bernilai sesuai nilai variable jumlah_frame for (i=1; i<=jumlah_frame; i++) { //mainkan frame 1 movie clip kotak+i _root["kotak"+i].gotoAndStop(1); } //mainkan frame 2 movie clip kotak+no _root["kotak"+no].gotoAndStop(2); //ubah nilai transparansi movie clip ini menjadi 0 this._alpha = 0; } //jika nilai transparansi movie clip ini kurang dari 100 if (this._alpha<100) { //nilai tranparansi movie clip ini ditambah 5 this._alpha += 5; } //jika variable waktu bernilai 80 if (waktu == 80) { //jalankan fungsi reset reset(); //ubah nilai transparansi movie clip ini menjadi 0 this._alpha = 0; } //mainkan frame movie clip ini sesuai nilai variable no this.gotoAndStop(no); }; //ketika movie clip kotak_next ditekan kotak_next.onPress = function() { //jalankan fungsi reset reset(); }; //ketika kursor mouse berada di atas movie clip kotak_next kotak_next.onRollOver = function() { //mainkan frame 2 movie clip ini this.gotoAndStop(2); }; //ketika kursor mouse tidak berada di atas movie clip kotak_next kotak_next.onRollOut = function() { //mainkan frame 1 movie clip ini this.gotoAndStop(1); }; //membuat fungsi bernama reset function reset() { //nilai variable no ditambah 1 no += 1; //jika nilai variable no lebih dari nilai variable jumlah_frame if (no>jumlah_frame) { //ubah nilai variable no menjadi 1 no = 1; } //ubah nilai variable waktu menjadi 0 waktu = 0; }

15. Tekan Ctrl+Enter untuk melihat hasilnya.

MEMASUKKAN HURUF DAN GAMBAR

Kali ini kita akan mempelajari bagaimana memunculkan gambar dan huruf secara bersamaan ketika sebuah tombol ditekan.Jumlah huruf dan gambar yang digunakan dalam tutorial ini adalah 4. Apabila anda ingin menggunakan gambar dan huruf lebih dari 4 anda dapat mengubah sedikit scriptnya. Tutorial ini cocok bagi anda yang ingin membuat aplikasi untuk anak-anak seperti misalnya memperkenalkan huruf kepada anak dengan menampilkan gambar sebagai contoh penggunaan hurufnya.
1. Buatlah sebuah flash document.
2. Buatlah 2 buah static text masing-masing bertuliskan Huruf : dan Gambar :
3. Buatlah sebuah dynamic text di stage. Seleksi dynamic text tersebut dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan huruf_tampil sebagai var serta nonaktifkan tombol selectable dan show border around text.
4. Buatlah sebuah persegi berwarna putih dengan hitam sebagai warna garisnya. Buatlah sebuah garis miring dari sudut kanan atas persegi ke sudut kiri bawah persegi.
5. Seleksi persegi dan garis miring tadi kemudian tekan F8. Pada panel yang muncul masukkan gambar_tampil sebagai name dan movie clip sebagai type lalu tekan ok.
6. Seleksi movie clip gambar tampil dan pada panel propertiesnya masukkan gambar_tampil sebagai instance name.
7. Buatlah 4 buah dynamic text dengan masing-masing bertuliskan A, B, C, D. Seleksi ke empat dynamic text tadi dan pada panel propertiesnya nonaktifkan tombol selectable dan aktifkan tombol show border around text.
8. Buatlah sebuah invisible button di stage. Seleksi invisible button tersebut dan tekan Ctrl+D sebanyak 3 kali sehingga di stage terdapat 4 buah invisible button.
9. Atur letak dan ukuran ke empat invisible button sampai menutupi 4 buah dynamic text (A,B,C,D).
10. Seleksi invisible button yang menutupi dynamic text bertuliskan A kemudian pada panel propertiesnya masukkan 1_btn sebagai instance name.
11.Seleksi invisible button yang menutupi dynamic text bertuliskan B kemudian pada panel propertiesnya masukkan 2_btn sebagai instance name.
12.Seleksi invisible button yang menutupi dynamic text bertuliskan C kemudian pada panel propertiesnya masukkan 3_btn sebagai instance name.
13. Seleksi invisible button yang menutupi dynamic text bertuliskan D kemudian pada panel propertiesnya masukkan 4_btn sebagai instance name.
14. Letakkan seluruh objek yang dibuat tadi seperti gambar di bawah ini :

15. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31

//membuat array bernama array_huruf berisi A, B, C, D //apabila anda ingin menambahkan huruf silahkan tulis huruf yang anda ingin masukkan di antara dua tanda petik dengan koma dan spasi sebagai pemisah antara huruf //contoh : array_huruf = ["K", "L", "M", "M", "N", "O", "P"]; array_huruf = ["A", "B", "C", "D"];   //memberikan tanda - pada dynamic text dengan var huruf_tampil huruf_tampil = "-";   //membuat variable i dengan nilai i=1, i=2, i=3, i=4 //jika anda mengubah jumlah huruf pada array_huruf anda juga harus mengubah perulanagn i ini //contohnya pada array_huruf terdapat 10 buah huruf maka ubah tulisan i<=4 pmenjadi i<=10 for (i=1; i<=4; i++) { //membuat variable no pada i+_btn dengan nilai i _root[i+"_btn"].no = i; //ketika tombol i_btn ditekan _root[i+"_btn"].onPress = function() { //tampilkan huruf yang terdapat pada array_huruf sesuai nilai no button ini dikurangi 1 pada dynamix text bervar huruf_tampil huruf_tampil = array_huruf[this.no-1]; //jalankan fungsi masukkan_gambar dengan nilai angka sama dengan nilai no pada button ini masukkan_gambar(this.no); }; }   //membuat fungsi masukkan_gambar function masukkan_gambar(angka) { //hapus movie clip berinstance name gambar di stage removeMovieClip(gambar); //memasukkan movie clip dengan instance name gambar di stage //movie clip yang dimasukkan adalah movie clip yang berlinkage gambar ditambah nilai variable angka, dengan nama baru gambar, pada kedalaman paling atas, dengan posisi x sama dengan posisi x gambar_tampil dan posisi y sama dengan posisi y gambar tampil gambar = attachMovie("gambar"+angka, "gambar", _root.getNextHighestDepth(), {_x:gambar_tampil._x, _y:gambar_tampil._y}); }

16. Klik kanan frame 2 dan pilih Insert Blank Keyframe.
17. Buatlah 4 buah persegi dengan panjang dan lebar sama dengan panjang dan lebar persegi pada movie clip gambar_tampil di frame 1.
18. Jika sudah tekan Ctrl+R. Pada panel yang muncul cari 4 buah gambar yang diinginkan kemudian tekan open.
19. Atur letak 4 buah gambar yang baru d import ke tengah tengah 4 buah persegi. 1 buah persegi mendapatkan 1 buah gambar.
20. Seleksi gambar dan persegi pertama lalu tekan F8. Pada panel yang muncul masukkan gambar1 sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.
21. Seleksi gambar dan persegi kedua lalu tekan F8. Pada panel yang muncul masukkan gambar2 sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.
22. Seleksi gambar dan persegi ketiga lalu tekan F8. Pada panel yang muncul masukkan gambar3 sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.
23. Seleksi gambar dan persegi keempat lalu tekan F8. Pada panel yang muncul masukkan gambar4 sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.
24. Klik kanan frame 2 dan pilih remove frame lalu tekan Ctrl+L. Pada panel library yang muncul klik kanan movie clip gambar 1 dan pilih linkage. Pada panel yang muncul berikan tanda centang pada Export for Actionscript dan masukkan gambar1 sebagai identifier.
25. Lakukan hal yang sama pada movie clip gambar2-4. Untuk idnetifernya masukkan sesuai name movie clipnya sehingga pada panel library terdapat 4 buah movie clip yaitu gambar1-gambar4 dengan masing-masing memiliki identifier yang sama dengan namanya.

26. Tekan Ctrl+Enter untuk melihat hasilnya.

MENGONTROL ROTASI OBJEK

Pada tutorial di bawah ini kita akan membuat sebuah objek yang dapat dikontrol arah rotasinya. Kontrol yang digunakan adalah mouse. Jadi jika mouse digerakan, arah putaran rotasi objek juga ikut berubah sesuai letak kursor mouse.
1. Buatlah sebuah flash document.
2. Buatlah sebuah objek seperti gambar di bawah ini :

3. Seleksi objek tersebut dan tekan F8. Pada panel yang muncul masukkan segitiga sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.
4. Seleksi movie clip segitiga di stage lalu tekan Ctrl+F3. Pada panel properties yang muncul masukkan segitiga dalam kotak instance name.
5. Klik frame 1 dan ekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11

segitiga.onEnterFrame = function() { jarak = Math.sqrt(Math.pow(_root._xmouse-segitiga._x, 2)+Math.pow(_root._ymouse-segitiga._y, 2)); sudut = Math.asin((_root._xmouse-segitiga._x)/jarak); sudut = sudut*(180/Math.PI); if (_root._ymouse>segitiga._y) { if ((_root._xmouse>segitiga._x) || (_root._xmouse<segitiga._x)) { sudut = 180-sudut; } } segitiga._rotation = sudut; };

6. Tekan Ctrl+Enter untuk melihat hasilnya.

SLIDER OBJEK

Hampir sama pada tutorial sound slider. Kali ini kita tidak akan mengubah volume suara tetapi mengubah ukuran suatu objek.
1. Buatlah sebuah flash document.
2. Buatlah sebuah persegi dengan ukuran panjang 5px dan lebar 20px. Seleksi persegi tersebut dan  tekan F8. Pada panel yang muncul masukkan kotak2 sebagai name dan movie clip sebagai type serta titik registrationnya berada di tengah-tengah lalu tekan ok.
3. Seleksi movie clip kotak2 di stage dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan kotak2 sebagai instance name.
4. Pastikan anda masih menyeleksi movie clip kotak2 lalu tekan F8. Pada panel yang muncul masukkan kotak1 sebagai name dan movie clip sebgai type serta titik registrationnya berada di tengah-tengah lalu tekan ok. 5. Seleksi movie clip kotak1 dan masukkan kotak1 sebagai instance name pada panel properties. 6. Klik kanan movie clip kotak1 dan pilih Edit maka anda akan masuk ke dalam stage movie clip kotak1. 7. Buatlah sebuah persegi dengan panjang 100px dan lebar 5px. Letakkan seperti pada gambar di bawah ini :

Letakkan persis seperti gambar di atas

8. Tekan Ctrl+E untuk kembali ke stage scene 1.
9. Buatlah sebuah lingkaran, seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan lingkaran sebagai name dan movie clip sebagai type lalu tekan ok.
10. Seleksi movie clip lingkaran di stage dan masukkan lingkaran sebagai instance name pada panel properties.
11. Buatlah sebuah dynamic text, seleksi dynamic text tersebut dan masukkan angka sebagai Var pada panel properties
12. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12

kotak1.kotak2._x = 100; kotak1.kotak2.onEnterFrame = function() { angka = 0+this._x; lingkaran._xscale = 0+this._x; lingkaran._yscale = 0+this._x; }; kotak1.kotak2.onPress = function() { startDrag(this, false, 0, this._y, 100, this._y); }; kotak1.kotak2.onRelease = kotak1.kotak2.onReleaseOutside=function () { stopDrag(); };

13. Tekan Ctrl+Enter untuk melihat hasilnya.

GERAKAN ELASTIS OBJEK

Hasil yang akan kita peroleh melalu tutorial ini berupa sebuah objek yang koordinat x dan y nya akan berada di x dan y mouse apabila mouse ditekan serta akan kembali ketempat semula apabila tekanan pada mouse dilepaskan.
1. Buatlah sebuah flash document.a
2. Buatlah sebuah lingkaran. Seleksi lingkaran tersebut dan tekan F8. Pada kotak dialog yang muncul masukkan lingkaran sebagai name dan movie clip sebagai type lalu tekan ok.
3. Seleksi movie clip lingkaran di stage dan Ctrl+F3. Pada panel properties yang muncul masukkan lingkaran di dalam kotak instance name.
4. Klik frame 1 dan tekan F9. Pada kotak actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50

//membuat variable targetX dengan nilai koordinat x awal lingkaran targetX = lingkaran._x; //membuat variable targetY dengan nilai koordinat y awal lingkaran targetY = lingkaran._y; //membuat variable kecepatanX dengan nilai 0 kecepatanX = 0; //membuat variable kecepatanY dengan nilai 0 kecepatanY = 0; //membuat variable gerak dengan nilai 1 gerak = 1; //membuat variable kecepatan dengan nilai 10 kecepatan = 10; //membuat variable perlambat dengan nilai 1.2 perlambat = 1.2; lingkaran.onEnterFrame = function() { //jika variable gerak bernilai 1 if (gerak == 1) { //posisi x movie clip ini ditambah nilai kecepatanX this._x += kecepatanX; //posisi y movie clip ini ditambah nilai kecepatanY this._y += kecepatanY; //menghitung nilai kecepatanX dan kecepatanY kecepatanX += (targetX-this._x)/kecepatan; kecepatanY += (targetY-this._y)/kecepatan; //kecepatanX dan kecepatanY dibagi perlambat kecepatanX /= perlambat; kecepatanY /= perlambat; } //jika variable gerak bernilai 2 if (gerak == 2) { //posisi x movie clip ini sama dengan posisi x kursor mouse this._x = _root._xmouse; //posisi y movie clip ini sama dengan posisi y kursor mouse this._y = _root._ymouse; //nilai kecepatanX diubah menjadi 0 kecepatanX = 0; //nilai kecepatanY diubah menjadi 0 kecepatanY = 0; } }; //ketika mouse ditekan onMouseDown = function () { //ubah nilai variable gerak menjadi 2 gerak = 2; }; //ketika mouse tidak ditekan onMouseUp = function () { //ubah nilai variable gerak menjadi 1 gerak = 1; };

5. Tekan Ctrl+Enter untuk melihat hasilnya.

SCROLLING BACKGROUND DENGAN MOTION TWEEN

Kali ini kita akan memodifikasi tutorial scrolling background dengan motion tween. Kita akan membuat background bergerak hanya jika tombol panah kanan/kiri pada keyboard ditekan.
1. Bukalah fla dari tutorial scrolling background dengan motion tween.
2. Tekan tombol insert layer pada timeline sehingga akan muncul layer baru bernama Layer 2. Klik frame 1 Layer 2 kemudian buatlah sebuah lingkaran kecil berwarna kuning dengan hitam sebagai warna garisnya.
3. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan pemain sebagai name dan movie clip sebagai type lalu tekan ok.
4. Seleksi movie clip pemain di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan pemain sebagai instance name. Letakkan movie clip pemain ini pada stage bagian kiri atas.
5. Klik frame 1 Layer 2 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43

//membuat variable kecepatan dengan nilai 2 kecepatan = 2; //membuat variable angka dengan nilai 1 angka = 1; //perintah yang dijalankan jika frame pada movie clip pemain dimainkan pemain.onEnterFrame = function() { //jika tombol panah kiri pada keyboard ditekan if (Key.isDown(Key.LEFT)) { //koordinat x movie clip ini dikurangi nilai variable kecepatan this._x -= kecepatan; //nilai variable angka dikurangi 1 angka--; //jika nilai variable angka kurang dari 1 if (angka<1) { //ubah nilai variable angka menjadi jumlah frame pada timeline scene 1 angka = _totalframes; } } //jika tombol panah kanan pada keyboard ditekan if (Key.isDown(Key.RIGHT)) { //koordinat x movie clip ini ditambah nilai variable kecepatan this._x += kecepatan; //nilai variable angka ditambah 1 angka++; //jika nilai variable angka lebih dari jumlah frame pada timeline scene 1 if (angka>_totalframes) { //ubah nilai variable angka menjadi 1 angka = 1; } } //jika tombol panah atas pada keyboard ditekan if (Key.isDown(Key.UP)) { //koordinat y movie clip ini dikurangi nilai variable kecepatan this._y -= kecepatan; } //jika tombol panah bawah pada keyboard ditekan if (Key.isDown(Key.DOWN)) { //koordinat y movie clip ini ditambah nilai variable kecepatan this._y += kecepatan; } //mainkan frame pada scene 1 sesuai nilai pada variable angka gotoAndStop(angka); };

6. Tekan Ctrl+Enter untuk melihat hasilnya.