Latihan Soal dengan ActionScript 3.0 – Part 2

posted in: Tutorial | 0

Pada artikel ini kita akan melanjutkan pembuatan latihan soal dengan ActionScript 3.0 pada tahap pembuatan inti soalnya. Sebagai pembukaan, agar lancar di bagian ini sebaiknya kalian juga sudah mengetahui tentang Mengenal Symbol dalam Flash terutama button.

Pada artikel sebelumnya yakni Latihan Soal dengan ActionScript 3.0 – Part 1, kalian sudah sampai pada jumping tombol evaluasi agar dapat menuju frame tertentu. Setelah bisa jumping, frame tersebut berisi inti soal evaluasi yang akan kita buat kali ini.

Langsung saja ke langkah-langkah pembuatannya yes.

  1. Buatlah tampilan isi soal beserta pilihan gandanya seperti tampilan berikut. Kalian bisa menggunakan Text Tool untuk membuat teksnya. Gunakan juga Oval Tool dan Paint Bucket Tool untuk membuat lingkaran pilihan ganda dan warnanya.
    pembuatan inti soal
  2. Langkah selanjutnya adalah membuat lingkaran pilihan ganda menjadi symbol button. Blok dulu lingkaran pilihan gandanya > klik kanan > Convert to Symbol. Jangan lupa berikan nama pada Name symbol-nya, kemudian pada bagian Type pilih Button. Di sini saya memberi contoh satu saja ya di tombol a. Untuk tombol b dan c silahkan kalian buat dengan langkah yang sama.
    pemberian nama dan symbol button
  3. Kemudian perhatikan pada panel Properties (di sebelah kanan), berikan instance name untuk masing-masing button pilihan ganda kalian tadi.
    memberi instance name
  4. Jangan lupa buat untuk tombol b dan c juga ya. Oiya, jika membuat soal lebih dari satu, patokan pemberian instance name button nanti menyesuaikan nomor soal saja ya biar mudah kalian mengingatnya untuk pemberian ActionScript. Misal di soal 1 tadi instance name-nya pilihan1a (untuk soal 1 button a), pilihan1b (untuk soal 1 button b), dan pilihan1c (untuk soal 1 button c). Nah, dalam soal 2 juga menjadi pilihan2a (untuk soal 2 pilihan a) dan seterusnya.
  5. Nah, langkah termumet sekarang adalah menambahkan ActionScript 3.0. Klik kanan frame 2 layer AS > pilih Actions.
    pemberian actions untuk button
  6. Masukkan kode berikut.
    stop();
    var skor:int = 0;
    pilihan1a.addEventListener(MouseEvent.CLICK, klik_pilihan1a);
    function klik_pilihan1a(e:MouseEvent):void
    {
    	skor+=10;
    	nextFrame();
    }
    
    pilihan1b.addEventListener(MouseEvent.CLICK, klik_pilihan1b);
    function klik_pilihan1b(e:MouseEvent):void
    {
    	nextFrame();
    }
    
    pilihan1c.addEventListener(MouseEvent.CLICK, klik_pilihan1c);
    function klik_pilihan1c(e:MouseEvent):void
    {
    	nextFrame();
    }

    Sudah bisa mengartikan kode tersebut sendiri kah? 😀

    Okelah, kita terjemahkan bersama bahasa tersebut yes. Untuk script yang sudah kita bahas di Part 1 tidak akan saya ulas lagi. Silahkan baca link Part 1 di atas.

    • stop()   =  script untuk berhenti di frame tertentu.
    • var artinya variabel. Nah, di sini kita menambahkan skor sebagai variabel untuk menambah nilai jika jawaban yang dipilih user benar. Definisi var skor awal adalah nol. Kan nilai sebelum soal dikerjakan pastinya nol dong.
    • int artinya variabel skor adalah integer yang berupa angka.
    • skor+=10 artinya penambahan skor tiap jawaban benar adalah sebesar 10 poin. Penambahan skor ini diletakkan pada function pilihan jawaban yang benar saja. Jika pilihan button jawaban salah, tidak perlu ditambahi skor. La kan salah ngapain juga tambahi skor untuk pilihan ganda haha.
      Oiya, penambahan skor 10 poin ini juga menyesuaikan dengan jumlah soal kalian ya. Jika soal ada 10 dan ingin nilainya 100, artinya penambahan poin per soal harus 10 poin. Jikan soal hanya 5 dan ingin nilainya 100, artinya penambahan poin per soal adalah 20 poin.
    • nextFrame()  = script untuk menuju frame selanjutnya. Ini digunakan jika kalian memiliki soal lebih dari satu soal sehingga akan ada frame 3, 4, dan seterusnya. Jadi, setelah soal 1 dipilih pilihan gandanya, akan langsung lanjut mengerjakan soal 2 yang berada di keyframe 3 dan seterusnya.
  7. Done. Untuk bagian kedua ini sampai di sini dulu deh ya biar kalian gak pusing.

Pada bagian selanjutnya kita akan membuat tampilan hasil akhir yang akan memunculkan nilai dari hasil yang dikerjakan user. Okeh, pusing? Jangan lupa ngopi 😀

Jangan lupa komentar juga jika ada yang gagal di kode atau belum paham ya. Selamat bekerja.

Muhammad Faizin
Follow Faizin:

Writer and Developer

Dulu suka menulis kode dan sejenisnya sampe malem, sekarang juga masih. Kesukaan pada menulis cerita sedikit demi sedikit terpupuk, apalagi sebagai mantan anak sekolahan dengan cita-cita kuliah di luar negeri.