Module V.

Dialog
A. Tujuan
Agar mahasiswa dapat memahami karakteristik dialog yang ada di aplikasi
android.
B. Bahan
1. Software Android Studio
2. Koneksi Internet
3. Smartphone
C. Teori
Di Android terdapat beberapa jenis pop-up dialog antar lain : Toast (sudah
diperkenalkan di modul 4 tentang komponen), SnackBar, AlertDialog serta
custom dialog yang bisa dibuat oleh programmer sendiri.
Alert Dialog adalah sebuah pop up yang muncul pada saat-saat tertentu dan
berfungsi untuk memberi info pada pengguna, berbentuk kotak.
Alert dialog bisa dibuat dengan layout custom yang berisi informasi, sesuai
dengan layout yang diinginkan.
Toast adalah salah satu widget yang berfungsi untuk menampilkan sebuah
pesan untuk pengguna. Bisa juga disebut pemberitahuan yang terlintas setelah
pengguna melakukan aksi. Contoh-contoh Toast telah diberikan pada modul 4.

D. Praktikum
Pertama adalah buatlah project baru di Android Studio dengan menggunakan
template Empty Activity

1. Alert Dialog
Tahapan membuat AlertDialog sebagai berikut :
a. Gunakan AlertDialog.Builder untuk membuat interface dari kotak dialog
seperti title, pesan yang ingin ditampilkan, tombol, tombol click listener,
dan icon.
b. Kemudian, menggunakan builder tersebut akan dibuat object AlertDialog
baru.
c. Gunakan fungsi AlertDialog.show() untuk menampilkan dialog. Selesai.
Langkah I : bukalah file layout/activity_main.xml, tambahkan kode seperti di
bawah ini :

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

<android.support.constraint.ConstraintLayout
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"
tools:context="id.ac.unair.fst.si.modul5alertdialog.MainActivity">

<Button
android:id="@+id/bt_alert"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
android:elevation="0dp"
android:text="Tekan Tombol"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Langkah II : buka file MainActivity.java. Ketiklah kode seperti dibawah ini :

package id.ac.unair.fst.si.modul5alertdialog;

import android.content.DialogInterface;
import android.support.v7.app.AlertDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {

private Button btAlert; // ------ btAlert sbg Button ------

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// -------------- awal 1 -----------------------------
btAlert = (Button) findViewById(R.id.bt_alert);
btAlert.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
showDialog();
}
});
// -------------- akhir 1 ----------------------------
}
// -------------- awal 2 -----------------------------
private void showDialog(){
AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(
this);
// set title dialog
alertDialogBuilder.setTitle("Keluar dari aplikasi?");

// set pesan dari dialog

alertDialogBuilder
.setMessage("Klik untuk keluar!")
.setIcon(R.mipmap.ic_launcher)
 .setCancelable(false)

.setPositiveButton("Ya",new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,int id) {

// jika tombol diklik, maka akan menutup activity ini

MainActivity.this.finish();
}
})
.setNegativeButton("Tidak",new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
// jika tombol ini diklik, akan menutup dialog
// dan tidak terjadi apa2
dialog.cancel();
}
})
;

// membuat alert dialog dari builder

AlertDialog alertDialog = alertDialogBuilder.create();

// menampilkan alert dialog

alertDialog.show();
}
// -------------- akhir 2 ----------------------------
}

Selanjutnya, hapuslah metode .setPositifButton dan .setNegatifButton, dan

gantilah dengan kode di bawah ini :
.setNeutralButton("Ok", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
// do something
}
})

Kompile, dan perhatikan apa yang terjadi.

2. Custom AlertDialog
Langkah I : bukalah file layout/activity_main.xml, ketiklah kode seperti di
bawah ini :
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
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"
tools:context="id.ac.unair.fst.si.modul5customalertdialog.MainActivity">

<Button
android:id="@+id/bt_showdialog"
android:layout_width="wrap_content"
 android:layout_height="wrap_content"
android:text="Show Custom Dialog" />
</android.support.constraint.ConstraintLayout>

Tombol untuk memunculkan custom dialog.

Langkah II : Buatlah file xml baru dan berinama customdialog.xml dan tulislah
kode seperti di bawah 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">

<ImageView
android:id="@+id/cust_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp" />

<TextView
android:padding="5dp"
android:id="@+id/cust_desc"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_toRightOf="@+id/cust_icon" />

<Button
android:id="@+id/bt_ok"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/iv_icon"
android:layout_margin="5dp"
android:text=" Oke " />
</LinearLayout>

Langkah III : buka file MainActivity.java. Ketiklah kode seperti dibawah ini :

package id.ac.unair.fst.si.modul5customalertdialog;

import android.app.Dialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

private Button button;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
 //------------------------Tambahan : Awal -------------------------

Button btShow = (Button) findViewById(R.id.bt_showdialog);

btShow.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {

// Inisiasi

final Dialog dialog = new Dialog(MainActivity.this);

dialog.setContentView(R.layout.customdialog);
dialog.setTitle("si.fst.unair.ac.id");

// Setting komponen custom dialog

TextView text = (TextView) dialog.findViewById(R.id.cust_desc);

text.setText("Selamat Datang di Custom Dialog Example");
ImageView image = (ImageView) dialog.findViewById(R.id.cust_icon);
image.setImageResource(R.mipmap.ic_launcher);

Button dialogButton = (Button) dialog.findViewById(R.id.bt_ok);

// jika diklik dialog ditutup

dialogButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dialog.dismiss();
}
});

dialog.show();
}
});

//------------------------Tambahan : akhir ------------------------

}
}

E. Tugas
F. Pustaka
https://developer.android.com/guide