Post
Ask Question

Getting Started With First Android Wearable App Using Xamarin

Introduction

We all knew Xamarin and Visual Studio are great. You are no longer restricted to developing only for phone and tablet. Now, you can develop Android wearable apps, using Xamarin. Android wear was officially released by Google in 2014.

In this article, I will show how to setup and create an Android wearable app, using Xamarin.


System Requirements

  • Mac / Windows 7++ Machine with 8 GB RAM.
  • Xamarin Studio 5.0 or new version/ Visual Studio 2012 or new version.
  • Visual Studio required professional or higher version because Xamarin extension for Visual Studio will only be supported for non-express editions. Download Visual Studio from here ( https://www.xamarin.com/visual-studio).

Install Android SDK & Tools

You can open Visual Studio in Windows machine. Open Visual Studio (Run => type “Devenev.exe”).


You can verify all the required SDKs, which were installed in Visual Studio. If you do not have the latest SDK and tools installed, download the required SDK tools and API. Go to Tools menu =>Android =>Android SDK manager. Android SDK manager Window will visible in your system, as shown below.


Create Android wear emulator

In order to run the Android wear Application we need to first setup an emulator. You can create one by following the steps given below. Go to Tools in Visual Studio > Andriod > Andriod Emulator Manager, as shown below.


In the screen given below, you will get to know the already created emulator. If you want to create a new emulator, click on “Create “button


After clicking on create button and providing the information as AVD name, Device Name, chose correct Target platform, click Create.


If you get any error "No CPU /ABI system image available for this target”, it means target SDK is not installed. You can choose different target or install specific target SDK. When creating the device, make sure that the correct target of the OS is selected, but especially that the CPU is Android wear ARM. After creating an emulator, you will receive the message for the confirmation


After clicking OK, you will get the screen given below for list of emulators.


Create New Project

You can follow the steps given below to create your first Android Wear app and run it on a Wear emulator. File => New => Project. You can select the project as Android and select the template as Wear app. Now, automatically project and wear reference will be added .


See the screen given below for the project structure and the reference.


In the Solution, include Xamarin Android wearable reference and icon for tile image, 3 layout for rectangle, round watch and phone layout with common MainActivity class.

Round / Rectangle Main.axml

I have included sample reference axaml code. You can modify, as per your requirement.

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     xmlns:tools="http://schemas.android.com/tools"  
  4.     android:orientation="vertical"  
  5.     android:layout_width="match_parent"  
  6.     android:layout_height="match_parent"  
  7.     tools:context=".MainActivity"  
  8.     tools:deviceIds="wear_round">  
  9.     <Button  
  10.         android:id="@+id/msdnbutton"  
  11.         android:layout_width="match_parent"  
  12.         android:layout_height="wrap_content"  
  13.         android:text="@string/msdn" />  
  14.     <Button  
  15.         android:id="@+id/csharpbutton"  
  16.         android:layout_width="match_parent"  
  17.         android:layout_height="wrap_content"  
  18.         android:text="@string/csharp" />  
  19.     <Button  
  20.         android:id="@+id/bloggerbutton"  
  21.         android:layout_width="match_parent"  
  22.         android:layout_height="wrap_content"  
  23.         android:text="@string/blogger" />  
  24. </LinearLayout>  

MainActivity.CS

In MainActivity class, create onbutton click and show the notification.

  1. using System;  
  2. using Android.App;  
  3. using Android.Content;  
  4. using Android.Runtime;  
  5. using Android.Views;  
  6. using Android.Widget;  
  7. using Android.OS;  
  8. using Android.Support.Wearable.Views;  
  9. using Android.Support.V4.App;  
  10. using Android.Support.V4.View;  
  11. using Java.Interop;  
  12. using Android.Views.Animations;  
  13.   
  14. namespace DevEnvWear  
  15. {  
  16.     [Activity(Label = "DevEnvWear", MainLauncher = true, Icon = "@drawable/icon")]  
  17.     public class MainActivity : Activity  
  18.     {  
  19.         int count = 1;  
  20.   
  21.         protected override void OnCreate(Bundle bundle)  
  22.         {  
  23.             base.OnCreate(bundle);  
  24.   
  25.             // Set our view from the "main" layout resource  
  26.             SetContentView(Resource.Layout.Main);  
  27.              
  28.             var v = FindViewById<WatchViewStub>(Resource.Id.watch_view_stub);  
  29.             v.LayoutInflated += delegate  
  30.             {  
  31.   
  32.                 // Get our button from the layout resource,  
  33.                 // and attach an event to it  
  34.                 Button buttonmsdn = FindViewById<Button>(Resource.Id.msdnbutton);  
  35.                 Button buttoncsharp = FindViewById<Button>(Resource.Id.csharpbutton);  
  36.                 Button buttonblog = FindViewById<Button>(Resource.Id.bloggerbutton);  
  37.   
  38.                 buttonmsdn.Click += delegate  
  39.                 {  
  40.                     var notification = new NotificationCompat.Builder(this)  
  41.                       .SetContentTitle("MSDN")  
  42.                         .SetContentText("https://social.msdn.microsoft.com/profile/j%20suthahar/")  
  43.                         .SetSmallIcon(Android.Resource.Drawable.StatNotifyVoicemail)  
  44.                         .SetGroup("group_key_demo").Build();  
  45.   
  46.                     var manager = NotificationManagerCompat.From(this);  
  47.                     manager.Notify(1, notification);  
  48.                     
  49.                       
  50.                 };  
  51.                 buttoncsharp.Click += delegate  
  52.                 {  
  53.                     var notification = new NotificationCompat.Builder(this)  
  54.                       .SetContentTitle("C# Corner")  
  55.                         .SetContentText("http://www.c-sharpcorner.com/members/suthahar-j")  
  56.                         .SetSmallIcon(Android.Resource.Drawable.StatNotifyVoicemail)  
  57.                         .SetGroup("group_key_demo").Build();  
  58.   
  59.                     var manager = NotificationManagerCompat.From(this);  
  60.                     manager.Notify(1, notification);  
  61.   
  62.   
  63.                 };  
  64.                 buttonblog.Click += delegate  
  65.                 {  
  66.                     var notification = new NotificationCompat.Builder(this)  
  67.                       .SetContentTitle("My Blog")  
  68.                         .SetContentText("www.devenvexe.com")  
  69.                         .SetSmallIcon(Android.Resource.Drawable.StatNotifyVoicemail)  
  70.                         .SetGroup("group_key_demo").Build();  
  71.   
  72.                     var manager = NotificationManagerCompat.From(this);  
  73.                     manager.Notify(1, notification);  
  74.   
  75.   
  76.                 };  
  77.             };  
  78.         }  
  79.     }  
  80. }  

Output Screen

You can refer to the screen given below for an output. Click on tile => click on any button => swipe to home and see the notification.


Similar Articles