Kamis, 22 Oktober 2009

Ular Tangga Player Vs Player

Saat anda kecil pasti sering memainkan jenis permainan ini. Ular Tangga adalah jenis permainan di mana pemain menggerakkan karakternya sesuai dengan nilai dadu. Apabila karakter menyentuh tangga bagian bawah maka karakter akan bergerak ke atas sampai ujung bagian atas tangga. Apabila karakter menyentuh kepala ular maka karakter akan turun sampai ekor ular. Pada tutorial kali ini kita akan membuatnya untuk dimainkan oleh 2 orang.

1. Buatlah sebuah flash document.

2. Klik tombol Insert Layer di timeline sebanyak 4 kali. Ubah nama masing-masing layer berdasarkan urutan paling atas menjadi script, pemain, ular tangga, angka, kotak.

timeline

3. Klik frame 1 layer kotak. Buatlah sebuah persegi di stage. Seleksi persegi tersebut dan tekan F8. Pada panel yang muncul masukkan kotak sebagai name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

4. Buka panel library dengan menekan Ctrl+L pada keyboard. Drag movie clip kotak di panel library ke stage hingga movie clip kotak di stage berjumlah 100.

5. Klik salah satu kotak dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan kotak1 sebagai instace name. Klik salah satu kotak lagi dan berikan kotak2 sebagai instace name. Lakukan hal ini pada seluruh movie clip kotak hingga masing-masing movie clip kotak memiliki instance name.

6. Letakkan seluruh movie clip kotak seperti gambar di bawah ini dan perhatikan instace name penempatannya:

kotak

7. Klik frame 1 layer angka. Buatlah 10 buah static text bertuliskan angka dari 1-100 dan tempatkan seperti pada gambar di bawah ini :

angka

8. Klik frame 1 layer ular tangga. Buatlah 4 buah tangga (gunakan line tool untuk membuatnya) dan 4 buah ular (gunakan brush tool dengan tebal garis 10 untuk membuatnya) seperti gambar di bawah ini dan juga perhatikan penempatannya :

ular-dan-tangga

9. Klik frame 1 layer pemain. Buatlah sebuah lingkaran kecil berwarna merah. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan pemain1 sebagi name dan movie clip sebagai type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

10. Seleksi movie clip pemain1 dan masukkan pemain1 sebagai instance name pada panel properties.

11. Buatlah sebuah lingkaran kecil berwarna biru. Seleksi lingkaran tersebut dan tekan F8. Pada panel yang muncul masukkan pemain2 sebagi name dan movie clip sebagi type serta pastikan titik registrationnya berada di tengah-tengah lalu tekan ok.

12. Seleksi movie clip pemain2 dan masukkan pemain2 sebagai instance name pada panel properties.

13. Buatlah sebuah objek seperti gambar di bawah ini :

dadu0

14. Seleksi objek tersebut dan tekan F8. pada panel yang muncul masukkan dadu_btn sebagi name dan movie clip sebagai type lalu tekan ok.

15. Seleksi movie clip dadu_btn di stage dan masukkan dadu_btn sebagai instance name pada panel properties.

16. Klik 2 kali movie clip dadu_btn untuk masuk ke dalam stagenya. Seleksi frame 2 sampai frame 7 dan tekan F6 pada keyboard.



17. Ubah bentuk objek di frame 2 menjadi seperti di bawah ini :

dadu1

18. Ubah bentuk objek di frame 3 menjadi seperti di bawah ini :

dadu2

19. Ubah bentuk objek di frame 4 menjadi seperti di bawah ini :

dadu3

20. Ubah bentuk objek di frame 5 menjadi seperti di bawah ini :

dadu4

21. Ubah bentuk objek di frame 6 menjadi seperti di bawah ini :

dadu5

22. Ubah bentuk objek di frame 7 menjadi seperti di bawah ini :

dadu6

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

1
stop();

24. Tekan Ctrl+E untuk kembali ke stage scene 1. Klik frame 1 layer pemain dan buatlah sebuah button bertuliskan Jalankan. Seleksi button tersebut dan masukkan jalankan_btn sebagai instance name pada panel properties.


25. Buatlah sebuah dynamic text dengan Var giliran tampil.

26. Tempatkan seluruh objek yang dibuat tadi seperti gambar di bawah ini :

letak-frame1

27. Seleksi frame 2 dan 3 pada layer script dan pemain lalu tekan F7. Klik frame 2 layer pemain dan buatlah sebuah button bertuliskan Coba lagi. Seleksi button tersebut dan masukkan coba_lagi sebagi instance name di panel properties.

28. Masih di frame 2 layer pemain, buatlah sebuah static text bertuliskan Pemain 1 menang. Tempatkan static text dan button di frame 2 layer pemain seperti gambar di bawah ini :

letak-fram2

29. Klik frame 2 layer pemain dan buatlah sebuah button bertuliskan Coba lagi. Seleksi button tersebut dan masukkan coba_lagi sebagi instance name di panel properties.

30. Masih di frame 2 layer pemain, buatlah sebuah static text bertuliskan Pemain 2 menang. Tempatkan static text dan button di frame 2 layer pemain seperti gambar di bawah ini :

letak-frame3

31. Klik frame 1 layer script 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
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
90
91
92
93
94
95
96
97
98
99
100
101
102
103
stop();
dadu = 0;
ubah_nilai = 0;
waktu_ganti = false;
giliran = "pemain1";
pemain1.nomor = 0;
pemain2.nomor = 0;
pemain1.temp_nomor = 0;
pemain2.temp_nomor = 0;
jalankan_btn.enabled = false;
jalankan_btn._alpha = 20;
onEnterFrame = function () {
giliran_tampil = giliran;
trace(dadu);
};
dadu_btn.onPress = function() {
if (this._currentframe == 1) {
this.gotoAndStop(random(6)+2);
jalankan_btn.enabled = true;
jalankan_btn._alpha = 100;
dadu = 0;
}
if (this._currentframe>1) {
dadu = this._currentframe-1;
}
};
jalankan_btn.onPress = function() {
if (giliran == "pemain1") {
pemain1.nomor += dadu;
}
if (giliran == "pemain2") {
pemain2.nomor += dadu;
}
ganti_pemain();
dadu_btn.gotoAndStop(1);
jalankan_btn.enabled = false;
jalankan_btn._alpha = 20;
};
for (i=1; i<3; i++) {
_root["pemain"+i].onEnterFrame = function() {
ulartangga();
if (this.temp_nomor<this.nomor) {
this.temp_nomor++;
}
this._x = _root["kotak"+this.temp_nomor]._x;
this._y = _root["kotak"+this.temp_nomor]._y;
};
}
function ganti_pemain() {
waktu_ganti = true;
if (waktu_ganti == true && giliran == "pemain1") {
giliran = "pemain2";
waktu_ganti = false;
}
if (waktu_ganti == true && giliran == "pemain2") {
giliran = "pemain1";
waktu_ganti = false;
}
}
function ulartangga() {
for (i=1; i<3; i++) {
if (_root["pemain"+i].temp_nomor == _root["pemain"+i].nomor) {
//tangga
if (_root["pemain"+i].hitTest(_root.kotak7)) {
_root["pemain"+i].nomor = 36;
_root["pemain"+i].temp_nomor = 36;
}
if (_root["pemain"+i].hitTest(_root.kotak40)) {
_root["pemain"+i].nomor = 59;
_root["pemain"+i].temp_nomor = 59;
}
if (_root["pemain"+i].hitTest(_root.kotak45)) {
_root["pemain"+i].nomor = 78;
_root["pemain"+i].temp_nomor = 78;
}
if (_root["pemain"+i].hitTest(_root.kotak53)) {
_root["pemain"+i].nomor = 71;
_root["pemain"+i].temp_nomor = 71;
}
//ular
if (_root["pemain"+i].hitTest(_root.kotak49)) {
_root["pemain"+i].nomor = 13;
_root["pemain"+i].temp_nomor = 13;
}
if (_root["pemain"+i].hitTest(_root.kotak64)) {
_root["pemain"+i].nomor = 23;
_root["pemain"+i].temp_nomor = 23;
}
if (_root["pemain"+i].hitTest(_root.kotak89)) {
_root["pemain"+i].nomor = 5;
_root["pemain"+i].temp_nomor = 5;
}
if (_root["pemain"+i].hitTest(_root.kotak97)) {
_root["pemain"+i].nomor = 66;
_root["pemain"+i].temp_nomor = 66;
}
//menang
if (_root["pemain"+i].hitTest(_root.kotak100)) {
gotoAndStop(i+1);
}
}
}
}

32. Klik frame 2 layer script dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1
2
3
4
stop();
coba_lagi.onPress = function() {
gotoAndStop(1);
};

33. Klik frame 3 layer script dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1
2
3
4
stop();
coba_lagi.onPress = function() {
gotoAndStop(1);
};

34. Tekan Ctrl+Enter untuk melihat hasilnya.

1 komentar: