How to load external custom XML layout file inside alert dialog as its screen view.
Alert dialog can also support external custom layout files that means if you have design some custom layout using xml that can be easily load as alert dialog screen and while loading custom layout it will open the whole selected layout as alert dialog screen . So here is the complete step by step tutorial for Create AlertDialog with custom xml View/Layout file in android.
Create AlertDialog with custom xml View/Layout file in android.
Code for MainActivity.java file.
package com.alertdialogwithcustomxml_android_examples.com; import android.app.Activity; import android.app.AlertDialog; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.widget.Button; import android.widget.Toast; public class MainActivity extends Activity { Button button; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); button = (Button)findViewById(R.id.buttonMain); button.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this); LayoutInflater inflater = getLayoutInflater(); View dialogView = inflater.inflate(R.layout.custom_layout,null); builder.setView(dialogView); Button one = (Button) dialogView.findViewById(R.id.button1); Button two = (Button) dialogView.findViewById(R.id.button2); Button three = (Button) dialogView.findViewById(R.id.button3); final AlertDialog dialog = builder.create(); one.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub Toast.makeText(MainActivity.this, "Button 1 Selected", Toast.LENGTH_LONG).show(); } }); two.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub Toast.makeText(MainActivity.this, "Button 2 Selected", Toast.LENGTH_LONG).show(); } }); three.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub Toast.makeText(MainActivity.this, "Button 3 Selected", Toast.LENGTH_LONG).show(); } }); // Display the custom alert dialog on interface dialog.show(); } }); } }
Code for activity_main.xml layout file.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.alertdialogwithcustomxml_android_examples.com.MainActivity" > <Button android:id="@+id/buttonMain" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:text="Click here to open AlertDialog with custom xml View/Layout file" /> </RelativeLayout>
Code for custom_layout.xml file.
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="250dp" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:text="AlertDialog Title" android:textAppearance="?android:attr/textAppearanceLarge" android:layout_marginTop="20dp" android:layout_marginBottom="20dp"/> <Button android:id="@+id/button3" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBaseline="@+id/button2" android:layout_alignBottom="@+id/button2" android:layout_alignParentRight="true" android:text="Button-3" /> <Button android:id="@+id/button2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignBaseline="@+id/button1" android:layout_alignBottom="@+id/button1" android:layout_centerHorizontal="true" android:text="Button-2" /> <View android:id="@+id/view1" android:layout_width="fill_parent" android:layout_height="2dp" android:layout_alignParentLeft="true" android:layout_below="@+id/textView1" android:background="#03bd70" /> <Button android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentLeft="true" android:layout_below="@+id/view1" android:layout_marginTop="78dp" android:text="Button-1" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/view1" android:layout_centerHorizontal="true" android:layout_marginTop="26dp" android:text="Please select Any Button" android:textAppearance="?android:attr/textAppearanceLarge" /> </RelativeLayout>
Screenshot: