Tutorial Cara Membuat Button pada Android Studio
Assalamualaikum Warahmatullahi Wabarakatuh. Dalam mengembangkan sebuah aplikasi pastinya kita membutuhkan sebuah widget yang digunakan untuk mengeksekusi sesuatu, salah satu widget yang sering digunakan yaitu Button, Button sering digunakan untuk mengeksekusi program yang telah dirancang untuk melakukan sesuatu.
Pada Button, kita dapat menambahkan penanganan kejadian dan memberikan aksi (event) pada Button tersebut saat diklik, kita bisa menggunakan method onClick(), kejadian dapat ditangani dengan mengimplementasikan interface OnClickListener yang terdapat pada android.view.
A. Membuat Button
1) Pertama buat project baru pada Android Studio kalian, tutorialnya klik Disini.
2) Untuk contoh sederhananya, kita akan menggunakan 1 Button terlebih dahulu, cara membuatnya kita perlu menambahkan tag <Button> menggunakan kode xml atau bisa langsung mendragnya, pada activity_main.xml.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:gravity="center"
android:orientation="vertical"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">
<Button
android:id="@+id/testing"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Klik Disini" />
</LinearLayout>
Baca Juga:
Akan terlihat seperti ini:
Ada beberapa atribut yang saya gunakan pada button tersebut, diantaranya:
- android:id: Untuk menginisialisasi id pada Button tersebut.
- android:layout_width: Untuk mengatur lebar widget.
- android:layout_height: Untuk mengatur tinggi widget.
- android:text: Untuk menambahkan text pada widget.
B. Penanganan Kejadian
Sebelumnya kita sudah membuat 1 buah button pada aplikasi android, tapi jika kita jalankan dan mengklik button tersebut tidak akan berfungsi.
Cara agar Button tersebut berfungsi dengan baik sesuai fungsi dari aplikasi tersebut, kita perlu menggunakan OnClickListener(), untuk menangani kejadian saat button di klik.
Pada contoh berikut ini kita akan membuat kejadian dimana saat Button diklik, akan muncul pesan berupa dialog sederhana menggunakan sebuah class bernama Toast.
Buka file MainActivity.java kalian, lalu masukan source code berikut ini:
package android.cianjur.developer.net.basicandroid;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
private Button tombol; // Membuat Variable Button
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tombol = findViewById(R.id.testing); // Menginisialisasi ID untuk Button
// Sebuah Listener untuk penanganan kejadian saat tombol diklik
tombol.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
// Memunculkan pesan berupa text dialog saat tombol "Klik Disini" diklik.
Toast.makeText(getApplicationContext(), "Selamat Datang Di WILDAN TECHNO ART", Toast.LENGTH_SHORT).show();
}
});
}
}
Coba kalian jalankan projectnya, jika button tersebut di klik, maka hasilnya akan seperti berikut ini.
Pada contoh berikutnya kita akan membuat program sederhana menggunakan 3 buah Button, masing-masing button akan kita berikan aksi/event yang berbeda.
Kalian ubah terlebih dahulu kode xml pada activity_main, menjadi seperti berikut ini:
Pada contoh berikutnya kita akan membuat program sederhana menggunakan 3 buah Button, masing-masing button akan kita berikan aksi/event yang berbeda.
Kalian ubah terlebih dahulu kode xml pada activity_main, menjadi seperti berikut ini:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:gravity="center"
android:orientation="vertical"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">
<Button
android:id="@+id/testing_satu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Masuk" />
<Button
android:id="@+id/testing_dua"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Daftar" />
<Button
android:id="@+id/testing_tiga"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Keluar" />
</LinearLayout>
Akan terlihat seperti ini:
Jika terdapat beberapa widget yang menggunakan OnClickListener, ada cara lain untuk menambahkan OnClickListener pada masing-masing widget, yaitu dengan menggunakan implementasi interface View.OnClickListener.
Setelah itu kalian harus membuat method onClick() berparameter tunggal bertipe View dan memanggil setOnClickListener() pada masing-masing widget, didalam method onClick(), gunakan statement switch dan case untuk menentukan ID yang akan diklik.
package android.cianjur.developer.net.basicandroid;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity implements View.OnClickListener{
private Button tombol_masuk, tombol_daftar, tombol_keluar; // Membuat Variable Button
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tombol_masuk = findViewById(R.id.testing_satu); // Menginisialisasi ID untuk Button Masuk
tombol_daftar = findViewById(R.id.testing_dua); // Menginisialisasi ID untuk Button Daftar
tombol_keluar = findViewById(R.id.testing_tiga); // Menginisialisasi ID untuk Button Keluar
tombol_masuk.setOnClickListener(this); // Memberikan Listener pada Button Masuk
tombol_daftar.setOnClickListener(this); // Memberikan Listener pada Button Daftar
tombol_keluar.setOnClickListener(this); // Memberikan Listener pada Button Keluar
}
@Override
public void onClick(View view) {
// Mendapatkan Semua ID yang Terdapat pada Masing-masing Widget
switch (view.getId()){
case R.id.testing_satu:
// Statement disini akan di eksekusi jika tombol Masuk diklik
Toast.makeText(this, "Selamat Datang", Toast.LENGTH_SHORT).show();
break;
case R.id.testing_dua:
// Statement disini akan di eksekusi jika tombol Daftar diklik
Toast.makeText(this, "Silakan Mendaftar", Toast.LENGTH_SHORT).show();
break;
case R.id.testing_tiga:
// Statement disini akan di eksekusi jika tombol Keluar diklik
finish(); // Digunakan Untuk Keluar Dari Aplikasi
break;
}
}
}
Baca Juga:
Terakhir jalankan project tersebut dan lihatlah hasilnya.
Sekian dari saya, bila ada yang ingin ditanyakan, silakan isi komentar dibawah dan mohon maaf bila ada kesalahan. Wassalamualaikum Warahmatullahi Wabarakatuh.
