最近の更新

2014年8月26日火曜日

Android Wearでウォッチフェイスを作成する方法

【目的】
Android Wearでウォッチフェイスを作成します。
※ウォッチフェイスとは時計デバイスで表示されるメインの時計画面です。



【準備】
1.「Extrasライブラリ(Android Support Library v20等)のアップデート」の手順で、「Android Support Library」をv20に更新しておきます。
2.「wearable 1.0.0のライブラリプロジェクトの作成方法」の手順で、「wearable 1.0.0」のライブラリプロジェクトを作成しておきます。
※ADT23.0.2ではAndroid Wearに対応していない為の、暫定処置です。

※実機でデバッグする場合には以下を実行しておきます。
Sumsung Gear LiveのADBドライバのインストール方法」の手順で、ADBドライバをインストールしておきます。



【手順1】
1.「Androidプロジェクトの作成・実行方法(バージョン別一覧)」のAndroidプロジェクトの作成手順で、「AndroidWearSample16-001-WatchFace」といプロジェクトを作成。
※プロジェクトの設定は以下の通り。
※他の項目は任意。
項目名 項目に設定する値
アプリケーション名(Application Name) com.example.androidwearsample16_001
プロジェクト名(Project Name) AndroidWearSample16-001-WatchFace
パッケージ名(Package Name) com.example.androidwearsample16_001
Build SDK API 20
Minimum Required SDK API 20

2.「wearable 1.0.0プロジェクトをライブラリに指定する方法」の手順で、wearable 1.0.0をライブラリ設定しておきます。
3.「android-support-v13.jarをライブラリに設定する方法」の手順で、android-support-v13.jarをライブラリ設定しておきます。



【手順2】
1.「AndroidManifest.xml」は以下の通り。
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.androidwearsample16_001"
    android:versionCode="1"
    android:versionName="1.0" >

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

    <uses-sdk
        android:minSdkVersion="20"
        android:targetSdkVersion="20" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:theme="@android:style/Theme.DeviceDefault.Light" >
        <activity
            android:name="com.example.androidwearsample16_001.MainActivity"
            android:allowEmbedded="true"
            android:label="サンプル時計" >
            <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>
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順3】
1.「res/layout/activity_main.xml」は以下の通り。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/time"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center_vertical|center_horizontal"
        android:textSize="50sp" />

</LinearLayout>
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順4】
1.「src/com/example/androidwearsample16_001/MainActivity.java」は以下の通り。
package com.example.androidwearsample16_001;

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

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.widget.TextView;

public class MainActivity extends Activity {
    private final static IntentFilter INTENT_FILTER;
    private TextView textViewTime;

    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);
    }

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        textViewTime = (TextView) findViewById(R.id.time);
        setTextView();
        registerReceiver(timeReceiver, INTENT_FILTER);
    }

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

    private void setTextView() {
        this.textViewTime.setText(new SimpleDateFormat("HH:mm", Locale.JAPANESE).format(Calendar.getInstance().getTime()));
    }

    private BroadcastReceiver timeReceiver = new BroadcastReceiver() {
        @Override
        public void onReceive(Context context, Intent intent) {
            setTextView();
        }
    };
}
2.「Ctrl+Shift+F」を押し、コードをフォーマッティング。
3.「Ctrl+S」を押し、ファイルを保存。



【手順5】
1.「Androidプロジェクトの作成・実行方法(バージョン別一覧)」のAndroidプロジェクトの実行手順で、実行。
※Android Wearの実機で動かす場合は、実機とPCをUSBで接続する。
※以下の様にインストールのみ実施されます。




【手順6】
1.まずは、現在表示されている時計画面を長押して、ウォッチフェイスの選択モードにします。
※Sumsung Gear Live(Android Wear)で試しています。




2.左右にスワイプさせると上記で作成・インストールしたウォッチフェイスがあるので、選択。





3.以下の様に表示されれば成功です。


























以上です。

0 件のコメント:

コメントを投稿

注: コメントを投稿できるのは、このブログのメンバーだけです。

関連記事