Membuat Soal Pilihan Ganda Dengan Flash. (AS2)

— dengan menggunakan macromedia flash mx 2004 —

1. Buat dokument baru (New->Flash Document).
buat tiga buah layer dengan urutan dari atas : opsi, ctn dan bg.

2. Membuat welcome screen.
Dengan Text Tool buat tiga buah textbox pada sisi atas stage

Atur property masing masing textbox tersebut pada property panel sbb:
- text box paling kiri:
o Text Type : Dynamic Text,
o Instance Name : username_txt
o Font Size 16
o Line Type : Singgle Line
o Selectable : None

- text box tengah :
o Text Type : Dynamic Text,
o Instance Name : info_txt
o Font Size 16
o Line Type : Singgle Line
o Selectable : None

- text box paling kanan :
o Text Type : Dynamic Text,
o Instance Name : skor_txt
o Font Size 16
o Line Type : Singgle Line
o Selectable : None

Untuk ukuran silahkan sesuaikan sendiri.

Selanjutnya klik layer bg, kemudian kunci layer opsi dan ctn.
1. dengan Rectangle Tool buat kotak di belakang masing masing textbox pd layer opsi.
2. kemudian buat lagi kotak di bawahnya sebagai background content.

Kunci layer bg dan pilih layer ctn serta buka kuncinya.
1. Dengan text tool buat sebuah text box
a. Text type : static ukuran font 24, Bold.
b. Ketik Judul pada textbox ini.
2. Kemudian buat satu lagi untuk tambahan text judul.
3. Masih dengan text tool, buat satu lagi text box (untuk User name).
4. Kemudain buat lagi satu textbox sbb:
a. Type Text : Input Text
b. Instance Name : inputuser_txt
c. Variable : inputuser
d. Line Type : Single
e. Aktifkan tombol Border Around Text.
f. Maximum Character : 20.

5. Terakhir buat sebuah tombol (anda bisa mengambil tombol dari library). Atau bikin sendiri tombol sederhana sbb:
a. Dengan Rectangle Tool buat sebah kotak persegi panjang.
b. Jadikan sebagai syombol (Modify->Convert to Symbol / F8).
i. nama : tombol_mc
ii. Behavior : Button
c. Double klik pada kotak untuk mengedit tombol.
i. Tambahkan setatik text di depan kotak, ketik ; Masuk.
ii. Klik kanan frame2, Insert Keyframe
iii. Ganti warna fill dengan warna lain.

6. Klik Scane1 pada kiri atas stage untuk keluar dari editing tombol_mc.
7. kemudian klik tombol dan beri nama pada Instant Name enter_btn.

Welcome screen selesai,
Selanjutnya kita akan mebuat layar soal pilihan ganda.

- Klik kanan frame6 layer opsi, Insert Frame.
- Klik kanan frame2 layer ctn, Insert Blank Keyframe.
- Klik kanan frame6 layer bg, Insert Frame.

Klik frame2 layer ctn.
1. Buat textbox static dan tuliskan sebuah pertanyaan untuk soal pertama.
Miss (Berikut ini adalah bagian yang terdapat pada Toolbar Formating adalah ….
2. Buka panel componen (Window->Development Panel->Components)
3. Tarik (Drag) 4 buah RadioButton dari Panel Components ke dalam stage.
4. Set parameter dari Panel Properti sbb:
a. Instance Name masing-masing : s1a_cmp, s1b_cmp, s1c_cmp dan s1d_cmp.
b. Data masing-masing : A, B, C dan D
c. GroupName (keempatnya harus sama) : s1
d. Label masing-masing : A, B, C, dan D.
5. Kemudian dengan Text Tool beri pilihan jawaban untuk masing-masing radio button tsb
6. Buka Panle Library (Window->Library)
7. Tarik (Drag) tombol_mc ke dalam stage, ber nama pada Instance name enter_btn1

Klik Frame3 Layer ctn, Insert Keyframe.
Ganti masing-masing property sbb:
** Soal Pertanyaan ganti dengan soal nomor dua milik anda.
** Radio button
1. Instance name masing-maing : s2a_cmp, s2b_cmp, s2c_cmp dan s2d_cmp
2. GrupName keempatnya harus sama: s2
3. Untuk yg lainnya biarkan sama;
** Pilihan Jawaban ganti dengan pilihan jawaban anda.
** Untuk tombol ganti Instance Name menjadi enter_btn2.

Note : untuk soal berikutnya lakukan langkah pada step ini dengan mengganti property yg tersebut di atas.
Jangan lupa intuk memperpanjang frame untuk layer opsi dan layer bg dengan (Insert Frame)

Setelah Anda selesai membuat frame soal-soal, terakhir buatlah halaman penutup.

End Screen.
Klik frame terakhir dari layer ctn, Insert Blank Keyframe.
1. Dengan Text tool buat tiga dynamic textbox masing-maisng
Instant Name = trims_txt, pesanskor_txt, dan totalskor_txt
2. Buat sebuah tombol untuk kembali ke frame awal / 1.
Beri nama tombol ini pada instant name balik_btn

Selesai untuk disain tampilan soal pilihan ganda Anda.
Selanajutnya tinggal menambahkan skrip.

Klik frame1 layer ctn, kemudian panel Action (window->Developments Panel->Actions)
Ketikkan script berikut :

stop();

username_txt.text = “Nama Anda”;
info_txt.text = “Info Status”;
skor_txt.text = “Skor”;
inputuser_txt.text = “”;

klik frame2 layer ctn, kemudian masukkan script berikut :

var isiNilai = 0;

klik frame3 layer ctn, kemudian masukkan script berikut :

info_txt.text = isiInfo;
skor_txt.text = isiNilai;

(untuk layer-layer berikutnya masukkan script ini.)

Kemudian klik frame terakhir pada layer ctn dan masukkan script berikut :

info_txt.text = isiInfo;
skor_txt.text = isiNilai;
trims_txt.text = “Terima kasih ” + username_txt.text;
pesanskor_txt.text = “Skor Anda Adalah : “;
totalskor_txt.text = skor_txt.text;

Tutup Panel Action.
Selanjutnya tuliskan script pada masing-masing tombol pada tiap framenya sbb: (klik frame1 layer ctn, klik tombol, buka kembali Panel Action)

enter_btn (tombol pada frame1 layer ctn)

on(release){
if(inputuser_txt.text == “”){
username_txt.text = “Masukkan Nama Anda”;
}else{
username_txt.text = inputuser_txt.text;
nextFrame();
}
}

Tutup Panel Action, klik frame2, klik tombol pada stage, buka Panel Action.

enter_btn2 (tombol pada frame3 layer ctn)

on(release){
if(s1.selectedData == “B”){
isiInfo = “Jawaban Benar (” + s1.selectedData + “)”;
isiNilai = isiNilai + 1;
nextFrame();
}else{
isiInfo = “Jawaban Salah”;
isiNilai = isiNilai + 0;
nextFrame();
}
}

Tutup Panel Action, klik frame3, klik tombol pada stage, buka Panel Action.

enter_btn2 (tombol pada frame3 layer ctn)

on(release){
if(s2.selectedData == “B”){
isiInfo = “Jawaban Benar (” + s2.selectedData + “)”;
isiNilai = isiNilai + 1;
nextFrame();
}else{
isiInfo = “Jawaban Salah”;
isiNilai = isiNilai + 0;
nextFrame();
}
}

Demikian seterusnya scrip untuk tombol pada frame-frame berikutnya, dengan mengganti isi jawaban “B” yang ada pada baris if(s2.selectedData == “B”), dan s2, sesuai dengan GroupName pada radio button pada masing-masing frame.

Untuk tombol pada frame terakhir masukkan script berikut :

balik_btn (tombol pada frame terakhir  layer ctn)

on(release){
gotoAndStop(1);
}

Selesai. Silahkan dicoba.  (Ctrl + Enter).

Contoh File .
File fla.

About these ads

21 gagasan untuk “Membuat Soal Pilihan Ganda Dengan Flash. (AS2)

  1. ilham mengatakan:

    script untuk enter buton ada ksalahan saat q coba

  2. andre mengatakan:

    mantaaaaaabz euy… bole q coba dirumah niy..

  3. Khairullah mengatakan:

    masih banyak lagi soal untuk kelas X-XII

  4. smart mengatakan:

    syukron ya..
    sangat bermanfaat utk mnambah wawasan…

    salam ukhuwah kawan :)

  5. jaka mengatakan:

    salam kenal. Thanks untuk infonya.

  6. Jean mengatakan:

    Thank..moga ada manfaatnya salam kenal

  7. hiphip mengatakan:

    thx infonya
    ak nanya dong suhu
    klo setiap jawaban yg kita klik dsimpen dlu sampe pertanyaan terakhr,nah pas terakhr baru ditampilin gmn caranya ya??
    bisa bantu scriptnya ga???

  8. [...] Membuat Soal Pilihan Ganda Dengan Flash [...]

  9. sintia mengatakan:

    mas kalo menggunakan macromedia gmn caranya? tolong y penting banget soale

  10. sintia mengatakan:

    mas kalo pakek macromedia flas 8 gmn caranya?

  11. atta mengatakan:

    kalo dalam soal pilihan gandanya dibuat button yang pada saat ditekan ada musiknya trus pengguna menebak itu lagu apa dengna pilihan jawaban dipilihan gandanya? itu bagaimana mas? soalnya random

  12. tiara mengatakan:

    numpang tanya, supaya soalnya bisa di random gmna mas? makasih sblmnya

  13. Wahyudi mengatakan:

    Alhamdulillah, terima kasih

  14. Chandra Hidayat mengatakan:

    terima kasih
    berkat anda TA saya lenih mudah

  15. jalu mengatakan:

    Reblogged this on Hero must be cute and commented:
    Membuat Soal Pilihan Ganda Flash

  16. epni mengatakan:

    mas klo bikin soal pilihan ganda di as3 gimana… mohon petunjuknya .. Makasih

  17. epni mengatakan:

    mas gimana agar hasil jawabnya bisa d print

  18. Sofyan mengatakan:

    terimakasih sudah berbagi ilmu :)

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Logout / Ubah )

Twitter picture

You are commenting using your Twitter account. Logout / Ubah )

Facebook photo

You are commenting using your Facebook account. Logout / Ubah )

Google+ photo

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s