Xamarin page navigation - xamarin

Question

How do i make a page slide into the Content section when i choose the menu options ?
Currently when i select a menu option it opens a brand new page on top of my main page(page on the right).
I want it to work like html IFrame. So i want the page to load without refreshing the Menu toolbar on the right page - and of course the menu must disappear when the new page slide in.
Here is the code i use to call my another page from the menu option :
C#
[Activity(Label = "FlyInMenu", MainLauncher = true, Theme = "#android:style/Theme.Holo.Light.NoActionBar")]
public class Activity1 : Activity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
//for calling the menu opiton
var menu = FindViewById<FlyOutContainer>(Resource.Id.FlyOutContainer);
var menuButton = FindViewById(Resource.Id.MenuButton);
menuButton.Click += (sender, e) =>
{
menu.AnimatedOpened = !menu.AnimatedOpened;
};
//redirect
var myProfileOption = FindViewById(Resource.Id.linearLayout11);
myProfileOption.Click += delegate {
var intent = new Intent(this, typeof(MyProfileActivity));
StartActivity(intent);
};
}
}
AXML
<LinearLayout
android:orientation="horizontal"
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1"
android:layout_margin="8dp"
android:duplicateParentState="true">
<ImageView
android:src="#drawable/user_icon"
android:layout_width="29.0dp"
android:layout_height="44.0dp"
android:id="#+id/imageView1"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp" />
<TextView
android:text="Option1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView2"
android:layout_gravity="center"
android:layout_marginLeft="8dp"
android:textColor="#878787"
android:textSize="18dp" />
</LinearLayout>
Another question is that how do i implement a loading page between the calls ? I.e when i click on a menu option
i would like to see a loading page an then the destination page.

Answer 1

You are looking for a NavigationView and DrawerLayout which is provided by the Android Design Support Library.
Xamarin provides bindings for this library. They also have a example on how to use this NavigationView (see section "Effective Navigation in Android")

Answer 2

I found the solution here : http://www.appliedcodelog.com/2016/01/navigation-drawer-using-material-design.html
This tutorial switch pages smoothly, without flickering or affecting the toolbar.