Types Of DialogBox Part Two (Custom DialogBox) (Android)

Custom Dialog Box

After clicking button

Examples of Custom Dialog Box 

used this in my galaxy info project

used this in my education project

Create new Android Project
Project Name: TypesOfDialog
//tested from 2.3.3 to current android sdk 
Build Target: Android 2.3.3   //or greater than that
Application Name: Types Of Dialog
Package Name: com.shaikhhamadali.blogspot.typesofdialog
Create layout file: activity_types_of_dialog

  1.create layout:

• activity_types_of_dialog:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <Button
        android:id="@+id/btnCustomDialog"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="120dp"
        android:text="Show customized dialog box"
        android:textSize="25sp" />

    <TextView
        android:id="@+id/tvDemo"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:gravity="center"
        android:text="Types OF Dialog"
        android:textColor="#6A96B0"
        android:textSize="50sp"
        android:textStyle="bold|italic" />

</RelativeLayout>

• custom dialog layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="1280dp"
    android:layout_height="800dp"
    android:background="#00000000" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="750dp"
        android:layout_height="400dp"
        android:layout_centerInParent="true"
        android:alpha="0.9"
        android:scaleType="fitXY"
        android:src="@drawable/settings_bg_gray" />

    <Button
        android:id="@+id/btnClose"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_marginRight="220dp"
        android:layout_marginTop="150dp"
        android:background="@drawable/close_setting_btn" />

    <TextView
        android:id="@+id/tVMessage"
        android:layout_width="500dp"
        android:layout_height="280dp"
        android:layout_centerHorizontal="true"
        android:layout_marginLeft="350dp"
        android:layout_marginTop="250dp"
        android:gravity="center"
        android:text="Welcome to the Hamad&apos;s blog"
        android:textColor="#ffffff"
        android:textSize="25sp" />

</RelativeLayout>

• styles file:

 <style name="custom_dialog_theme">
    <item name="android:windowBackground">@color/dialog_background_color</item>
 </style>

• colors file

     <!-- add this in your colors.xml file -->
    <color name="dialog_background_color">#00000000</color>

2. code of activity:

package com.shaikhhamadali.blogspot.typesofdilaog;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class TypesOfDialog extends Activity {
 Button btnCustomDialog;
 Activity activity;

 @Override
 public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_types_of_dialog);
  // create instance of activity
  activity = this;
  btnCustomDialog = (Button) findViewById(R.id.btnCustomDialog);
  // create on click listner for show custom dialog button
  btnCustomDialog.setOnClickListener(new OnClickListener() {

   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    // show custom dialog
    new CustomDialog(activity).show();
   }
  });
 }
}

• Code of Custom Dialog Class:

package com.shaikhhamadali.blogspot.typesofdilaog;

import android.app.Activity;
import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.Button;

public class CustomDialog extends Dialog {
 Button btnClose;
 Activity activity;

 public CustomDialog(Activity a) {
  super(a, R.style.custom_dialog_theme);
  // TODO Auto-generated constructor stub
  activity = a;
 }

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  // hide notification bar
  requestWindowFeature(Window.FEATURE_NO_TITLE);
  setContentView(R.layout.custom_dialog);
  btnClose = (Button) findViewById(R.id.btnClose);
  btnClose.setOnClickListener(new View.OnClickListener() {

   @Override
   public void onClick(View v) {
    // TODO Auto-generated method stub
    // dismiss dialog box
    dismiss();
   }
  });

 }

}

3. note that:

• you can use this on button on click,on action_down,on the fly etc.
• detailed info about Alert Dialog
• detailed info about Pickers,Date picker Dialog
• refer previous post for better understanding click here.
• you can use this in many ways (warning,welcome,error).

  4. conclusion:

• Some information about Customizing Dialogs.
• Know how to create Custom Dialogs.
• know how to interact with Custom Dialogs.
• how to get user selections and use them accordingly.

  5. about the post:

• The code seems to explain itself due to comments, if you have any question you can ask too!
•  Don’t mind to write a comment whatever you like to ask, to know,to suggest or recommend.
•  Hope you enjoy it!

6. Source Code:

        you can download the source code here

Cheers,

Hamad Ali Shaikh