Android wear Part2 - Creating a HelloWorld

Android wear Part2 – Creating a HelloWorld

Although Android Wear watch face API is not very common to use, but that doesn’t mean we can’t make our own solution. There are a number of watch faces available, which are very simple to make also. Since you are able to make an Android application for a phone or tablet, you should also be able to make a watch face.

You can also refer my previous post on Android Wear Introduction if you are new to it. So Let’s get started to create your first android wear app. Follow the steps below:

Step1: Create a new project in android studio. Android Studio will prepare a lot of things for you. You just need to follow few steps, you’ll be almost done.

Step2: Select minimum Phone and Tablet as well as minimum Wear version as shown below:

From here, you should have a mobile and a wear module in your project. I will only cover the wear module in this tutorial. You must understand the mobile module till now so I am assuming you already do.

Step3: Open our wear’s AndroidManifest.xml, located in wear/src/main and update it with below code:

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.myandroidwear" >

<uses-feature android:name="android.hardware.type.watch" />

<application
android:allowBackup="true"
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@android:style/Theme.DeviceDefault" >
<activity
android:name=".MainActivity"
android:allowEmbedded="true"
android:label="@string/app_name" >
<meta-data android:name="com.google.android.clockwork.home.preview" android:resource="@drawable/ic_launcher" />
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="com.google.android.clockwork.home.category.HOME_BACKGROUND" />
</intent-filter>
</activity>
</application>

</manifest>

Step4: We will be showing the time on our wearable so create and write below into time.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">

<TextView
android:id="@+id/watch_time"
android:textSize="30sp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:textColor="#FF0000"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="8:20pm" />
</RelativeLayout>

This will be used to show time. To get a feel for what it will look like in the end, go ahead and look at the Preview mode available.

Step5: In the round_ and rect_ layouts, replace the entire TextView with

<include layout="@layout/time"/>

Step6: Write following onto your MainActivity.java:

package com.example.myandroidwear;

import android.app.Activity;
import android.content.BroadcastReceiver;
import android.content.Context;
import android.content.Intent;
import android.content.IntentFilter;
import android.os.Bundle;
import android.support.wearable.view.WatchViewStub;
import android.widget.TextView;

import java.text.SimpleDateFormat;
import java.util.Calendar;

public class MainActivity extends Activity {

private TextView mTextView;
private TextView mTime;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final WatchViewStub stub = (WatchViewStub) findViewById(R.id.watch_view_stub);
mTime = (TextView) stub.findViewById(R.id.watch_time);
mBattery = (TextView) stub.findViewById(R.id.watch_battery);
stub.setOnLayoutInflatedListener(new WatchViewStub.OnLayoutInflatedListener() {
@Override
public void onLayoutInflated(WatchViewStub stub) {
mTextView = (TextView) stub.findViewById(R.id.text);
mTimeInfoReceiver.onReceive(MainActivity.this, registerReceiver(null, INTENT_FILTER));
registerReceiver(mTimeInfoReceiver, INTENT_FILTER);
}
});
}

private final static IntentFilter INTENT_FILTER;
static {
INTENT_FILTER = new IntentFilter();
INTENT_FILTER.addAction(Intent.ACTION_TIME_TICK);
INTENT_FILTER.addAction(Intent.ACTION_TIMEZONE_CHANGED);
INTENT_FILTER.addAction(Intent.ACTION_TIME_CHANGED);
}

private final String TIME_FORMAT_DISPLAYED = "kk:mm a";

private BroadcastReceiver mTimeInfoReceiver = new BroadcastReceiver(){
@Override
public void onReceive(Context arg0, Intent intent) {
mTime.setText(
new SimpleDateFormat(TIME_FORMAT_DISPLAYED)
.format(Calendar.getInstance().getTime()));
}
};

@Override
protected void onDestroy() {
super.onDestroy();
unregisterReceiver(mTimeInfoReceiver);
}
}

The BroadCastReceiver here is going to be used whenever an Intent that matches one in our IntentFilter gets broadcasted. When onReceive() gets called, we get an instance of the current time. And this is all about to show the time on your wearable.

Pair your emulator and wearable as i explained in earlier post and run this app.

OutPut:

Check out my Previous Post on Sound settings.

Android wear Part2 – Creating a HelloWorld

Related Posts

Leave a Comment:

1 comment

Popular posts

Socket Programming

Use Of SQLite

TicTacToe Game Implementation

View Pager Example In Android Development