Toolbar - Xamarin

The Toolbar is an action bar component that provides more flexibility than the default action bar. Toolbar is a significant part of any Android UI. A user expects it to be there and be useful.It can be placed anywhere in the app, its size can be changed, and it can use a color scheme that is different from the app's theme. Also, each app screen can have multiple Toolbars. While we’re not gonna discuss how to make it useful, you’re at least going to learn how to make it a part of your app’s UI in this tutorial.

learn how to create a simple plain toolbar using an AppCompat support library. Then you will find out how to create a toolbar menu.

Video cam be found at https://youtu.be/wO4zLjfKYvw

Styles.xml

<?xml version="1.0" encoding="utf-8" ?>
<resources>
  <style name="AppTheme" parent="Theme.AppCompat">
    <item name="windowNoTitle">true</item>
    <item name="windowActionBar">false</item>
    <item name="colorPrimary">#4CAF50</item>
  </style>
</resources>

Main.axml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <android.support.v7.widget.Toolbar
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:minHeight="?attr/actionBarSize"
      android:background="?attr/colorPrimary"
      android:elevation="4dp"
      android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
</LinearLayout>

 MainActivity.cs

using Android.App;
using Android.OS;
using Android.Support.V7.App;
using Android.Support.V7.Widget;
using Android.Views;

namespace XamarinTut
{
    [Activity(Label = "XamarinTut", MainLauncher = true, Icon = "@drawable/icon")]
    public class MainActivity : AppCompatActivity
    {
        protected override void OnCreate(Bundle bundle)
        {
            base.OnCreate(bundle);

            // Set our view from the "main" layout resource
            SetContentView (Resource.Layout.Main);

            var toolbar = FindViewById<Toolbar>(Resource.Id.toolbar);
            SetSupportActionBar(toolbar);
            SupportActionBar.Title = "Tutorial Toolbar";
        }

        public override bool OnCreateOptionsMenu(IMenu menu)
        {
            MenuInflater.Inflate(Resource.Menu.toolbar_menu, menu);
            return base.OnCreateOptionsMenu(menu);
        }

        public override bool OnOptionsItemSelected(IMenuItem item)
        {
            string textToShow;

            if (item.ItemId == Resource.Id.menu_info)
                textToShow = "Learn more about us on our website :)";
            else
                textToShow = "Overfloooow";

            Android.Widget.Toast.MakeText(this, item.TitleFormatted + ": " + textToShow,
                Android.Widget.ToastLength.Long).Show();

            return base.OnOptionsItemSelected(item);
        }
    }
}

Note:-   Material design icons: https://material.io/icons/

 ToolBar_menu.axml

<?xml version="1.0" encoding="utf-8" ?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
  <item
    android:id="@+id/menu_info"
    android:icon="@drawable/ic_info_outline_white_24dp"
    app:showAsAction="ifRoom"
    android:title="Info"/>
  <item
    android:id="@+id/menu_overflow"
    app:showAsAction="never"
    android:title="Overflow"/>
</menu>

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="XamarinTut.XamarinTut" android:versionCode="1" android:versionName="1.0">
  <uses-sdk android:minSdkVersion="16" />
  <application android:label="XamarinTut" android:theme="@style/AppTheme"></application>
</manifest>