Android DialogFragment Example

In this tutorial we will try to learning how to create dialog fragment in android , so what is dialog fragment ?, dialog fragment is a  dialog window which float's on top of it's activity window , i have already discussed about alert dialog and progress dialog in my previous tutorials .

DOWNLOAD CODE

Project Detail

Project Name	DialogFragmentDemo
Package	com.pavan.dialogfragmentdemo
Minimum SDK	API 8
Target SDK	API 17
Theme	Holo Light with Dark Action Bar

XML Layout

Create Two XML Layout , one for main activity and another for the fragment dialog .

1. activity_main.xml .
2. dialog_fragment.xml .

file : activity_main.xml

<?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"
    android:padding="20dp" >

    <Button
        android:id="@+id/button1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:onClick="showDialog"
        android:text="Show Dialog" />

</LinearLayout>

file :dialog_fragment.xml

<?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"
    android:padding="10dp" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="45dp"
        android:text="This Is Dialog Fragment"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <Button
        android:id="@+id/nobtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/yesbtn"
        android:layout_alignBottom="@+id/yesbtn"
        android:layout_alignRight="@+id/textView1"
        android:layout_marginRight="38dp"
        android:text="No" />

    <Button
        android:id="@+id/yesbtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textView1"
        android:layout_below="@+id/textView1"
        android:layout_marginLeft="24dp"
        android:layout_marginTop="20dp"
        android:text="Yes" />

</RelativeLayout>

Dialog Fragment

• To Create a dialog fragment your fragment should extend DialogFragment class.
• Inside the onCreateView() method inflate the layout of this dialog with above defined dialog_fragment.xml layout .
• As you can see i have added two buttons for the dialog layout with the text "yes" and "no" ,and for these buttons i am setting the onClicklistener and using Inter-fragment communication concept which i have already discussed on my previous tutorial on fragments .

file :MyDialogFragment.java

package com.pavan.dialogfragmentdemo;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.DialogFragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.Button;

public class MyDialogFragment extends DialogFragment implements OnClickListener {

    Button yes_button, no_button;
    Communicator communicator;

    @Override
    public void onAttach(Activity activity) {

        super.onAttach(activity);

           if (activity instanceof Communicator) {
            communicator = (Communicator) getActivity();
          } else {
            throw new ClassCastException(activity.toString()
                    + " must implemenet MyListFragment.communicator");
        }

    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        setCancelable(false);
        getDialog().setTitle("Title");

        View view = inflater.inflate(R.layout.dialog_fragment, null, false);

        yes_button = (Button) view.findViewById(R.id.yesbtn);
        no_button = (Button) view.findViewById(R.id.nobtn);

        // setting onclick listener for buttons
        yes_button.setOnClickListener(this);
        no_button.setOnClickListener(this);

        return view;
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
        case R.id.yesbtn :
            dismiss();
            communicator.message("Dialog Yes btn clicked");
            break;

        case R.id.nobtn :
            dismiss();
            communicator.message("Dialog No btn clicked");
            break;
        }

    }

    public interface Communicator {
        public void message(String data);
    }

}

MainActivity

Create a MainActivity class which extends Activity class and set the content of this activity with activity_main.xml  layout,  to show a dialog fragment call the show() method on fragment manger object by passing fragment object and any string as parameter to it .

file :MainActivity.java

package com.pavan.dialogfragmentdemo;

import android.annotation.SuppressLint;
import android.app.Activity;
import android.app.FragmentManager;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;

public class MainActivity extends Activity implements
        MyDialogFragment.Communicator {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

    }

    public void showDialog(View view) {

        FragmentManager manager = getFragmentManager();
        MyDialogFragment mydialog = new MyDialogFragment();
        mydialog.show(manager, "mydialog");

    }

    @Override
    public void message(String data) {

        Toast.makeText(getApplicationContext(), data + " button clicked",
                Toast.LENGTH_SHORT).show();

    }

}