Create First Xamarin Android Application using Visual Studio 2017

In my previous articles, we discuss what Xamarin is and how to install Xamarin with Visual Studio 2017. Today we are going to create our first Xamarin Android application by using Visual Studio.

Open Microsoft Visual Studio 2017 => Create New Project and select Android from Templates section and select Blank App (Android) as shown below, name the project as “FirstAndroidApp”.

It creates an Android application with several folders. Let’s discuss each folder.

Components: This is folder is to add components from Xamarin Components store.

Assets: This folder contains files with a build action of AndroidAsset and can include raw files to be bundled with an Android application.

Resources: This folder can contain strings, images, layouts, and so on that can be loaded via Android resource system. Each file will have an ID in Resource.designer.cs that can be used to load the file.

Resources/drawable: This can contain images which are used in the application.

Resources/layout: This folder contains Android XML files (*.axml) files which are used to create UIs.

Resources/values: This folder can contain XML files to declare key-value pairs for strings.

Properties/AndroidManifest.xml: This file contains declarations about applications such as application name, ID, and permissions.

MainActivity.cs: This class is the first activity of your application, and it contains onCreate() method where we can get the view.

Now in the application, open Resources/layout/Main.axml file and add a button and TextView controls. Change button text to Click Me as shown below.

Main.axml:

 <?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">

    <TextView

        android:text="Small Text"

        android:textAppearance="?android:attr/textAppearanceSmall"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:id="@+id/textView1" />

 

    <Button

        android:text="Click Me"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:id="@+id/button1" />

</LinearLayout>

Now change the MainActivity.cs class code as shown below.

MainActivity.cs:

using Android.App;

using Android.Widget;

using Android.OS; 

namespace FirstAndroidApp

{

    [Activity(Label = "FirstAndroidApp", MainLauncher = true, Icon = "@drawable/icon")]

    public class MainActivity : Activity

    {

        protected override void OnCreate(Bundle bundle)

        {

            base.OnCreate(bundle); 

            // Set our view from the "main" layout resource

            SetContentView(Resource.Layout.Main); 

            Button btn = FindViewById<Button>(Resource.Id.button1);

            TextView tv = FindViewById<TextView>(Resource.Id.textView1); 

            btn.Click += delegate { tv.Text = "This is simple Android application";};

        }

    }

}

As shown in the code, we are getting Main.axml control references by using FindViewById and assign the button click event with the help of delegate. Select “Android 4.4 – API 19” source from the Emulator list as shown below.

Now run the application, and it displays the output as below.

                           

Now scroll up to unlock the screen and click on the main button to displays Android apps (same as how we do on any Android mobile). It displays our application FirstAndroidApp as shown below.

                            

Open FirstAndroidApp and it displays our application as shown below.

                            

Click on “Click Me” button and changes the textview text as “This is simple Android application”.