Friday, January 15, 2021

How to create a custom AlertDialog in Android

How to create a custom AlertDialog in Android

Sometimes in AlertDialog, there is need to get input from the user or customize according to our requirements. So we create custom AlertDialogs. This post will show how to customize the AlertDialogs and take the input from it.

Step 1: Create a XML file: custom_layout.xml. Add the below code in custom_layout.xml. This code defines the alertdialog box dimensions and add a edittext in it.

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout 

  xmlns:android="http://schemas.android.com/apk/res/android" 

  android:orientation="vertical" 

  android:paddingLeft="20dp" 

  android:paddingRight="20dp" 

  android:layout_width="match_parent" 

  android:layout_height="match_parent"> 

  

  <EditText 

    android:id="@+id/editText" 

    android:layout_width="match_parent" 

    android:layout_height="wrap_content"/> 

</LinearLayout> 

Step 2: Add a button in activity_main.xml. The button when clicked will show the AlertDialog box.

<?xml version="1.0" encoding="utf-8"?> 

<LinearLayout

    xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:gravity="center"

    android:id="@+id/root"

    android:orientation="vertical"

    tools:context=".MainActivity"> 

  

    <Button

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:onClick="showAlertDialogButtonClicked"

        android:text="Show Dialog"

     /> 

</LinearLayout> 

Step 3:

Add custom_layout.xml in that activity in which you want to show custom alert dialog here it is added in MainActivity.java.

public class MainActivity 

    extends AppCompatActivity { 

  

    @Override

    protected void onCreate( 

        Bundle savedInstanceState) 

    { 

        super.onCreate(savedInstanceState); 

        setContentView(R.layout.activity_main); 

    } 

  

    public void showAlertDialogButtonClicked(View view) 

    { 

  

        // Create an alert builder 

        AlertDialog.Builder builder 

            = new AlertDialog.Builder(this); 

        builder.setTitle("Name"); 

  

        // set the custom layout 

        final View customLayout 

            = getLayoutInflater() 

                  .inflate( 

                      R.layout.custom_layout, 

                      null); 

        builder.setView(customLayout); 

  

        // add a button 

        builder 

            .setPositiveButton( 

                "OK", 

                new DialogInterface.OnClickListener() { 

  

                    @Override

                    public void onClick( 

                        DialogInterface dialog, 

                        int which) 

                    { 

  

                        // send data from the 

                        // AlertDialog to the Activity 

                        EditText editText 

                            = customLayout 

                                  .findViewById( 

                                      R.id.editText); 

                        sendDialogDataToActivity( 

                            editText 

                                .getText() 

                                .toString()); 

                    } 

                }); 

  

        // create and show 

        // the alert dialog 

        AlertDialog dialog 

            = builder.create(); 

        dialog.show(); 

    } 

  

    // Do something with the data 

    // coming from the AlertDialog 

    private void sendDialogDataToActivity(String data) 

    { 

        Toast.makeText(this, 

                       data, 

                       Toast.LENGTH_SHORT) 

            .show(); 

    } 

}

Output:

How to create a custom AlertDialog in Android

No comments:

Post a Comment