Friday, December 4, 2020

How to create a custom AlertDialog in Android

How to create a custom AlertDialog in Android

AlertDialog A dialog that can show a title, up to three buttons, a list of selectable items, or a custom layout.

How to create a custom AlertDialog in Android

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(); 

    } 

Screen output:

No comments:

Post a Comment