Xamarin.Android - User Input Dialog

Introduction

 

This article is an attempt to demystify the use of dialog box to gather user input. It is not intended to be exhaustive, rather, it is aimed at new or beginning programmers. A Dialog window is an independent subwindow meant to carry temporary notice apart from the main application window. Most Dialogs present an error message or warning to a user, but Dialogs can present images, directory trees, or just about anything compatible with the main Application that manages them.

 

Prerequisites

• Android Support Library v7 AppCompat

The steps given below are required to be followed in order to create a user input dialog in Xamarin Android, using Visual Studio. 

 

Step 1

 

Open Visual Studio and go to New Project-> Templates-> Visual C#-> Android-> Blank app. Give it a name, like UserInputDialog.

 

Step 2

 

Go to Solution Explorer-> Components -> then Right Click-> Get More Components. In this way, you can move on Xamarin Components Store, search for AppCompat, and add that to the app.

 

 

Step 3

 

Open Solution Explorer-> Project Name-> Resources-> Layout-> Right Click to Add-> New Item, select Layout from list, give it a name like user_input_dialog_box.axml, and add the following code.

The layout will have a TextView in order to display the preview of Dialog Title. I also added an EditText to input the text in the dialog.

(FileName: user_input_dialog_box.axml)

XML Code

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:id="@+id/dialogTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Dialog Title"
        android:textAppearance="?android:attr/textAppearanceLarge" />
    <EditText
        android:id="@+id/editText"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Enter Something" />
</LinearLayout>

Step 4

 

Open Solution Explorer-> Project Name-> Resources-> Layout-> Main.axml and add the following code.

 

XML Code 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:minWidth="25px"
    android:minHeight="25px">
    <Button
        android:text="Show Dialog"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btnShowDialog" />
</LinearLayout>

Step 5

 

Now, go to solution Explorer-> Project Name-> MainActivity file and add following code using the appropriate namespaces.

(FileName: MainActivity.cs)

MainActivity C# Code

using Android.App;
using Android.Widget;
using Android.OS;
using Android.Support.V7.App;
using Android.Views;
namespace User_Input_Dialog
{
    [Activity(Label = "User_Input_Dialog", MainLauncher = true, Theme ="@style/Theme.AppCompat.Light")]
    public class MainActivity : AppCompatActivity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);
            // Set our view from the "main" layout resource
            SetContentView(Resource.Layout.Main);
            Button button = FindViewById<Button>(Resource.Id.btnShowDialog);
            button.Click += delegate {
                LayoutInflater layoutInflater = LayoutInflater.From(this);
                View view = layoutInflater.Inflate(Resource.Layout.user_input_dialog_box , null);
                Android.Support.V7.App.AlertDialog.Builder alertbuilder = new Android.Support.V7.App.AlertDialog.Builder(this);
                alertbuilder.SetView(view);
                var userdata = view.FindViewById<EditText>(Resource.Id.editText);
                alertbuilder.SetCancelable(false)
                .SetPositiveButton("Submit", delegate
                {
                    Toast.MakeText(this, "Submit Input: " + userdata.Text, ToastLength.Short).Show();
                })
                .SetNegativeButton("Cancel", delegate
                {
                    alertbuilder.Dispose();
                });
                Android.Support.V7.App.AlertDialog dialog = alertbuilder.Create();
                dialog.Show();
            };
        }
    }
}

Output

After a few seconds, the app will start running on your Android Emulator. You will see that your app is working successfully.

 

Summary

This was the process of how to create a user input dialog in Xamarin Android, using Visual Studio.