Saturday, 28 March 2015

Creating a Dialog fragment in Android

Background

In this post we are going to see how to create a simple custom dialog fragment in Android.


So we will create a dialog box that looks like above. It is a simple dialog box that asks user if he wants to go to google search or not. If user presses "Not Now" then we simply close the dialog box and if user presses "Yes" then we open browser with url as "google.com" using implicit intent.

To The Code...

Code for it is as follows  -

/**
 * 
 * @author athakur
 *
 */
public class VisitGoogleDialog extends DialogFragment {
    
    private static final String GOOGLE_URL = "http://www.google.com/";
    
    Context appContext;
    
    public VisitGoogleDialog(Context context) {
        this.appContext = context;
    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        // Use the Builder class for convenient dialog construction
        AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
        TextView dialogMessage = new TextView(appContext);
        dialogMessage.setText(R.string.google_dialog_info);
        dialogMessage.setGravity(Gravity.CENTER_HORIZONTAL);
        builder.setView(dialogMessage)
               .setPositiveButton(R.string.pos_dialog_text, new DialogInterface.OnClickListener() {
                   public void onClick(DialogInterface dialog, int id) {
                       Intent viewGoogleIntent = new Intent(Intent.ACTION_VIEW,Uri.parse(GOOGLE_URL));
                       startActivity(viewGoogleIntent );
                   }
               })
               .setNegativeButton(R.string.neg_dialog_text, new DialogInterface.OnClickListener() {
                   public void onClick(DialogInterface dialog, int id) {
                       dialog.dismiss();
                   }
               });
        // Create the AlertDialog object and return it
        return builder.create();
    }

}

Creating this dialog from any activity is also quite simple. Following is the code to bring this dialog up by selecting "more info" option from menu.

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        int id = item.getItemId();
        if (id == R.id.more_info) {
            DialogFragment googleDialogFragment = new VisitGoogleDialog(this);
            googleDialogFragment.show(getSupportFragmentManager(), "GoogleDialog");
            return true;
        }
        return super.onOptionsItemSelected(item);
    }

For me it finally looked like - 

Adding custom layout to the Dialog

Inside  onCreateDialog() method you can add your custom layout to the dialog - 

        AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
        final View customView =  getLayoutInflater(savedInstanceState).inflate(R.layout.modern_art_ui_layout, null);
        builder.setView(customView);

And in onClickListener you can easily get Views in the layout and do any processing if needed - 

               builder .setPositiveButton(R.string.pos_dialog_text, new DialogInterface.OnClickListener()  {
                   public void onClick(DialogInterface dialog, int id) {
                       View leftImage= customView.findViewById(R.id.leftImage);
                       // process leftImage
                   }
               })


Note : I am not providing resource  file data as I think it should be trivial to understand. For eg value for String resource "google_dialog_info" should be set to "Continue to google search ?" for this demo. Same goes to other resources like layout files.


Related Links

t> UA-39527780-1 back to top