Mari kita lanjutkan lagi kawaan.
Kali ini kita akan membahas bagaimana caranya untuk membuat sebuah custom dialog. Caranya, pertama kita harus membuat sebuah layout baru dan menambahkan layout tersebut pada AlertDialog dengan memanggil method setView() pada object AlertDialog.Builder kawan-kawan.
contoh custom dialog :
Baiklah, seperti biasa buka eclipse kesayangan dan buka project yang telah kita buat pada postingan sebelumnya. Selanjutnya buat sebuah layout baru (buka folder res -> klik kanan folder layout -> New -> Android XML File). Isi sesuai gambar dibawah.
Berikut source lengkap pada custom_layout :
<?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:orientation="vertical" >
<EditText
android:id="@+id/editUser"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Username"
tools:ignore="TextFields,HardcodedText" >
<requestFocus />
</EditText>
<EditText
android:id="@+id/editPass"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="Password"
android:inputType="textPassword"
tools:ignore="HardcodedText" />
</LinearLayout>
Selanjutnya buka activity_main.xml dan tambahkan kode berikut :
<Button
android:id="@+id/btnCustom"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnChekBox"
android:text="Dialog Custom"
tools:ignore="HardcodedText" />
Lebih jelasnya, berikut source lengkapnya :
<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"
tools:context=".MainActivity" >
<Button
android:id="@+id/btnNeutral"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="14dp"
android:text="Dialog Neutral"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btnList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnNeutral"
android:text="Dialog Items"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btnRadioList"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnList"
android:text="Dialog Radio List"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btnChekBox"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnRadioList"
android:text="Dialog ChekBox List"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btnCustom"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnChekBox"
android:text="Dialog Custom"
tools:ignore="HardcodedText" />
<Button
android:id="@+id/btnKeluar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/btnCustom"
android:text="Keluar"
tools:ignore="HardcodedText" />
</RelativeLayout>
Sekarang buka MainActivity.java dan tambahkan pula atribut bertipe Button karena tadi kita telah menambahkan sebuah button baru pada activity_main.xml. Jangan lupa deklarasikan juga 2 buah EditText yang telah kita buat pada custom_layout.xml tadi pada MainActivity.java.
Button buttonCustom; EditText user; EditText pass;
Deklarasikan button baru yang telah kita buat pada onCreate(Bundle savedInstanceState).
buttonCustom=(Button)findViewById(R.id.btnCustom);
Buat sebuah method baru untuk menampung dialog yang kita buat.
public void actionCustomDialog(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
LayoutInflater inflater=getLayoutInflater();
final View view=inflater.inflate(R.layout.custom_layout, null);
builder.setTitle("LOGIN");
builder.setIcon(R.drawable.ic_launcher);
builder.setView(view);
builder.setPositiveButton("Sign In", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
user=(EditText) view.findViewById(R.id.editUser);
pass=(EditText) view.findViewById(R.id.editPass);
String u=user.getText().toString();
String p=pass.getText().toString();
Toast.makeText(context,"Username : " + u +"\n"
+"Password : "+ p, Toast.LENGTH_LONG).show();
}
});
builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
dialog.cancel();
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
Berikutnya kita tinggal membuat event yang akan kita berikan pada button yang telah kita buat tadi. Tambahkan kode berikut pada onCreate(Bundle savedInstanceState).
buttonCustom.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionCustomDialog();
}
});
Lebih jelasnya, berikut source lengkapnya :
package com.is.dialogtest;
import java.util.ArrayList;
import android.os.Bundle;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.Context;
import android.content.DialogInterface;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;
public class MainActivity extends Activity {
Context context=this;
Button buttonNeutral;
Button buttonKeluar;
Button buttonList;
Button buttonRadioList;
Button buttonChekBoxList;
Button buttonCustom;
EditText user;
EditText pass;
ArrayList<Integer> arrayList=new ArrayList<Integer>();
CharSequence items[]={"Ubuntu","Mandriva","Mint"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
buttonNeutral=(Button) findViewById(R.id.btnNeutral);
buttonList=(Button) findViewById(R.id.btnList);
buttonRadioList=(Button) findViewById(R.id.btnRadioList);
buttonChekBoxList=(Button)findViewById(R.id.btnChekBox);
buttonCustom=(Button)findViewById(R.id.btnCustom);
buttonKeluar=(Button) findViewById(R.id.btnKeluar);
buttonNeutral.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionNeutralButton();
}
});
buttonList.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionDialogList();
}
});
buttonRadioList.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionRadioList();
}
});
buttonChekBoxList.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionChekBoxList();
}
});
buttonCustom.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionCustomDialog();
}
});
buttonKeluar.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
// TODO Auto-generated method stub
actionKeluar();
}
});
}
public void actionKeluar(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
builder.setTitle("Konfirmasi");
builder.setMessage("Apakah Anda Akan Keluar ?");
builder.setCancelable(false);
builder.setPositiveButton("Ya", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface arg0, int arg1) {
// TODO Auto-generated method stub
MainActivity.this.finish();
}
});
builder.setNegativeButton("Tidak", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface arg0, int arg1) {
// TODO Auto-generated method stub
arg0.cancel();
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
public void actionNeutralButton(){
new AlertDialog.Builder(this).setTitle("Ini Title")
.setMessage("Ini Message")
.setNeutralButton("Oke", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface arg0, int arg1) {
// TODO Auto-generated method stub
//Tidak melakukan apapun
}
}).show();
}
public void actionDialogList(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
builder.setTitle("Distro Linux");
builder.setItems(items, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface arg0, int arg1) {
// TODO Auto-generated method stub
Toast.makeText(context, items[arg1], Toast.LENGTH_LONG).show();
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
public void actionRadioList(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
builder.setTitle("Radio Items");
builder.setSingleChoiceItems(items, 0, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface arg0, int arg1) {
// TODO Auto-generated method stub
Toast.makeText(context, items[arg1], Toast.LENGTH_LONG).show();
arg0.dismiss();
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
public void actionChekBoxList(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
builder.setTitle("CheckBox List");
builder.setMultiChoiceItems(items, null, new DialogInterface.OnMultiChoiceClickListener() {
@Override
public void onClick(DialogInterface dialog, int which, boolean isChecked) {
// TODO Auto-generated method stub
if(isChecked){
arrayList.add(which);
}else{
arrayList.remove(Integer.valueOf(which));
}
}
});
builder.setPositiveButton("Yes", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
String sequence="";
for(int i=0;i<arrayList.size();i++){
int x=arrayList.get(i);
sequence +=items[x] + "\n";
}
Toast.makeText(context,sequence, Toast.LENGTH_LONG).show();
arrayList.clear();
}
});
builder.setNegativeButton("No", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
public void actionCustomDialog(){
AlertDialog.Builder builder=new AlertDialog.Builder(context);
LayoutInflater inflater=getLayoutInflater();
final View view=inflater.inflate(R.layout.custom_layout, null);
builder.setTitle("LOGIN");
builder.setIcon(R.drawable.ic_launcher);
builder.setView(view);
builder.setPositiveButton("Sign In", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
user=(EditText) view.findViewById(R.id.editUser);
pass=(EditText) view.findViewById(R.id.editPass);
String u=user.getText().toString();
String p=pass.getText().toString();
Toast.makeText(context,"Username : " + u +"\n"
+"Password : "+ p, Toast.LENGTH_LONG).show();
}
});
builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// TODO Auto-generated method stub
dialog.cancel();
}
});
AlertDialog alertDialog=builder.create();
alertDialog.show();
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.activity_main, menu);
return true;
}
}
Langkah selanjutnya jalankan aplikasi kawan-kawan.
Nah, selesai sudah kita membuat sebuah custom dialog. Begitulah kira-kira salah satu cara membuat custom dialog.
Oke kawan, untuk postingan kali ini ane akhiri sekian, semoga bermanfaat dan sampai jumpa di postingan berikutnya.
Download project latihannya disini.
0 comments:
Post a Comment