How to Develop Android Wear App?

How to Develop Android Wear App?

Developing for Android Wear can be a lot of fun, but there are some things you need to know before you get started. The first thing to know is that developing for Android Wear is not difficult. Since Android is at the core, you can start developing the app just like you would for an Android smartphone. This means using Android Studio and creating a new project.

In this tutorial, we will discuss how to get started with the development for Android Wear. And, make you enough stable and smart to develop your first android wear app.

Android Wear

By : Muhammad Bilal Ansari

Things you need to know:

WEAR APP COMPONENTS:

Wear apps can be composed of several components, these components can be used as per requirements and as per different situations.

  1. Notifications:

BRIDGE NOTIFICATIONS: These notifications are provided by the handheld to the wearable, utilizing the standard Android notifications.

CONTEXTUAL NOTIFICATIONS: These notifications are generated by the wearable and can appear at any appropriate contextual point.

  1. Full-screen UI app:

2D PICKER: This is a design pattern that is recommended by the Android developer community, when applicable. It permits the user to choose from a specific set of items.

CUSTOM LAYOUT: Custom layouts can also be used when demanded by the app.

Let’s get started now….

(Note: We will be using Android Studio for this tutorial)

Open Android studio, you will get the welcome screen.

After Android studio is opened, start with adding a virtual device.

Adding an Android Wear Emulator:

  1. Go to AVD Manager by clicking on Tools–>Android–>AVD Manager.android-wear-tutorial-mobilesiri-1
  1. Click on “Create Virtual Device” and select “Wear” from the side.android-wear-tutorial-mobilesiri-1a
  2. Select appropriate hardware and click “Next”.
  3. Now select or Download appropriate System image then click next.android-wear-api-mobilesiri-2
  4. After the above, set AVD’s preferences and settings according to need and click Finish.android-wear-tutorial-mobilesiri-3
  5. Our AVD is now created and ready to be launched, you can launch it in the emulator if you want.android-wear-tutorial-mobilesiri-4

Connecting the AVD to a Handheld:

If you want to connect the wear AVD to your handheld then you need to:

  1. Install Android Wear app on the handheld.
  2. Enable USB debugging in your handheld after connecting it via USB cable.
  3. Forward the AVD’s communication port to the handheld

adb -d forward tcp:5601 tcp:5601                                                                                                                                                         (NOTE: We need to do this every time we connect the handheld)

  1. Start Android Wear app on the handheld.
  2. Select Demo Cards after tapping at the top right side menu.
  3. Selected cards will appear as notifications on the home screen of wear AVD.
  4. This indicates that handheld is paired with the wear AVD.

Creating a New Wear Project:

  1. Now you have to create a New Project.android-wear-tutorial-mobilesiri-5
  2. After setting application name, domain and location, click Next.
  3. Now you need to select phone and tablet as well as wear. Android wear and handheld devices are a companion to each other, the programming modules for both goes hand to hand as well.

(NOTE: Minimum SDK for Phone and Tablet can be any according to your need, but minimum SDK for wear must be API 20 or higher)android-wear-tutorial-mobilesiri-6

  1. Now we continue by choosing Blank Activity for mobile.android-wear-tutorial-mobilesiri-7
  2. Set appropriate name and title for mobile activity and click next.android-wear-tutorial-mobilesiri-8
  3. Now repeat step 4 and 5 for wear activity and click Finish.androidwear_tutorial_mobilesiriandroid-wear-tutorial-mobilesiri-10
  4. The project is divided into two modules, Mobile and Wear module. Mobile module is installed on the device and where the module is installed on mobile. Both of them work together.android-wear-tutorial-mobilesiri-12

Design Structure:

Both the structures of mobile and wear module are almost similar. One major difference between the two modules is that the layout folder of wear module contains three layout files.

Let’s take a look at the XML for activity_sample-wear

<?xml version="1.0" encoding="utf-8"?>
<android.support.wearable.view.WatchViewStubxmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/watch_view_stub"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rectLayout="@layout/rect_activity_sample_wear"
app:roundLayout="@layout/round_activity_sample_wear"
tools:context="com.mobilesiri.androidwear.SampleWearActivity"
tools:deviceIds="wear"></android.support.wearable.view.WatchViewStub>

Here look closely at these two lines;

app:rectLayout="@layout/rect_activity_sample_wear"
app:roundLayout="@layout/round_activity_sample_wear"

app:rectLayout is for the square wear/watch and app:roundlayout is for round one. It is clear that two different types of screen are available in Android Wear.

At the runtime, only one of these layouts will be rendered, based on the shape of the wearable detected by Wearable.view.WatchViewStub container.

Now let’s have a look at wear activity class

package com.mobilesiri.androidwear;

import android.app.Activity;
import android.os.Bundle;
import android.support.wearable.view.WatchViewStub;
import android.widget.TextView;

public class SampleWearActivity extends Activity {

private TextView mTextView;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_sample_wear);
final WatchViewStub stub = (WatchViewStub) findViewById(R.id.watch_view_stub);
stub.setOnLayoutInflatedListener(new WatchViewStub.OnLayoutInflatedListener() {
@Override
public void onLayoutInflated(WatchViewStub stub) {
mTextView = (TextView) stub.findViewById(R.id.text);
}
});
}
}

public void onLayoutInflated(WatchViewStub stub)allows us to detect when  wearable.view.WatchViewStub has completed inflating the view. In this method we get the text view reference to change or handle the text shown. If you want to perform a progression of findViewById calls to find views do it from here, onLayoutInflated. Set the textview’s text. Now add following line in onLayoutInflatedlistener after mTextView= (TextView) stub.findViewById(R.id.text); Add following line mTextView.setText(“Hi from Mobilesiri.com”); Now let’s run this app in our AVD, click on Play button and select the wear AVD, after the AVD is loaded and the app is launched on the emulator, wear AVD screen looks like this;

android-wear-tutorial-emulator-mobilesiri

You can add more AVDs of wearables of different shapes and system images to check your app.

Publishing Wear Apps:

All wear apps should be packed in a handheld app as the user cannot install apps directly on wearables. When the user downloads the app on the handheld, it automatically installs on the connected wearable.

Additional Things:

The project creation wizard adds all the appropriate dependencies in the module’s build.gradle file. Following are the optional dependencies, and should only be used as per requirement.

  1. Wearable Data Layer
  2. Wearable UI Support library
  3. Notifications

Now you know all the basics you need to know about android wear apps development. Start trying things on your own. Happy coding!!!!

How to Develop Android Wear Apps Video Tutorial:

Here is a video tutorial that will help you guide through the process of developing an Android Wear app.

MobileSiri.com is a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for sites to earn advertising fees by advertising and linking to Amazon.com. Read about our Affiliates Disclosure Policy here. Amazon and the Amazon logo are trademarks of Amazon.com, Inc. or its affiliates.