1. Buatlah sebuah flash document.

2. Buatlah sebuah hati seperti di bawah ini :

3. Seleksi shape hati berwarna merah kemudian tekan F8 (ingat hanya shapenya saja, garis hitamnya tidak perlu diseleksi). Pada panel yang muncul masukkan heart_mc sebagai name dan movie clip sebagai type lalu tekan ok.

4. Seleki movie clip heart_mc kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan heart_mc di dalam kotak instance name.

5. Letakkan movie clip heart_mc ini di tengah-tengah stage namun agak ke atas sedikit.

6. Buatlah sebuah dynamic text bertuliskan PUKUL. Seleksi dynamic text ini dan pada panel properties, nonaktifkan tombol selectable dan aktifkan tombol show border around text.

7. Pastikan anda masih menyeleksi dynamic text tadi kemudian tekan F8. Pada panel yang muncul masukkan pukul_btn sebagai name dan button sebagai type lalu tekan ok.

8. Seleksi button pukul_btn di stage kemudian pada panel properties masukkan pukul_btn di dalam kotak instance name.

9. Letakkan button pukul_btn ini di bawah movie clip heart_mc.

10. 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

//membuat variable life dengan nilai 100
life = 100;
//perintah yang dijalankan ketika frame di timeline dimainkan
onEnterFrame = function () {
	//nilai scala x movie clip heart_mc sama dengan nilai variable life
	heart_mc._xscale = life;
	//nilai scala y movie clip heart_mc sama dengan nilai variable life
	heart_mc._yscale = life;
	//jika variable life bernilai kurang dari atau sama dengan 0
	if (life<=0) {
		//ubah nilai variab;e life menjadi 100
		life = 100;
	}
};
//ketika button pukul_btn ditekan
pukul_btn.onPress = function() {
	//variable life dikurangi 5
	life -= 5;
};

11. Tekan Ctrl+Enter untuk melihat hasilnya.

Sourcenya dapat di download di sini

1. Buatlah sebuah flash document.

2. Tekan Ctrl+F7, pada panel Components yang muncul, klik tanda + di samping kiri tulisan User Interface. Kemudian cari component Scroll Pane. Bila sudah ketemu, drag component tersebut ke stage.

3. Seleksi component Scroll Pane di stage lalu tekan Ctrl+F3. Pada panel properties yang muncul klik tab Parameters.

4. Di tab parameters anda akan melihat seperti di bawah ini :

contentPath : Digunakan untuk menuliskan alamat tempat konten anda berada.

Untuk movie clip : tuliskan langsung linkage movie clip tersebut. Misalnya : lingkaran

Untuk file dari hardisk
Bila dalam satu folder dengan fla yang anda buat, anda dapat langsung menuliskan alamatnya beserta type file tersebut. Misalnya : gambar.jpg

Bila filenya berada di dalam folder tapi folder tersebut masih berada di folder tempat fla berada, ada dapat menuliskan nama folder + / + nama file dan type file. Misalnya : gallery/gambar.jpg

Bila filenya tidak berada di dalam folder tenpat fla berada, maka anda harus menuliskan alamatnya secara lengkap. Misalnya : D:/Flash/Gallery/gambar.jpg

Untuk file dari internet : silahkan langsung tuliskan url file secara lengkap tersebut. Misalnya : http://warungflash.com/gambar/maskot.jpg

hLineScrollSize : digunakan untuk mengatur kecepatan konten bergerak ketika tombol panah pada scroll bar yang mendatar ditekan. Silahkan masukkan angka yang diinginkan

hPageScrollSize : digunakan untuk mengatur kecepatan konten bergerak ketika kursor mouse menekan ruang kosong pada scroll bar yang mendatar. Silahkan masukkan angka yang diinginkan

hScrollPolicy : digunakan untuk memunculkan atau menghilangkan scroll bar mendatar. Anda dapat memilih on (memunculkan), off (menghilangkan), atau auto (muncul dan hilang secara otomatis tergantung besarnya konten)

scrollDrag : digunakan untuk membuat konten dapat di drag atau tidak. Anda dapat memilih true (dapat di drag) atau false (tidak dapat di drag). Konten yang di drag hanya bergerak sebatas di dalam scroll pane saja.

vLineScrollSize : digunakan untuk mengatur kecepatan konten bergerak ketika tombol panah pada scroll bar yang menurun ditekan. Silahkan masukkan angka yang diinginkan

vPageScrollSize : digunakan untuk mengatur kecepatan konten bergerak ketika kursor mouse menekan ruang kosong pada scroll bar yang menurun. Silahkan masukkan angka yang diinginkan

vScrollPolicy : digunakan untuk memunculkan atau menghilangkan scroll bar menurun. Anda dapat memilih on (memunculkan), off (menghilangkan), atau auto (muncul dan hilang secara otomatis tergantung besarnya konten)

5. Untuk keperluan tutorial kali ini, kita tidak perlu merubah parameter-parameter yang ada, biarkan nilainya masih tetap default saja. Tetapi kita akan merubah parameter contentPath-nya.

6. Klik tulisan contentPath kemudian isikan pic.jpg

7. Silahkan download gambar berikut : pic.jpg

8. Setelah anda download, silahkan letakkan gambar tersebut di dalam satu folder dengan folder tempat fla anda buat.

9. Tekan Ctrl+Enter untuk melihat hasilnya.

10. Apabila anda merasa scroll pane tampil terlalu kecil. Anda dapat menggunakan Free Transform Tool untuk mengatur besar kecil scroll pane.

Sourcenya dapat di download di sini

Penulisannya :

1
2

warnaku = new Color(instance_name);
warnaku.setRGB(kode warna);

warnaku = adalah variable bebas yang dapat anda ganti misalnya anda ganti abc atau kumpulan.

instance name = anda menggantinya dengan instance name movie clip atau button

kode warna = anda menggantinya dengan kode warna. Misalnya anda menginginkan warna merah maka kodenya 0xFF0000

Untuk mencari tahu kode warna silahkan klik Fill Color. Pada menu yang muncul coba arahkan kursor mouse ke warna putih. Anda akan melihat sebuah kode bertuliskan #FFFFFF. Itulah kode warna untuk putih. Lalu untuk menggabungkan dengan setRGB silahkan ganti tanda # dengan 0x. Sehingga nantinya kode yang anda tulis adalah 0xFFFFF.

Contoh penggunaan setRGB :

1. Buatlah sebuah flash document.

2. Buatlah sebuah lingkaran berwarna merah dengan hitam sebagai warna garisnya.

3. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan lingkaran_mc sebagai name dan movie clip sebagai type lalu tekan ok.

4. Seleksi movie clip lingkaran_mc di stage dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan lingkaran_mc sebagai instance name.

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

1
2
3
4

//digunakan untuk membuat variable warnaku sebagai color object
warnaku = new Color(lingkaran_mc);
//digunakan untuk mengubah warna menjadi biru
warnaku.setRGB(0x0000FF);

6. Tekan Ctrl+Enter untuk melihat hasilnya.

7. Lingkaran yang tadinya merah dan bergaris hitam, sekarang seluruhnya berubah warna menjadi biru karena penggunaan script setRGB.

Sourcenya dapat di download di sini

1
2
3
4

if (kondisi) {
} else {
	//perintah yang ingin dijalankan
}

Sedangakan else if fungsinya hampir sama dengan else hanya saja masih ditambahkan kondisi untuk menjalankan perintah di dalamnya. Penulisannya :

1
2
3
4

if (kondisi) {
} else if (kondisi) {
	//perintah yang ingin dijalankan
}

Contoh penggunaan else :
1. Buatlah sebuah flash document.

2. 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

//membuat variable lempar dengan nilai false
lempar = false;
//jika variable lempar bernilai true
if (lempar == true) {
	//ubah nilai variable kena menjadi true
	kena = true;
	//jika tidak
} else {
	//ubah nilai variable kena menjadi false
	kena = false;
}
//tampilkan nilai variable kena pada panel output
trace(kena);

3. Tekan Ctrl+Enter untuk melihat hasilnya.

4. Akan muncul panel output bertuliskan false. Hal ini terjadi karena kondisi pada if tidak sesuai sehingga perintah yang terdapat pada else dijalankan.

Contoh penggunaan else if :
1. Buatlah sebuah flash document.

2. 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

//membuat variable angka dengan nilai 7
angka = 7;
//jika variable angka bernilai 4
if (angka == 4) {
	//ubah nilai variable bagus menjadi false
	bagus = false;
	//jika tidak dan jika variable angka bernilai 7
} else if (angka == 7) {
	//ubah nilai variable bagus menjadi true
	bagus = true;
}
//tampilkan nilai variable bagus pada panel output
trace(bagus);

3. Tekan Ctrl+Enter untuk melihat hasilnya.

4. Akan muncul panel output bertuliskan true. Hal ini terjadi karena kondisi pada if tidak sesuai dan kondisi pada else if sesuai sehingga perintah yang terdapat pada else if dijalankan.

Misalnya anda ingin mengubah nilai transparansi (_alpha) suatu movie clip. Apabila anda menulis script untuk mengubah nilai transparansi pada frame, anda tidak bisa melakukannya jika movie clip tersebut tidak memiliki instance name. Tetapi anda bisa mengubah nilai transparansi movie clip tersebut jika script untuk mengubah nilai transparansi anda tulis langsung di dalam movie clip.

Berikut ini cara memasukkan instance name pada movie clip atau button di stage :
1. Seleksi movie clip atau button yang anda inginkan di stage.

2. Jika sudah tekan Ctrl+F3. Pada panel properties yang muncul masukkan instance name yang anda inginkan pada kotak bertuliskan instance name.

Masukkan instance name pada kotak yang dilingkari

Contoh : Anda memasukkan player sebagai instance name

Penulisannya :

1
2
3

with (nama variable/instance name){
	//script yang ingin anda singkat
}

Contoh Kasus
Misalnya anda memiliki script seperti di bawah ini :

1
2
3

bola._xscale = 50;
bola._yscale = 50;
bola.gotoAndPlay(2);

Dengan with anda cukup menuliskan seperti ini :

1
2
3
4
5

with (bola) {
	_xscale = 50;
	_yscale = 50;
	gotoAndPlay(2);
}

press : jika mouse menekan movie clip/button maka perintah akan dijalankan

release : jika mouse menekan pada movie clip/button kemudian tekanan tersebut dilepaskan maka perintah akan dijalankan

release outside : jika tekanan pada movie clip/button dilepaskan dan mouse berada diluar area hit maka perintah akan dijalankan

roll over : jika mouse berada area hit movie clip/button maka perintah akan dijalankan

roll out : jika mouse berada di luar area hit movie clip/button maka perintah akan dijalankan

drag out : jika mouse menekan movie clip/button kemudian bergerak keluar area hit maka perintah akan dijalankan

drag over : jika mouse menekan movie clip/button kemudian bergerak keluar area hit lalu kembali lagi ke area hit maka perintah akan dijalankan

Untuk area hit pada button anda dapat mengaturnya melalui frame hit. Untuk lebih jelasnya mengenai frame hit silahkan buka tutorial Membuat Tombol

Sedangkan untuk area hit pada movie clip anda tidak bisa mengaturnya karena areanya tergantung dari objek yang anda buat. Untuk mengetahui luas area hit pada movie clip silahkan seleksi suatu movie clip. Anda akan melihat movie clip yang anda seleksi akan dikelilingi kotak dengan garis berwarna biru. Garis pada kotak itulah tempat dimulainya hit are pada suatu movie clip. Jadi apabila kursor mouse menyentuh kotak dengan garis berwarna biru tersebut maka kursor mouse dikatakan menyentuh area hit .

Penulisannya sebagai berikut :

A. Penulisan script on pada frame

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

onPress=function(){}
 
onRelease=function(){}
 
onReleaseOutside=function(){}
 
onRollOver=function(){}
 
onRollOut=function(){}
 
onDragOver=function(){}
 
onDragOut=function(){}

B. Penulisan script on pada movie clip/button

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

on(press){}
 
on(release){}
 
on(releaseoutside){}
 
on(rollOver){}
 
on(rollOut){}
 
on(dragOver){}
 
on(dragOut){}

Untuk contoh penggunaannya buatlah sebuah aplikasi sederhana berikut ini :

1. Buatlah sebuah flash document.

2. Buatlah sebuah lingkaran di stage. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan lingkaran sebagai name dan button sebagai type lalu tekan ok.

3. Seleksi  button lingkaran di stage kemudian tekan Ctrl+F3. Pada panel properties yang muncul masukkan lingkaran sebagai instance name.

4. Letkkan button lingkaran ini di stage bagian atas.

5. Buatlah sebuah dyanimc text. Seleksi dyanimc text tersebut dan pada panel properties masukkan note sebagai var dan non aktifkan tombol selectable.

6. Letkkan dyanimc text ini di stage bagian bawah.

7. Untuk contoh penggunaan press, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1
2
3
4
5

//ketika kursor mouse menekan button lingkaran
lingkaran.onPress = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

8. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan lingkarannya

9. Untuk contoh penggunaan release, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse menekan button lingkaran kemudian tekanan tersebut dilepaskan
lingkaran.onRelease = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

10. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan lingkarannya lalu lepaskan tekanan tersebut

11. Untuk contoh penggunaan release outside, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse menekan button lingkaran kemudian tekanan tersebut dilepaskan dan kursor mouse tidak berada di area hit button lingkaran
lingkaran.onReleaseOutside = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

12. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan lingkarannya lalu lepaskan tekanan tersebut dan juga gerakkan kursor mouse keluar dari lingkaran

13. Untuk contoh penggunaan roll over, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse berada di area hit button lingkaran
lingkaran.onRollOver = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

14. Tekan Ctrl+Enter untuk melihat hasilnya.

Arahkan kursor mouse ke atas lingkaran

15. Untuk contoh penggunaan roll out, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse berada di area hit kemudian kursor mouse keluar dari area hit button lingkaran
lingkaran.onRollOut = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

16. Tekan Ctrl+Enter untuk melihat hasilnya.

Arahkan kursor mouse ke atas lingkaran lalu arahkan kursor mouse keluar dari lingkaran

17. Untuk contoh penggunaan drag out, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse menekan button lingkaran kemudian kursor mouse bergerak keluar arena hit
lingkaran.onDragOut = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

18. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan lingkarannya lalu arahkan kursor mouse keluar dari lingkaran

19. Untuk contoh penggunaan drag over, klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan ubah seluruh script menjadi seperti berikut :

1
2
3
4
5

//ketika kursor mouse menekan button lingkaran kemudian kursor mouse bergerak keluar arena hit lalu kembali lagi ke area hit
lingkaran.onDragOver = function() {
	//tampilkan tulisan OK pada dynamic text dengan var note
	note = "OK";
};

20. Tekan Ctrl+Enter untuk melihat hasilnya.

Tekan lingkarannya lalu arahkan kursor mouse keluar dari lingkaran dan kembalikan lagi kursor mouse ke atas lingkaran