Android Custom Dialog Example

July 13, 2010 in Dialog by Sasikumar

Moving ahead from simple dialog example, we are going to see about how to display a custom dialog using 2 Textview & 1 Button.
Custom Dialog is very much needed when we are using different UI Design graphics in Android. If the application top & bottom navigation bar color is blue, the dialog box also need to be blue to match the UI design. In this case we need a custom dialog with blue color with our own views.

Files Used :-

  • CustomDialogExample.java ( extends Activity – Main Activity Class )
  • CustomizeDialog.java ( extends Dialog – dialog box actions )
  • main.xml ( custom dialog design in xml file )

The output looks similar to

 


main.xml
Design the dialog using xml file

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="@+id/LinearLayout01"
	android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
	android:background="@drawable/bg_android" android:orientation="vertical"
	android:gravity="center" android:layout_width="200dip">
	<TextView android:id="@+id/TextView01" android:layout_height="wrap_content"
		android:textColor="#fff" android:textStyle="bold"
		android:layout_width="wrap_content" android:text=" AndroidPeople.com "></TextView>
	<TextView android:id="@+id/TextView02" android:layout_height="wrap_content"
		android:textColor="#fff" android:layout_width="wrap_content"
		android:layout_margin="7dip" android:text="Custom Dialog Example By AndroidPeople.com"
		android:gravity="center"></TextView>
	<Button android:layout_width="wrap_content"
		android:layout_height="wrap_content" android:text="OK" android:id="@+id/OkButton"></Button>
</LinearLayout>

CustomDialogExample.java
This is Main Activity Class, used to display a custom dialog.

package org.androidpeople.dialog;

import android.app.Activity;
import android.os.Bundle;

public class CustomDialogExample extends Activity {
	/** Called when the activity is first created. */
	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		/** Display Custom Dialog */
		CustomizeDialog customizeDialog = new CustomizeDialog(this);
		customizeDialog.show();
	}
}

CustomizeDialog
This class should be extends with Dialog. Dialog views action will be done here.

package org.androidpeople.dialog;

import android.app.Dialog;
import android.content.Context;
import android.view.View;
import android.view.Window;
import android.view.View.OnClickListener;
import android.widget.Button;

/** Class Must extends with Dialog */
/** Implement onClickListener to dismiss dialog when OK Button is pressed */
public class CustomizeDialog extends Dialog implements OnClickListener {
	Button okButton;

	public CustomizeDialog(Context context) {
		super(context);
		/** 'Window.FEATURE_NO_TITLE' - Used to hide the title */
		requestWindowFeature(Window.FEATURE_NO_TITLE);
		/** Design the dialog in main.xml file */
		setContentView(R.layout.main);
		okButton = (Button) findViewById(R.id.OkButton);
		okButton.setOnClickListener(this);
	}

	@Override
	public void onClick(View v) {
		/** When OK Button is clicked, dismiss the dialog */
		if (v == okButton)
			dismiss();
	}

}
 

You can download the full source code from here

 
Android Custom Dialog Example