Wednesday, 4 April 2012

Android: Creating custom alert dialog

In android sometimes we want to display some data but we do not want to start a new activity.As starting a new activity is not feasible in some cases.So what should we do?

First take a case

We have news showing in List-View now if some one click on on particular news then it should show detail about this this news.so instead of starting new activity we can just pop a custom dialog (with same view as activity) then we will use a custom dialog for this. Because of its benefit we call this custom dialog as Dialog activity

Step 1) Create a new project in android

Step 2) Change your main.xml as follows

  <?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="fill_parent" android:orientation="vertical">  
     <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/start" android:id="@+id/show_dialog" />  
  </LinearLayout>  



Step 3) Create a new xml to showing our custom dialog
 
 <?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="fill_parent"  
   android:background="#FFFF00"  
   android:orientation="vertical" >  
    <TextView  
     android:layout_width="fill_parent"  
     android:layout_height="wrap_content"  
     android:layout_margin="10dp"  
     android:text="@string/msg"  
     android:textColor="#000" >  
   </TextView>  
   <Button  
     android:layout_width="wrap_content"  
     android:layout_height="wrap_content"  
     android:layout_gravity="center_horizontal"  
     android:clickable="true" android:id="@+id/dismis_dialog"  
     android:text="@string/dismis" />  
  </LinearLayout>  

Step 4) Change your main activity code to as following


 package com.ahmad.com;  
 import android.app.Activity;  
 import android.os.Bundle;  
 import android.view.View;  
 import android.view.View.OnClickListener;  
 public class CustomDialogActivity extends Activity implements OnClickListener {  
   /** Called when the activity is first created. */  
   @Override  
   public void onCreate(Bundle savedInstanceState) {  
     super.onCreate(savedInstanceState);  
     setContentView(R.layout.main);  
     findViewById(R.id.show_dialog).setOnClickListener(this);  
   }  
 @Override  
 public void onClick(View v) {  
 CustomDialogClass cdd=new CustomDialogClass(this);  
 cdd.show();  
 }  
 }  
 Step 5) Create a new class for showing dialog  
 package com.ahmad.com;  
 import android.app.Dialog;  
 import android.content.Context;  
 import android.os.Bundle;  
 import android.view.View;  
 import android.widget.Button;  
 public class CustomDialogClass extends Dialog implements android.view.View.OnClickListener{  
 public CustomDialogClass(Context context) {  
 super(context);  
 }  
 Button btn;  
 @Override  
 protected void onCreate(Bundle savedInstanceState) {  
 super.onCreate(savedInstanceState);  
 setContentView(R.layout.dialog);  
 setTitle("This Sameer Custom Dialog");  
 btn=(Button) findViewById(R.id.dismis_dialog);  
 btn.setOnClickListener(this);  
 }  
 @Override  
 public void onClick(View v) {  
 dismiss();  
 }  
 }  


Enjoy this will show a custom dialog as below images


If you click on button show dialog it will show a dialog.your can dismis this dialog by clicking on dismiss button


   

Final thing how to remove title of dialog if you do not want this

In on-create() method of dialog class write this one line

this.findViewById(android.R.id.title).setVisibility(View.GONE);

If you like this please leave a comment.If you have any doubt then also mention your problem by leaving comment
Android News and source code