How to customize pop up notifications?

Question

When you click on the image button, pop up notification pops up. How do I customize the "ok" and "cancel" button to instead of using the default look of the buttons, I want to use my own custom ImageButtons as "ok" and "cancel".

Here's my code for pop up notification.

public class Notifications extends AppCompatActivity {


ImageButton Notifications;

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


    Notifications = (ImageButton) findViewById(R.id.AllowNotifications);


Notifications.setOnClickListener(new View.OnClickListener(){
    @Override
    public void onClick(View v) {

        AlertDialog.Builder builder = new AlertDialog.Builder(Notifications.this);

        builder.setCancelable(false); //False= ONLY way to exist notification is by clicking NO
        //True= Exit notification by clicking anywhere on screen outside of notification box.

        builder.setTitle("Here is the alert dialog");
        builder.setMessage("Here is my message thing");

        builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int WhichButton) {
                dialog.cancel();
            }
        });


        builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {

            }
        });

        builder.show();

                }
           });
 }
}

Here's the default pop up notification with the above code:

So instead of there being an "ok" and "cancel" in red color, I want to put the "ok" and "cancel" as my own custom image buttons and I'd want to change the color from red to something else. How do I go about doing this inside the Pop Up notification?

Endy Silveira · Answer 1 · 2017-09-20T12:43:46.660

As the documentation says, in the Creating a Custom Layout session, you can create a custom layout and inflate it at your Dialog.

To use another button than the one create by the AlertDialog.Builder you will need to handle the click listener of them.

This is the layout I created to test the solution:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:background="@android:color/white"
    android:orientation="vertical"
    android:padding="20dp">

    <TextView
        android:id="@+id/dialogTitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Here is the alert dialog"
        android:textColor="@android:color/black"
        android:textSize="16sp"
        android:textStyle="bold"/>

    <TextView
        android:id="@+id/dialogSubtitle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Here is my message thing"/>

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp">

        <Button
            android:id="@+id/positiveButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:background="@android:color/transparent"
            android:text="OK"
            android:textColor="@android:color/holo_red_light"/>

        <Button
            android:id="@+id/negativeButton"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="40dp"
            android:layout_toStartOf="@id/positiveButton"
            android:background="@android:color/transparent"
            android:text="Cancel"
            android:textColor="@android:color/holo_red_light"/>

    </RelativeLayout>

</LinearLayout>

And the code to make it run:

LayoutInflater layoutInflater = LayoutInflater.from(this);
        View promptView = layoutInflater.inflate(R.layout.test, null);

        final AlertDialog alertD = new AlertDialog.Builder(this).create();

        TextView title = (TextView) promptView.findViewById(R.id.dialogTitle);
        TextView subtitle = (TextView) promptView.findViewById(R.id.dialogSubtitle);

        title.setText("My new Custom Dialog");
        subtitle.setText("With everything that I want");

        Button positive = (Button) promptView.findViewById(R.id.positiveButton);
        Button negativeButton = (Button) promptView.findViewById(R.id.negativeButton);

        positive.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                // btnAdd1 has been clicked
            }
        });

        negativeButton.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                // btnAdd2 has been clicked
            }
        });

        alertD.setView(promptView);
        alertD.show();

This is an screenshot of how it looks like in my phone. Feel free to change the layout in the way it better fits your needs.

Example of Dialog

Thanks to Vikram that explains it very well in this answers for other question, but I thought that a specific code for your question would be better.

snowb1shop · Answer 2 · 2017-09-20T07:14:08.837

If you want to customize everything, the look of the dialog, add your own buttons, TextViews etc. - you need to make a class that extends DialogFragment and implements View.OnClickListener and you need to create your own layout with two custom made buttons for that. Give them ids and set OnClickListeners

As typed in: https://developer.android.com/reference/android/app/DialogFragment.html

public static class MyDialogFragment extends DialogFragment implements View.OnClickListener {
    static MyDialogFragment newInstance() {
        return new MyDialogFragment();
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.dialog_fragment, container, false);
        v.findViewById(R.id.btn_ok).setOnClickListener(this);
        return v;
    }

    @Override
    public void onClick(View view) {
        switch (view.getId()) {
            case R.id.btn_ok:
                // do something
                break;
            default:
                break;
        }
    }
}

And from your Activity you do:

void showDialog() {
    // Create the fragment and show it as a dialog.
    DialogFragment newFragment = MyDialogFragment.newInstance();
    newFragment.show(getFragmentManager(), "dialog");
}

How to customize pop up notifications?

2 Answers2