{"id":2378,"date":"2017-03-21T06:18:08","date_gmt":"2017-03-21T06:18:08","guid":{"rendered":"http:\/\/abhiandroid.com\/ui\/?p=2378"},"modified":"2018-06-05T07:47:46","modified_gmt":"2018-06-05T07:47:46","slug":"custom-alert-dialog-example-android-studio","status":"publish","type":"post","link":"https:\/\/abhiandroid.com\/ui\/custom-alert-dialog-example-android-studio.html","title":{"rendered":"Custom Alert Dialog With Example In Android Studio"},"content":{"rendered":"

The custom dialog uses DIALOG to create custom alert in android studio. Dialog display a small window i.e a popup which draws the user attention over the activity before they continue moving forward. The dialog appears \u00a0over the current window and display the content defined in it.
\n\"Custom
\nAlertDialog Vs Custom AlertDialog:<\/strong><\/span><\/p>\n

The Alert Dialog<\/a> and Custom Alert Dialog both prompts a small window to make decision. The AlertDialog make use of the defined components or methods like setIcon, setTitle, setmessage etc\u00a0but with Custom AlertDialog we can have the dialog customised and can define the layout of dialog as required. You can read more about it in alert dialog tutorial<\/a>.<\/p>\n

\"Alert<\/p>\n

\n

Custom Alert Dialog Example In Android Studio:<\/strong><\/h4>\n

Below is the example of Custom Alert Dialog in which the functionality of Alert Dialog is defined over button click. In this example we have used a simple button and over that button click the alert dialog window will appear.<\/p>\n

Below you can download code, see final output and step by step explanation of Custom Alert Dialog example in Android Studio.<\/p>\n

Download Code (Password: abhiandroid)<\/a><\/p>\n

\"Custom
\nStep 1:<\/strong><\/span> Create a new project and name it CustomAlertDialog<\/strong>.<\/p>\n

Step 2:<\/strong><\/span> Open res -> layout -> activity_main.xml (or) main.xml<\/span> and add following code:<\/p>\n

Here we create XML for button and textview. On button click custom alert dialog will appear & textview is for asking user to click on button.<\/p>\n

<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:id=\"@+id\/activity_main\"\r\n    android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\"\r\n    android:paddingBottom=\"@dimen\/activity_vertical_margin\"\r\n    android:paddingLeft=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingRight=\"@dimen\/activity_horizontal_margin\"\r\n    android:paddingTop=\"@dimen\/activity_vertical_margin\"\r\n    tools:context=\"com.example.customalertdialog.MainActivity\">\r\n\r\n    <Button\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:id=\"@+id\/buttonShowCustomDialog\"\r\n        android:onClick=\"exit\"\r\n        android:textStyle=\"normal|bold\"\r\n        style=\"@android:style\/Widget.DeviceDefault.Button.Inset\"\r\n        android:layout_alignParentBottom=\"true\"\r\n        android:layout_centerHorizontal=\"true\"\r\n        android:layout_marginBottom=\"131dp\"\r\n        android:text=\"@string\/click\"\/>\r\n\r\n    <TextView\r\n        android:text=\"CLICK TO VIEW CUSTOM ALERT DIALOG\"\r\n        android:layout_width=\"match_parent\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:layout_above=\"@+id\/buttonShowCustomDialog\"\r\n        android:layout_centerHorizontal=\"true\"\r\n        android:layout_marginBottom=\"86dp\"\r\n        android:id=\"@+id\/textView\"\r\n        android:gravity=\"center\"\r\n        android:textStyle=\"normal|bold\"\r\n        android:textSize=\"18sp\"\r\n        tools:ignore=\"HardcodedText\" \/>\r\n<\/RelativeLayout>\r\n<\/pre>\n
Step 3 :<\/strong><\/span> Now create a layout file name as custom.xml .
\nIn this file we are going to define the XML for custom dialog appearance. A textbox , imageview and \u00a0a button.<\/p>\n
<?xml version=\"1.0\" encoding=\"utf-8\"?>\r\n<RelativeLayout xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"\r\n    xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"\r\n    xmlns:tools=\"http:\/\/schemas.android.com\/tools\"\r\n    android:orientation=\"vertical\" android:layout_width=\"match_parent\"\r\n    android:layout_height=\"match_parent\">\r\n\r\n    <TextView\r\n        android:text=\"@string\/alert\"\r\n        android:layout_width=\"wrap_content\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:id=\"@+id\/text\"\r\n        android:textStyle=\"normal|bold\"\r\n        android:textSize=\"18sp\"\r\n        android:layout_alignParentTop=\"true\"\r\n        android:layout_toRightOf=\"@+id\/image\"\r\n        android:layout_toEndOf=\"@+id\/image\"\r\n        android:layout_marginLeft=\"21dp\"\r\n        android:layout_marginStart=\"21dp\"\r\n        android:layout_marginTop=\"12dp\" \/>\r\n\r\n    <ImageButton\r\n        android:layout_width=\"35dp\"\r\n        android:layout_height=\"35dp\"\r\n        app:srcCompat=\"@drawable\/stop\"\r\n        android:id=\"@+id\/image\"\r\n        android:layout_alignParentLeft=\"true\"\r\n        android:layout_alignParentStart=\"true\"\r\n        android:layout_marginLeft=\"5dp\"\r\n        android:layout_marginTop=\"5dp\"\r\n        tools:ignore=\"ContentDescription,RtlHardcoded\" \/>\r\n\r\n    <Button\r\n        android:id=\"@+id\/dialogButtonOK\"\r\n        android:layout_width=\"200dp\"\r\n        android:layout_height=\"wrap_content\"\r\n        android:text=\"@string\/dismiss\"\r\n        android:layout_marginTop=\"23dp\"\r\n        android:paddingRight=\"5dp\"\r\n        android:layout_below=\"@+id\/image\"\r\n        android:layout_alignLeft=\"@+id\/image\"\r\n        android:layout_alignStart=\"@+id\/image\"\r\n        android:textSize=\"18sp\"\r\n        style=\"@style\/Widget.AppCompat.Button.Colored\"\r\n        tools:ignore=\"RtlHardcoded,RtlSymmetry\" \/>\r\n\r\n<\/RelativeLayout>\r\n<\/pre>\n
Step 4 :<\/strong><\/span> Now open app -> java -> package -> MainActivity.java<\/span> and add the below code.<\/p>\n
In this code onclick is added over the button click and Dialog is used to create the custom alert dialog.<\/p>\n
package com.example.customalertdialog;\r\n\r\nimport android.app.Dialog;\r\nimport android.content.Context;\r\nimport android.support.v7.app.AppCompatActivity;\r\nimport android.os.Bundle;\r\nimport android.view.View;\r\nimport android.widget.Button;\r\nimport android.widget.ImageView;\r\nimport android.widget.TextView;\r\n\r\npublic class MainActivity extends AppCompatActivity {\r\n    final Context context = this;\r\n    private Button button;\r\n\r\n    public void onCreate(Bundle savedInstanceState) {\r\n        super.onCreate(savedInstanceState);\r\n        setContentView(R.layout.activity_main);\r\n        button = (Button) findViewById(R.id.buttonShowCustomDialog);\r\n        \/\/ add button listener\r\n        button.setOnClickListener(new View.OnClickListener() {\r\n            @Override\r\n            public void onClick(View arg0) {\r\n                \/\/ custom dialog\r\n                final Dialog dialog = new Dialog(context);\r\n                dialog.setContentView(R.layout.custom);\r\n                Button dialogButton = (Button) dialog.findViewById(R.id.dialogButtonOK);\r\n                \/\/ if button is clicked, close the custom dialog\r\n                dialogButton.setOnClickListener(new View.OnClickListener() {\r\n                    @Override\r\n                    public void onClick(View v) {\r\n                        dialog.dismiss();\r\n                        Toast.makeText(getApplicationContext(),\"Dismissed..!!\",Toast.LENGTH_SHORT).show();\r\n                    }\r\n                });\r\n                dialog.show();\r\n            }\r\n        });\r\n    }\r\n}<\/pre>\n
Output:<\/strong><\/p>\n
Now run the App and when you will click on the button. The custom alert dialog will appear on the screen.<\/p>\n","protected":false},"excerpt":{"rendered":"
The custom dialog uses DIALOG to create custom alert in android studio. Dialog display a small window i.e a popup which draws the user attention over the activity before they continue moving forward. The dialog appears \u00a0over the current window and display the content defined in it. AlertDialog Vs Custom AlertDialog: The Alert Dialog and … Continue reading Custom Alert Dialog With Example In Android Studio<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2378","post","type-post","status-publish","format-standard","hentry","category-archieve"],"acf":[],"psp_head":"Custom Alert Dialog With Example In Android Studio \u2013 Abhi Android<\/title>\r\n<meta name=\"description\" content=\"The custom dialog uses DIALOG to create custom alert in android studio. Learn it following our step by step using example in Android Studio.\" \/>\r\n<meta name=\"robots\" content=\"index,follow\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/abhiandroid.com\/ui\/custom-alert-dialog-example-android-studio.html\" \/>\r\n","_links":{"self":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/2378","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/comments?post=2378"}],"version-history":[{"count":2,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/2378\/revisions"}],"predecessor-version":[{"id":2696,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/posts\/2378\/revisions\/2696"}],"wp:attachment":[{"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/media?parent=2378"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/categories?post=2378"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/abhiandroid.com\/ui\/wp-json\/wp\/v2\/tags?post=2378"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}