Cara Menggunakan RadioButton di Android Studio

Dalam tutorial kali ini saya akan membuat contoh sederhana, yang dimana pengguna memilih salah satu pilihan yang ada. Untuk detail dari aplikasi yang kita buat, anda bisa melihat contohnya pada gambar dibawah ini.

a. Langkah pertama, buat sebuah projek android studio yang baru, atau anda juga bisa gunakan projek android studio yang sudah ada.

b. Buka file activity_main.xml, kemudian buat kodenya seperti dibawah ini.


<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical"

    android:padding="16dp">




    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Apa Kartun Favorit Anda?"

        android:paddingBottom="10dp"

        android:textColor="#000"

        android:textSize="20sp"/>




    <RadioGroup

        android:id="@+id/radio_grup"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:paddingBottom="10dp">




        <RadioButton

            android:id="@+id/radio_button_1"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="Spongebob Squarepants"

            android:textSize="20sp"/>




        <RadioButton

            android:id="@+id/radio_button_2"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="Naruto Shippuden"

            android:textSize="20sp"/>




        <RadioButton

            android:id="@+id/radio_button_3"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="Doraemon"

            android:textSize="20sp"/>

    </RadioGroup>




    <Button

        android:id="@+id/button_1"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="Pilih"

        android:textColor="#FFF"

        android:background="@color/colorPrimary"

        android:layout_gravity="center_horizontal"

        android:layout_marginBottom="10dp"/>




    <TextView

        android:id="@+id/hasil"

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text=""

        android:textColor="#000"

        android:textSize="20sp"/>







</LinearLayout>

Note : Ingat untuk selalu menggunakan atribut android:id ketika menggunakan RadioButton

c. Setelah selesai, buka file MainActivity.java. Pada tahap ini kita perlu mendeklarasikan widget atau view yang kita gunakan. Hal ini bertujuan agar widget atau view tersebut dapat dikenali oleh file Javanya. Berikut ini adalah contoh kodenya.


public class MainActivity extends AppCompatActivity {




    String hasil;

    RadioGroup radioGroup;

    RadioButton radioButton, radioButton2, radioButton3;

    Button buttonPilih;

    TextView pilihan;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);




        radioGroup = (RadioGroup) findViewById(R.id.radio_grup);

        radioButton = (RadioButton) findViewById(R.id.radio_button_1);

        radioButton2 = (RadioButton) findViewById(R.id.radio_button_2);

        radioButton3 = (RadioButton) findViewById(R.id.radio_button_3);




        buttonPilih = (Button) findViewById(R.id.button_1);




        pilihan = (TextView) findViewById(R.id.hasil);




       }

}

d. Setelah itu kita buat sebuah methode OnClickListener pada button yang digunakan untuk merekam ada atau tidaknya klik oleh pengguna pada button tersebut. Contoh kodenya seperti dibawah ini;


buttonPilih.setOnClickListener(new View.OnClickListener() {

    @Override

    public void onClick(View view) {

        .......

    }

});

e. Pada tahap ini kita akan membuat sebuah kondisi percabangan (if-else), yang digunakan untuk menentukan pilihan apa yang telah dipilih/diklik oleh pengguna pada RadioButton kemudian memasukkan dan menampilkan pilihan tersebut ke dalam TextView. Berikut ini adalah contoh kodenya;


if (radioButton.isChecked()){

        hasil = radioButton.getText().toString();

    }else if (radioButton2.isChecked()){

        hasil = radioButton2.getText().toString();

    }else if (radioButton3.isChecked()) {

        hasil = radioButton3.getText().toString();

    }else {

        Toast.makeText(getApplicationContext(), "Pilih salah satu...", Toast.LENGTH_SHORT).show();

    }

    pilihan.setText(hasil);

}

Sedikit penjelasan dari kode diatas. Kode tersebut digunakan untuk membuat sebuah kondisi percabangan yang dimana, apabila salah satu RadioButton diklik oleh pengguna, maka variabel “hasil” akan menyimpan nilai dari atribut XML android:text RadioButton.

Jika pengguna langsung menekan Button tanpa memilih salah satu pilihan yang ada pada RadioButton maka, aplikasi akan memunculkan pesan teks peringatan untuk memilih salah satu pilihan. Sedangkan kode pilihan.setText(hasil); adalah kode yang digunakan untuk membuat teks pada TextView sama seperti teks yang ada pada RadioButton yang dipilih oleh pengguna.

Dan dibawah ini adalah kode keseluruhan dari MainActivity.java;


package com.example.a455lj.contohradiobutton1;




import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.widget.Button;

import android.widget.RadioButton;

import android.widget.RadioGroup;

import android.widget.TextView;

import android.widget.Toast;




public class MainActivity extends AppCompatActivity {




    String hasil;

    RadioGroup radioGroup;

    RadioButton radioButton, radioButton2, radioButton3;

    Button buttonPilih;

    TextView pilihan;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);




        radioGroup = (RadioGroup) findViewById(R.id.radio_grup);

        radioButton = (RadioButton) findViewById(R.id.radio_button_1);

        radioButton2 = (RadioButton) findViewById(R.id.radio_button_2);

        radioButton3 = (RadioButton) findViewById(R.id.radio_button_3);




        buttonPilih = (Button) findViewById(R.id.button_1);




        pilihan = (TextView) findViewById(R.id.hasil);




        buttonPilih.setOnClickListener(new View.OnClickListener() {

            @Override

            public void onClick(View view) {

                if (radioButton.isChecked()){

                    hasil = radioButton.getText().toString();

                }else if (radioButton2.isChecked()){

                    hasil = radioButton2.getText().toString();

                }else if (radioButton3.isChecked()) {

                    hasil = radioButton3.getText().toString();

                }else {

                    Toast.makeText(getApplicationContext(), "Pilih salah satu...", Toast.LENGTH_SHORT).show();

                }

                pilihan.setText(hasil);

            }

        });

    }

}