How to create a Custom Dialog box in android? How to create a Custom Dialog box in android? android android

How to create a Custom Dialog box in android?


Here I have created a simple Dialog, like:

Dialog Box

custom_dialog.xml

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="80dp"    android:background="#3E80B4"    android:orientation="vertical" >    <TextView        android:id="@+id/txt_dia"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center"        android:layout_margin="10dp"        android:text="Do you realy want to exit ?"        android:textColor="@android:color/white"        android:textSize="15dp"        android:textStyle="bold"/>        <LinearLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_gravity="center"        android:background="#3E80B4"        android:orientation="horizontal" >        <Button            android:id="@+id/btn_yes"            android:layout_width="100dp"            android:layout_height="30dp"            android:background="@android:color/white"            android:clickable="true"            android:text="Yes"            android:textColor="#5DBCD2"            android:textStyle="bold" />        <Button            android:id="@+id/btn_no"            android:layout_width="100dp"            android:layout_height="30dp"            android:layout_marginLeft="5dp"            android:background="@android:color/white"            android:clickable="true"            android:text="No"            android:textColor="#5DBCD2"            android:textStyle="bold" />    </LinearLayout></LinearLayout>

You have to extends Dialog and implements OnClickListener

public class CustomDialogClass extends Dialog implements    android.view.View.OnClickListener {  public Activity c;  public Dialog d;  public Button yes, no;  public CustomDialogClass(Activity a) {    super(a);    // TODO Auto-generated constructor stub    this.c = a;  }  @Override  protected void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);    requestWindowFeature(Window.FEATURE_NO_TITLE);    setContentView(R.layout.custom_dialog);    yes = (Button) findViewById(R.id.btn_yes);    no = (Button) findViewById(R.id.btn_no);    yes.setOnClickListener(this);    no.setOnClickListener(this);  }  @Override  public void onClick(View v) {    switch (v.getId()) {    case R.id.btn_yes:      c.finish();      break;    case R.id.btn_no:      dismiss();      break;    default:      break;    }    dismiss();  }}

How to Call Dialog ?

R.id.TXT_Exit:CustomDialogClass cdd=new CustomDialogClass(Values.this);cdd.show();  

Updates

After a long time one of my friends asked me to make a curved shape dialog with a transparent background. So, Here I have implemented it.

enter image description here

To Make a curved shape you need to create a separate curve_shap.XML as below,

<shape xmlns:android="http://schemas.android.com/apk/res/android" >    <solid android:color="#000000" />    <stroke        android:width="2dp"        android:color="#ffffff" />    <corners        android:bottomLeftRadius="20dp"        android:bottomRightRadius="20dp"        android:topLeftRadius="20dp"        android:topRightRadius="20dp" /></shape>

Now, add this curve_shap.XML in your main view Layout. In my case I have used LinearLayout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"        android:layout_width="fill_parent"        android:layout_height="80dp"        android:background="@drawable/curve_shap"        android:orientation="vertical" >...</LinearLayout>

How to call this ?

CustomDialogClass cdd = new CustomDialogClass(MainActivity.this);cdd.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));cdd.show();

I hope that works for you.


This is an example dialog, create with xml.

enter image description here

the next code xml is just an example, the design or view is implemented here:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"android:orientation="vertical"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="#ffffffff"><ImageView    android:layout_width="match_parent"    android:layout_height="120dp"    android:id="@+id/a"    android:gravity="center"    android:background="#DA5F6A"    android:src="@drawable/dialog_cross"    android:scaleType="fitCenter" /><TextView    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:text="TEXTO"    android:id="@+id/text_dialog"    android:layout_below="@+id/a"    android:layout_marginTop="20dp"    android:layout_marginLeft="4dp"    android:layout_marginRight="4dp"    android:layout_marginBottom="20dp"    android:textSize="18sp"    android:textColor="#ff000000"    android:layout_centerHorizontal="true"    android:gravity="center_horizontal" /><Button    android:layout_width="wrap_content"    android:layout_height="30dp"    android:text="OK"    android:id="@+id/btn_dialog"    android:gravity="center_vertical|center_horizontal"    android:layout_below="@+id/text_dialog"    android:layout_marginBottom="20dp"    android:background="@drawable/btn_flat_red_selector"    android:layout_centerHorizontal="true"    android:textColor="#ffffffff" /></RelativeLayout>

this lines of code are resources of drawable:

android:src="@drawable/dialog_cross"android:background="@drawable/btn_flat_red_selector"

you could do a class extends Dialog, also something like this:

public class ViewDialog {    public void showDialog(Activity activity, String msg){        final Dialog dialog = new Dialog(activity);        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);        dialog.setCancelable(false);        dialog.setContentView(R.layout.dialog);        TextView text = (TextView) dialog.findViewById(R.id.text_dialog);        text.setText(msg);        Button dialogButton = (Button) dialog.findViewById(R.id.btn_dialog);        dialogButton.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                dialog.dismiss();            }        });        dialog.show();    }}

finally the form of call, on your Activity for example:

ViewDialog alert = new ViewDialog();alert.showDialog(getActivity(), "Error de conexión al servidor");

I hope its work for you.

UPDATE

Drawable XML For dialog :

<shape xmlns:android="schemas.android.com/apk/res/android"> <stroke android:width="2dp" android:color="#FFFFFF" /> <gradient android:angle="180" android:endColor="@color/NaranjaOTTAA" android:startColor="@color/FondoActionBar" /> <corners android:bottomLeftRadius="7dp" android:bottomRightRadius="7dp" android:topLeftRadius="7dp" android:topRightRadius="7dp" /> </shape> 

This xml was provided by @GastónSaillén.


Another easy way to do this.

step 1) create a layout with proper id's.

step 2) use the following code wherever you desire.

LayoutInflater factory = LayoutInflater.from(this);final View deleteDialogView = factory.inflate(R.layout.mylayout, null);final AlertDialog deleteDialog = new AlertDialog.Builder(this).create();deleteDialog.setView(deleteDialogView);deleteDialogView.findViewById(R.id.yes).setOnClickListener(new OnClickListener() {        @Override    public void onClick(View v) {        //your business logic         deleteDialog.dismiss();    }});deleteDialogView.findViewById(R.id.no).setOnClickListener(new OnClickListener() {        @Override    public void onClick(View v) {        deleteDialog.dismiss();        }});deleteDialog.show();