Selain media sosial dan pesan instan salah satu aplikasi android yang paling banyak diminati / di unduh adalah aplikasi game (permainan). Di tutorial ini kita akan belajar membuat aplikasi kuis sederhana menggunakan android studio.
Membuat Aplikasi Kuis Sederhana di Android Studio
Dalam 30 menit ke depan kita akan mempelajari point-point dibawah ini :
- Requirements
- Deskripsi singkat aplikasi
- Pembuatan Project Baru
- Pembuatan Layout
- Pengkodingan Java
- Running Aplikasi
1. Requirements / Persiapan
Sebelum mempelajari tutorial membuat aplikasi kuis sederhana ini ada baiknya kamu mempelajari tutorial dasar yang sudah dipublish sebelumnya, antara lain :
- Install Java JDK, Install Android Studio
- Pengenalan Interface Android Studio
- Linear Layout dan Relative Layout
Semua itu bisa dipelajari di tutorial : Belajar Android Studio untuk Pemula
2. Deskripsi Singkat
Aplikasi kuis yang akan kita buat kali ini sangat sederhana. Deskripsinya yaitu :
- Aplikasi kuis berbentuk pilihan ganda
- Jika pilihan benar akan ditampilkan alert dialog
- Jika salah akan ditampilkan toast
Lihat divideo berikut aplikasi yang sudah runningnya :
3. Pembuatan Project Baru
Buat project baru dengan nama kuissederhana atau kamu bisa menyesuikannya sendiri untuk nama projectnya. Untuk mempelajari bagaimana cara membuat project baru silahkan pelajari ditutorial membuat project pertama di android studio.
4. Pembuatan Layout
Komponen dan layout yang akan digunakan untuk membuat interface kuis ini adalah sebagai berikut :
- RelativeLayout
- TextView
- RadioButton
- RadioGrup
Buka activity_main.xml kemudian ketikan kode-kode dibawah ini :
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/activity_main" android:padding="15dp"> <TextView android:text="Club sepak bola yang memenangkan liga champions adalah :" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/textView" android:textSize="25sp" android:textColor="@android:color/black" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:textStyle="bold"/> <RadioGroup android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/textView" android:layout_centerHorizontal="true" android:layout_marginTop="39dp" android:id="@+id/radioGroup" > <RadioButton android:text="Real Madrid" android:foreground="?attr/selectableItemBackground" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/radioButton" android:onClick="onRadioButton" android:layout_toLeftOf="@+id/radioGroup" android:layout_toStartOf="@+id/radioGroup" android:layout_below="@+id/radioGroup"/> <RadioButton android:text="Liverpool" android:foreground="?attr/selectableItemBackground" android:onClick="onRadioButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/radioButton" android:layout_alignLeft="@+id/radioButton" android:layout_alignStart="@+id/radioButton" android:layout_marginTop="36dp" android:id="@+id/radioButton2"/> <RadioButton android:text="Barcelona" android:foreground="?attr/selectableItemBackground" android:onClick="onRadioButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="26dp" android:id="@+id/radioButton3" android:layout_below="@+id/radioButton2" android:layout_alignLeft="@+id/radioButton2" android:layout_alignStart="@+id/radioButton2"/> <RadioButton android:text="Juventus" android:foreground="?attr/selectableItemBackground" android:onClick="onRadioButton" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/radioButton3" android:layout_alignLeft="@+id/radioButton3" android:layout_alignStart="@+id/radioButton3" android:layout_marginTop="39dp" android:id="@+id/radioButton4"/> </RadioGroup> </RelativeLayout>
Dari kode-kode diatas maka akan terbentuk layout seperti gambar dibawah ini :
5. Pengkodingan Java
Selanjutnya kita berikan perintah terhadap komponen-komponen yang sudah dibentuk pada activity_main.xml. Silahkan buka MainActivity.java kemudian masukan kode-kode dibawah ini.
package badoystudio.com.kuissederana; import android.content.DialogInterface; import android.os.Bundle; import android.support.v7.app.AlertDialog; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.RadioButton; import android.widget.RadioGroup; import android.widget.Toast; public class MainActivity extends AppCompatActivity { AlertDialog.Builder builder; RadioGroup radiogroup; //deklarasi var or obj @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //radiogroup inisialisasi radiogroup = (RadioGroup) findViewById(R.id.radioGroup); } //Memilih RadioButton public void onRadioButton(View view) { Boolean checked = ((RadioButton) view).isChecked(); switch (view.getId()) { case R.id.radioButton: if (checked) tampilDialog(); break; case R.id.radioButton2: if (checked) jawabanSalah(); break; case R.id.radioButton3: if (checked) jawabanSalah(); break; case R.id.radioButton4: if (checked) jawabanSalah(); break; } } //menampilkan dialog public void tampilDialog() { builder = new AlertDialog.Builder(this); builder.setCancelable(false); builder.setTitle("Selamat !!!"); builder.setMessage("Jawaban kamu benar : Real Marid"); builder.setPositiveButton("OKE", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialogInterface, int i) { Toast.makeText(MainActivity.this, "Selamat", Toast.LENGTH_SHORT).show(); } }); builder.setNegativeButton("ULANGI", new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialogInterface, int i) { radiogroup.clearCheck(); } }); builder.create().show(); } //menampilkan toast text jawaban salah public void jawabanSalah(){ Toast.makeText(this, "Jawaban kamu Salah", Toast.LENGTH_SHORT).show(); } }
Agar lebih paham kamu bisa mempelajari setiap baris kode-kode java yang dituliskan di atas. Saya rasa tidak terlalu sulit karena logika dari kuis yang sedang kita buat ini sangatlah mudah.
Sangat direkomendasikan : Modul Android Studio Keren dan Lengkap Yang Wajib Kamu Punya
6. Running Aplikasi
Langkah terakhir silahkan running aplikasi yang sudah dibuat menggunakan :
- Emulator bawaan android studio (android virtual device)
- Langsung ke smartphone android yang kita punya
- running menggunakan emulator genymotion
Maka hasilnya adalah sebagai berikut :
Kesimpulan
Itulah tutorial membuat aplikasi kuis sederhana menggunakan android studio. Kamu bisa mengembangkannya menjadi lebih keren lagi. Selamat mempelajari dan semoga bermanfaat.