Navigate From One Activity To Another Activity In Xamarin Android Application

Xamarin, Mobile App Development

5.00 ( 2 votes) | 1172

In this article, we will talk about how to navigate from one activity to another activity in Xamarin Android application.

Introduction:

Real world android applications consist of many activities. Consider an example of Gmail android application. When user opens up the application on their android device, first screen display all the emails in a list and when user tap on any email, then it navigate to another screen to display the content of that email.

In previous post, we learned how to create a simple hello world Xamarin android application in visual studio 2015 using C#. Now in this article, we will learn how to navigate from one activity to another activity on an event like button click. So let`s get started.

Steps:

  • To get started, open visual studio 2015, go to File => New => Project (Ctrl+Shift+N) option. It will open up a project dialog window. Select Visual C# template from left tree menu. Under Visual C#, select Android template option as shown below (F: 1)

Create Navigation Xamarin Android App

Note: To know more about the structure of Xamarin Android application. Click here.

  • Select Blank App (Android) project template. Give it a project a name called NavigationApp and click on Ok button. After clicking on Ok button, visual studio will create a blank Xamarin android project.
  • Now let`s open up Main.axml file from Resources => drawable=> layout folder. When we open the Main.axml file in Visual Studio, it will open up in visual editor called as Android Designer.
  • Open the Toolbox window using Ctrl+Alt+X shortcut key and drag and drop a button control from the Toolbox window on the android designer surface. Now let`s go to source view of Main.axml file to set the properties for our button control.
  • Content of Main.axml source view is (F: 2):

Navigation App Main.axml Source View Content

  • Set the button text to "Navigate to other screen" using android:text property. Also let`s change the id of the button from button1 to btnNavigate using android:id property. We will use this id in MainActivity.cs file to access this button and assign click event to this button control.
  • Updated content of Main.axml file is (F: 3):

Navigation App Main.axml Updated Content

  • Now let`s add another layout (.axml) file, which will represent our second screen in our application. To add .axml file, right click on layout folder select Add => New Item option as shown below (F: 4)

Navigation App - Add Another .axml File

  • It will open up a dialog box. Under Visual C#, select Android template from the left tree menu. It will display all the item templates that we can add to our android project. Select Android Layout item template and give it a name Second.axml and click on Ok button (F: 5).

Navigation App Second Screen

  • Open Second.axml file and drag and drop a Text (Large) control from Toolbox to designer surface. Now open the Source view for Second.axml file and set android:text property to Next Screen and android:gravity  property to center which will align our control to center of the screen horizontally.
  • Updated content of Second.axml file is (F: 6):Navigation App Second Screen Source View Updated Content
  • Now the next step is to add an activity for our second screen. To add an activity, right click on project and select Add => New Item option or use shortcut Ctrl+Shift+A. It will open up a same dialog box as shown in image (F: 5). Select Activity item template and give it a name as SecondActivity.cs and click on Ok button.
  • Now we need to tie our Second.axml designer file with SecondActivity.cs file. To do that, let`s open up SecondActivity.cs file. Content of SecondActivity.cs file is as shown below.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Views;
using Android.Widget;

namespace NavigationApp
{
    [Activity(Label = "SecondActivity")]
    public class SecondActivity : Activity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);

            // Create your application here
           

        }
    }
}
  • Update the code of SecondActivity.cs file with following code. 
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using Android.App;
using Android.Content;
using Android.OS;
using Android.Runtime;
using Android.Views;
using Android.Widget;

namespace NavigationApp
{
    [Activity(Label = "SecondActivity")]
    public class SecondActivity : Activity
    {
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);

            // Create your application here
            SetContentView(Resource.Layout.Second);

        }
    }
}
  • SetContentView(Resource.Layout.Second) statement in above code will tie up our Second.axml (designer) with SecondActivity.cs (code behind) file.
  • Now let`s move on to the next part which is when a user click on a button of our first activity, then it should navigate to second activity. To do that, let`s open up MainActivity.cs file.
  • Update the code of MainActivity.cs with following code (F: 7).

Navigation App Main Activity Updated Content

  • Now let`s go through the code:
    • Using SetContentView method we attach our Main.axml designer file with MainActivity.cs file.
    • Using the FindViewById method, we can get a reference to a button which we have added in our Main.axml file. Note that we are passing the id of the button to FindViewById method using resource class.
    • At line number 18 in above image, we are assigning click event handler for the button. So whenever the button is clicked BtnNavigate_Click method will be called.
    • BtnNavigate_Click method contains a simple method of base class Activity called StartActivity. The typeof(SecondActivity) parameter specifies that we want to navigate to SecondActivity.cs.
  • Now let`s run the application using Ctrl+F5 shortcut key. Output of our android application is as shown below (F: 8)

Navigation App - Output of Applicaation

  • Greate. We are able to successfully navigate from one activity to another activity in Xamarin Android application.

Source Code for above sample application is availabe on github.

Conclusion:

In this article, we learned how to navigate from one activity to another activity in Xamarin Android application. I hope you enjoyed reading the article.

Happy Coding !

Manoj Kulkarni - Dotnetcontext

Manoj Kulkarni

I am programmer, passionate blogger and foodie. I live in Nashik. I am a .Net developer. I like to learn new technologies to keep my self-updated and share that knowledge with my blog readers, friends and colleague.

4 Comments


Tushar - Dotnetcontext

TusharTuesday, October 4, 2016 3:30 AM

Nice Post !!!

Manoj Kulkarni - Dotnetcontext

Manoj KulkarniTuesday, October 4, 2016 3:31 AM

Thank you for the feedback Tushar.

Sandip Pawar - Dotnetcontext

Sandip PawarTuesday, October 4, 2016 4:01 AM

Nice Articles and Its helps me a lot.

Manoj Kulkarni - Dotnetcontext

Manoj KulkarniTuesday, October 4, 2016 4:02 AM

Thank you for the feedback Sandip

Add a new comment