alert dialog android

Create Reusable Alert Dialog in Android

Why Reusable Alert Dialog in Android?

In your application, if you wanted to ask the user about taking a decision between yes or no in the response of any particular action taken by the user, by remaining in the same activity and without changing the screen, you can use Alert Dialog.

By default, In order to make an alert dialog, you need to make an object of AlertDialogBuilder which an inner class of AlertDialog. Its syntax is given below

AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(this);

But, In this example, I am going to create a custom alert dialog in a reusable manner by extending alert dialog.

Create Alert Dialog View

create an alert dialog view by extending AlertDialog. Also, Inflate your view into the alert dialog.

public class MyAlertDialog extends AlertDialog {

    protected MyAlertDialog(Context context) {
        super(context);
        initialize();
    }

    private void initialize() {
        View view = LayoutInflater.from(getContext()).inflate(R.layout.my_alert_layout,null);
        setView(view);
    }
}

my_alert_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@drawable/alert_background"
    android:layout_margin="10dp"
    android:padding="10dp"
    android:orientation="vertical">

    <ImageView
        android:id="@+id/alert_icon"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
        android:visibility="gone"
        android:background="@drawable/ic_info_black_24dp"/>

    <TextView
        android:id="@+id/tv_title"
        style="@style/TextTitleStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:visibility="gone"
        android:text="Title"/>

    <TextView
        android:id="@+id/tv_desc"
        style="@style/TextDescStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/desc"
        android:padding="10dp"
        android:gravity="center"/>

    <LinearLayout
        android:id="@+id/layout_two_button"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btn_left"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            style="@style/ButtonStyle"
            android:text="@string/cancel"
            android:background="@drawable/button_background"
            android:layout_margin="5dp"
            android:layout_weight="1"/>

        <Button
            android:id="@+id/btn_right"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            style="@style/ButtonStyle"
            android:text="@string/delete"
            android:background="@drawable/button_background"
            android:layout_margin="5dp"
            android:layout_weight="1"/>

    </LinearLayout>

        <LinearLayout
            android:id="@+id/layout_one_button"
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:gravity="center"
            android:visibility="gone"
            android:orientation="horizontal">

            <Button
                android:id="@+id/btn_middle"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:background="@drawable/button_background"
                style="@style/ButtonStyle"
                android:text="@string/ok"/>

    </LinearLayout>
</LinearLayout>

Related Post: shimmer effect For Android Recyclerview Example

Related Post: Retrofit Android Example With Recyclerview [Download]

Related Post: Android Recyclerview Material Design with Example


Implement the click listener

  1. create an interface for the click event.
    public interface DialogActionListener{
            void onAction(View viewId);
    }
    public void setOnActionListener(DialogActionListener dialogActionListener){
        this.dialogActionListener = dialogActionListener;
    }
  2. Set the click listener for the views.
    private void setClickListener(View... views){
            for (View view: views){
                view.setOnClickListener(mOnClickListener);
            }
    }
    private final View.OnClickListener mOnClickListener = new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dialogActionListener.onAction(v);
            }
    };
  3. Implement the click action in your MainActivity to get the action view.
    myAlertDialog.setOnActionListener(new MyAlertDialog.DialogActionListener() {
                        @Override
                        public void onAction(View view) {
    
                            switch (view.getId()){
                                case R.id.btn_left:
                                    Toast.makeText(getApplicationContext(),"left",Toast.LENGTH_SHORT).show();
                                    break;
                                case R.id.btn_right:
                                    Toast.makeText(getApplicationContext(),"right",Toast.LENGTH_SHORT).show();
                                    break;
                            }
             }
    });

Related Post: Android Loading Circle Animation

Related Post: Swipe card view Android with Example[Updated]

Related Post: Glide Android – Image loading framework for Android with Example [updated]


Using Alert Dialog

Here, I have developed two types of alert dialog views.

  1. Single Button view with Action.
    alert dialog
  2. Two Button views with Action.alert dialog

In this below code, To enable single button alert dialog you need to set,

myAlertDialog.setMiddleButtonText("Okay");

Or you want to enable two-button alert dialog, you need to set,

myAlertDialog.setRightButtonText(getString(R.string.delete));
myAlertDialog.setLeftButtonText(getString(R.string.cencel));

Another thing, If you don’t want to show the Title or the Title image you don’t need to set it.

MainActivity.java

public class MainActivity extends AppCompatActivity {

    private Button btnShowDialog;

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

        btnShowDialog = findViewById(R.id.btnShowDialog);

        btnShowDialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                MyAlertDialog myAlertDialog = new MyAlertDialog(MainActivity.this);
                myAlertDialog.setAlertTitle(getString(R.string.delete));
                    myAlertDialog.setAlertIcon(getResources().getDrawable(R.drawable.ic_info_black_24dp));
                myAlertDialog.setAlertDesciption(getResources().getString(R.string.desc));
                myAlertDialog.setRightButtonText(getString(R.string.delete));
                myAlertDialog.setLeftButtonText(getString(R.string.cencel));

                myAlertDialog.setOnActionListener(new MyAlertDialog.DialogActionListener() {
                    @Override
                    public void onAction(View view) {

                        switch (view.getId()){
                            case R.id.btn_left:
                                Toast.makeText(getApplicationContext(),"left",Toast.LENGTH_SHORT).show();
                                break;
                            case R.id.btn_right:
                                Toast.makeText(getApplicationContext(),"right",Toast.LENGTH_SHORT).show();
                                break;
                        }

                    }
                });
                myAlertDialog.show();
            }
        });

    }
}

style.xml

    
    

    

    

    

" data-snippet-id="ext.90c6109b5af13df40730550e0b7345a9" data-snippet-saved="false" data-codota-status="done"><resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>

    <style name="TextTitleStyle">
        <item name="android:textStyle">bold</item>
        <item name="android:textSize">20sp</item>
        <item name="android:fontFamily">monospace</item>
        <item name="android:textAllCaps">true</item>
        <item name="android:textColor">@android:color/holo_red_dark</item>
    </style>

    <style name="TextDescStyle">
        <item name="android:textSize">15sp</item>
        <item name="android:fontFamily">monospace</item>
        <item name="android:textColor">@android:color/background_dark</item>
    </style>

    <style name="ButtonStyle" parent="TextTitleStyle">
        <item name="android:textSize">15sp</item>
        <item name="android:textColor">@android:color/white</item>
    </style>

</resources>
github_link

1 thought on - Create Reusable Alert Dialog in Android

Leave a Reply

Your email address will not be published. Required fields are marked *