Cara Membuat SnackBar di Android Material Design
Assalamualaikum Warahmatullahi Wabarakatuh.
SnackBar adalah salah satu view yang termasuk kedalam Android Material Design, view tersebut mempunyai fungsi hampir sama dengan Toast, yaitu untuk menampilkan pesan/informasi singkat pada user. Perbedaannya yaitu, SnackBar mempunyai posisi default pada bagian bawah layar ketika tampil. Selain itu juga, SnackBar mempunyai tombol “Action”, ketika diklik oleh user, SnackBar akan melakukan sebuah aksi yang telah kita definisikan sebelumnya.
Pada tutorial sebelumnya, saya sudah membahas mengenai pengguaan Toast pada Android, jika kalian pernah membuatnya, fungsi SnackBar bisa kalian gunakan sebagai alternative lain dari Toast, atau bisa kalian kombinasikan keduanya. Mari kita simak tutorial berikut ini.
Materi Lainnya Yang Direkomendasikan:
- Cara Membuat Floating Action Button Material Design
- Tutorial Membuat TextInputLayout Material Design
- Cara Membuat Custom Toolbar Material Design
Buka Android Studio kalian, bualah project baru dan juga new Empty Activity, untuk kita gunakan sebagai MainActivity.
Selanjutnya buka file activity_main.xml pada project kalian, disini kita akan menambahkan sebuah Button, saat Button tersebut diklik, maka akan muncul pesan atau informasi singkat pada SnackBar.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
tools:context="android.cianjur.developer.net.basicandroid.MainActivity">
<Button
android:id="@+id/klikme"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Klik Disini Gan!" />
</RelativeLayout>
Pada umunya, cara memanggil SnackBar sama seperti Toast, yaitu menggunakan static-chained method yang bisa langsung dipanggil pada suatu Activity. Pada contoh dibawah ini, kita akan mencoba memanggil SnackBar dengan menggunakan Button dan juga akan kita kombinasikan dengan Toast, saat tombol action pada SnackBar diklik, makan pesan dari Toast akan muncul. Coba kalian perhatikan source code berikut ini.
package android.cianjur.developer.net.basicandroid;
import android.content.Context;
import android.support.design.widget.Snackbar;
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{
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Button ClickMe = findViewById(R.id.klikme);
ClickMe.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Snackbar.make(view, "Ini Adalah SnackBar", Snackbar.LENGTH_LONG)
.setAction("Klik Juga Disini", new View.OnClickListener() {
@Override
public void onClick(View view) {
//Memunculkan Pesan Toast, Saat Action Diklik
Toast.makeText(getApplicationContext(),"Belajar Android", Toast.LENGTH_SHORT).show();
}
}).show();
}
});
}
}
Selain menambahkan pesan, pada SnackBar tersebut, kita tambahkan Action/Aksi yang bisa diklik oleh user, menggunakan fungsi setAction(), fungsi tersebut mempunyai parameter yaitu String untuk nama aksi yang akan ditampilkan, dan sebuah OnClickListener berisi perintah yang akan dilakukan saat Action tersebut diklik.
Demo:
Wassalamualaikum Warahmatullahi Wabarakatuh.
