Warung Flash

Di tutorial ini kita akan mengattach/memasukkan movie clip berlinkage ke dalam sebuah animasi tween.

1. Buatlah sebuah persegi dengan warna biru tanpa garis. Seleksi persegi terebut dan tekan F8. Pada kotak dialog yang muncul masukkan kotak sebagai Name dan movie clip sebagai Type lalu tekan OK.

2. Seleksi movie clip kotak tadi dan tekan Ctrl+F3. Masukkan kotak sebagai instance name di panel properties.

3. Pastikan anda masih menyeleksi movie clip kotak tadi dan tekan F8. Pada kotak dialog yang muncul masukkan tween_kotak sebagai Name dan movie clip sebagai type lalu tekan OK.

4. Seleksi movie clip tween tadi dan tekan Ctrl+F3. Masukkan tween sebagai instance name di panel properties. Klik 2 kali movie clip tween untuk masuk ke dalam stagenya.

5. Pada frame 1 buatlah movie clip kotak menjadi kecil seperti di bawah ini :

Ukuran kotak di frame 1

6. Klik kanan frame 10 dan pilih Insert Keyframe. Ubah movie clip kotak menjadi seperti di bawah ini :

Ukuran kotak di frame 10

7. Klik kanan frame 15 dan pilih Insert Keyframe. Ubah movie clip kotak menjadi seperti di bawah ini :

Ukuran kotak di frame 15

8. Klik kanan frame 1 dan pilih Create Motion Tween.

9. Klik kanan frame 10 dan pilih Create Motion Tween.

10. Klik frame 15 dan tekan F9. Pada kotak dialog yang muncul masukkan script berikut :

1
2

//hentikan animasi
stop();

11. Tekan Ctrl+E untuk kembali ke stage scene 1.

12. Buatlah objek seperti di bawah ini :

Gambar objek 1

13. Seleksi objek tersebut dan tekan F8. Pada kotak dialog yang muncul masukkan gambar1 sebagai Name dan movie clip sebagai Type lalu tekan OK. Seleksi movie clip gambar1 tadi dan tekan Ctrl+F3. Masukkan gambar1_btn sebagai Instance name di panel properties.

14. Buatlah objek seperti di bawah ini :

Gambar objek 2

15. Seleksi objek tersebut dan tekan F8. Pada kotak dialog yang muncul masukkan gambar2 sebagai Name dan movie clip sebagai Type lalu tekan OK. Seleksi movie clip gambar1 tadi dan tekan Ctrl+F3. Masukkan gambar2_btn sebagai Instance name di panel properties.

16. Letakkan objek-objek yang kita buat tadi seperti di bawah ini :

Ubah ukuran movie clip gambar1 dan gambar2 jika terlalu besar

17. Tekan Ctrl+L untuk membuka panel Library. Klik kanan movie clip gambar1 di Library dan pilih Linkage. Pada kotak dialog yang muncul berikan tanda contreng/centang di Export for ActionScript dan masukkan gambar1 sebagai Identifier lalu tekan OK.

18. Klik kanan movie clip gambar2 di Library dan pilih Linkage. Pada kotak dialog yang muncul berikan tanda contreng/centang di Export for ActionScript dan masukkan gambar2 sebagai Identifier lalu tekan OK.

19. Klik frame 1 dan tekan F9. pada kotak dialog yang muncul masukkan script berikut :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

//ketika movie clip gambar1_btn ditekan
gambar1_btn.onRelease = function() {
	//masukkan movie clip berlinkage gambar1 ke dalam kotak di tween dengan nama gambar1 dan pada level kedalaman 1
	tween.kotak.attachMovie("gambar1", "gambar1", 1);
	//mainkan frame 1 movie clip tween
	tween.gotoAndPlay(1);
};
//ketika movie clip gambar2_btn ditekan
gambar2_btn.onRelease = function() {
	//masukkan movie clip berlinkage gambar2 ke dalam kotak di tween dengan nama gambar2 dan pada level kedalaman 1
	tween.kotak.attachMovie("gambar2", "gambar2", 1);
	//mainkan frame 1 movie clip tween
	tween.gotoAndPlay(1);
};
//jalankan fungsi onRelease gambar1_btn saat swf pertama kali dimainkan
gambar1_btn.onRelease();

20. Terakhir klik kanan movie clip kotak di Library dan pilih Edit. Ubah warna kotak menjadi putih atau tergantung dari warna stage.

21. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan tombol untuk merubah gambar

22. Objek pada movie clip gambar1 dan gambar2 dapat anda ganti dengan picture misalnya *jpg

Sourcenya dapat di download di sini