Developer

Membuat Tombol Switch Sederhana Menggunakan Android Studio

* Artikel ini adalah rangkaian dari tutorial Android Studio, untuk melihat tutorial Android Studio lainnya bisa mengklik tautan ini

Pada tulisan kali ini saya akan memberikan contoh penggunaan widget Switch pada Android Studio. Penggunaan Switch biasanya digunakan untuk mematikan atau menghidupkan fungsi. Misalnya mematikan dan menghidupkan flash kamera, mematikan atau menghidupkan paket data, dan lainnya. Di bawah ini merupakan contoh widget Switch yang biasa kita lihat pada ponsel pintar Android.

Secara sederhana, widget Switch adalah jenis tombol yang memiliki dua fungsi yaitu ON dan OFF. Developer dapat mengatur keadaan awal dan kemudian pengguna dapat mengubahnya. Untuk mencoba Switch pada aplikasi yang dibuat menggunakan Android Studio, kita akan memberikan fungsi dimana jika ON maka akan muncul TextView yang berisi Status ON, tetapi jika Switch dalam keadaan OFF, maka akan muncul TextView yang berisi Status OFF.

Untuk mulai membuat aplikasi ContohSwitch ini, silahkan buat proyek baru pada Android Studio dengan nama ContohSwitch, atau berikan nama proyek sesuai keinginan. Buka Android Studio, klik File – New Project isi Application Name dengan nama ContohSwitch dan Company Domain dengan teknojurnal.com. Pada jendela Activity silahkan pilih Empty Activity.

Setelah berhasil membuat proyek, silahkan buka file activity_main.xml yang terletak pada direktori res/layout/activity_main.xml. Pada layout ini, kita akan menambahkan widget Switch dan TextView. Silahkan tambahkan kodingan seperti di bawah ini pada file activity_main.xml.

<?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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="oc.startup.ra.contohswitch.MainActivity">

    <Switch
        android:id="@+id/mySwitch"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginTop="20dp"
        android:text="Pilih Switch" />

    <TextView
        android:id="@+id/switchStatus"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/mySwitch"
        android:layout_marginTop="22dp"
        android:text="Text"
        android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>

Setelah menambahkan kodingan seperti di atas, sekarang kita akan menambahkan kodingan pada MainActivity.java. Silahkan buka file MainActivity.java kemudian tambahkan kodingan seperti di bawah ini.

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.CompoundButton;
import android.widget.Switch;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    private TextView switchStatus;
    private Switch mySwitch;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        switchStatus = (TextView) findViewById(R.id.switchStatus);
        mySwitch = (Switch) findViewById(R.id.mySwitch);

        //set the switch to ON
        mySwitch.setChecked(true);
        //attach a listener to check for changes in state
        mySwitch.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {

            @Override
            public void onCheckedChanged(CompoundButton buttonView,
                                         boolean isChecked) {

                if (isChecked) {
                    switchStatus.setText("Status: ON");
                } else {
                    switchStatus.setText("Status: OFF");
                }

            }
        });

        //check the current state before we display the screen
        if(mySwitch.isChecked()){
            switchStatus.setText("Status: ON");
        }
        else {
            switchStatus.setText("Status: OFF");
        }
    }
}

Kita bisa mengatur widget Switch secara default mempunyai nilai ON atau OFF. Pada contoh ini kita berikan nilai default pada widget Switch bernilai ON. Sepeti terlihat pada kodingan di bawah ini.

mySwitch.setChecked(true);

Selain itu, kita dapat mengubah teks ketika Switch dipilih. Ubah teks sesuai keinginan pada kodingan di bawah ini.

if(mySwitch.isChecked()){
    switchStatus.setText("Status: ON");
}
else {
    switchStatus.setText("Status: OFF");
}

Jika sudah mengikuti tahapan seperti di atas, silahkan jalankan aplikasi ContohSwitch menggunakan emulator Android atau menggunakan langsung ponsel pintar Android yang dimiliki. Maka tampilan dari aplikasi ContohSwitch akan tampak seperti di bawah ini.

Untuk mengunduh kode sumber dari aplikasi ContohSwitch bisa mengklik tautan ini.

* Artikel ini adalah rangkaian dari tutorial Android Studio, untuk melihat tutorial Android Studio lainnya bisa mengklik tautan ini

Share
Published by
Riswan Abidin

Recent Posts

Cisco Peringkatkan Kerentanan Kritis Dalam Cisco Data Center Network Manager

Cisco mengungkapkan tiga kerentanan dalam layanannya. Ini dia penanganannya!

January 7, 2020

Optimal idM Meluncurkan OptimalCloud Partner Platform

Ini ulasan mengenai keuntungan OptimalCloud Partner Platform, platform baru milik Optimal idM!

January 6, 2020

Google Siapkan Coral Accelerator Module dan Coral Dev Board Mini untuk Tahun 2020

Google kenalkan dua koleksi baru dari Coral. Dua koleksi baru ini bakal menambah kemampuan pengembangan…

January 3, 2020

Google Kembangkan Model Kecerdasan Buatan Untuk Deteksi Kanker Payudara

Raksasa Google baru saja mengembangkan sistem pemindaian kanker payudara berbasis kecerdasan buatan. Bagaimana hasilnya, berikut…

January 3, 2020

Google Dorong Fitur Bubbles Notifications Ke Versi Stabil

Meski dikenalkan bersamaan dengan Android 10 Beta, sampai kini Bubbles Notifications masih dalam tahap pengembangan.…

December 31, 2019

Samsung Siapkan Lima Proyek dan Empat Startup C-Lab Untuk CES 2020

Samsung akan kembali memamerkan hasil program C-Lab ke ajang CES 2020. Ini dia proyek dan…

December 30, 2019