Custom dialog / card in android

Question

Is it possible to create custom dialog box / card in android, I am not exatctly sure what its called, so I haven't been able to find something of much use. I want to create a something along the lines of;

and open this from my main activity when a button is pressed, any guidence or help is welcomed!

Edited:

Sorry, I think my question went out in the wrong way, I want a custom dialog box / card that appears as a pop like a normal dialog box does, for example;

I have tried creating a normal default dialog box that is pre-build in android however, this does not suit the need of my app.

AlertDialog.Builder builder = new AlertDialog.Builder(this)
.setTitle("Title")
.setMessage("message")
.setCancelable(true)
.setNeutralButton("OK", new DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dialog, int id) {
        dialog.cancel();
    }})

have you tried any thing yet. pass custom layout to dialog box. I think you can easily achieve this. it does not look complicated to me. — Mohammad Tauqir, Jan 09 '16 at 19:06
I haven't done anything like this before, I am not quite sure where to start. — Henry, Jan 09 '16 at 19:13
@Henry Please do not deface your posts. The value of Stack Overflow is in presenting an archive of problems and solutions. — Nikolai Ruhe, Jan 10 '16 at 09:40

score 0 · Answer 1 · answered Jan 09 '16 at 19:23

    // add button listener
    button.setOnClickListener(new OnClickListener() {

      @Override
      public void onClick(View arg0) {

        // custom dialog
        final Dialog dialog = new Dialog(context);
        dialog.setContentView(R.layout.custom);
        dialog.setTitle("Title...");

        // set the custom dialog components - text, image and button
        TextView text = (TextView) dialog.findViewById(R.id.text);
        text.setText("Android custom dialog example!");
        ImageView image = (ImageView) dialog.findViewById(R.id.image);
        image.setImageResource(R.drawable.ic_launcher);

        Button dialogButton = (Button) dialog.findViewById(R.id.dialogButtonOK);
        // if button is clicked, close the custom dialog
        dialogButton.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                dialog.dismiss();
            }
        });

        dialog.show();
      }
    });

Complete info look here

score 0 · Answer 2 · answered Jan 09 '16 at 19:24

You can just create a Fragment that extends DialogFragment. In order to start a Fragment, you need to handle the FragmentManager.

The code below shows you how to get started with Fragments using the Support Library.

getSupportFragmentManager().beginTransaction().add().commit();

And in your Fragment, you can customize the layout as you please.

If you just want to get easy Dialogs I would recommend you to check this library:

https://github.com/afollestad/material-dialogs

With this you can just create dialogs with code similar to:

new MaterialDialog.Builder(this)
        .title(R.string.title)
        .items(R.array.items)
        .itemsCallbackSingleChoice(-1, new MaterialDialog.ListCallbackSingleChoice() {
            @Override
            public boolean onSelection(MaterialDialog dialog, View view, int which, CharSequence text) {
                /**
                 * If you use alwaysCallSingleChoiceCallback(), which is discussed below,
                 * returning false here won't allow the newly selected radio button to actually be selected.
                 **/
                return true;
            }
        })
        .positiveText(R.string.choose)
        .show();

score 0 · Answer 3 · answered Jan 09 '16 at 19:24

Create static inner class in your activity:

public static class MyDialogFragment extends DialogFragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.custom_dialog_view, container, false);

        // Get your dialog  views here ie.

        TextView textView = v.findViewById(R.id.dialog_textview);
        textView.setText("Im am dialog");

        return v;

    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {

        Dialog dialog = super.onCreateDialog(savedInstanceState);

        dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);

        return dialog;
    }

    public void onResume(){
        super.onResume();
        Window window = getDialog().getWindow();
        window.setLayout(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.WRAP_CONTENT);
    }

}

Create your dialog like this in activity:

void showDialog() {
    DialogFragment newFragment = new MyDialogFragment();
    newFragment.show(getFragmentManager(), "dialog");
}

Make your to create your custom view in xml

custom_dialog_view.xml

<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_height="wrap_content"
   android:layout_width="match_parent"
   android:orientation="vertical"
   android:gravity="center" >

   <TextView
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:id="@+id/dialog_textview" />
</LinearLayout>

Custom dialog / card in android

3 Answers3