意欲的なGoogleGlass開発者向けのチュートリアル:最初のGlassアプリの構築
公開: 2022-03-11Google Glassは、デバイスを使用して世界とやり取りする方法に革命をもたらすことを約束する未来的なテクノロジーです。 しかし、開発者の観点からすると、ガラス用に開発することの何が特別なのですか? 答えは「何もない!」です。 実際、経験豊富なAndroid開発者の観点からすると、Google Glassは、画面が非常に小さく、機能が制限されているもう1つのAndroidデバイスです。
Android開発の知識を持っている人なら誰でも、未来的なウェアラブル技術のエバンジェリストのこの「エリート」コミュニティのメンバーになることができるという事実は、GoogleGlassをとても素晴らしいものにしている理由の一部です。 もちろん、「イマージョン」と「アクティブカード」の違いなど、いくつかの新しいことを学ぶ必要がありますが、ご覧のとおり、学習曲線は急ではありません。
このGoogleGlassチュートリアルの目的は、すべての一般的な手順を網羅するシンプルなアプリを作成することで、Glassアプリケーションを開発するための基礎を築くことです。 私の目標は、調査と試行錯誤の時間を節約し、最初のGlassアプリケーションをできるだけ早く実行できるようにすることです。
このチュートリアルでは、最初に開発環境をセットアップし、GoogleGlassをコンピューターに接続する方法について説明します。 次に、カスタム音声コマンドとGlassスタートメニューとの統合を含むシンプルな「HelloWorld」Glassアプリを作成します。 最初のアプリケーションを開発してGlassで実行すると、Glassアプリケーションでのナビゲーション、音声起動メニュー、動的コンテンツ作成の基本を学ぶことができます。
乗船する方法
Glassはまだ一種の「ベータテスト」段階にあり、Googleは「エクスプローラープログラム」という用語を考案しました。 名前を付けても、Glassはまだスマートフォンのように店頭で入手できるものではありません。 残念ながら、Android開発ツールには、実際のハードウェアなしでアプリケーションを開発するために使用できるエミュレーターがまだありません。
したがって、アプリケーションを実行およびデバッグするには、エクスプローラープログラムを介して実際のGoogleGlassを入手する必要があります。 プログラムに参加するには、サインアップページにアクセスし、アクセスにサインアップしてください。 承認されたら、クレジットカードを準備し、グラスが配達されるのを待ちます。 GlassのExplorerバージョンの価格は現在$1,500USDですが、デバイスが店頭に並ぶ前に価格が大幅に下がると予想されます。
Glasslessの場合
エミュレーターがないため、このチュートリアル(またはGlassアプリ)でアプリを開発するには、実際のGoogle Glassハードウェアが必要ですが、予算外の場合でも、落胆しないでください。とにかくフォローする価値があります。 チュートリアルで明らかになるのは、Glass向けの開発は、他のAndroidプラットフォーム向けの開発とほぼ同じであるということです。
まだGoogleGlassを使用したことがないが、私と同じように興奮している場合は、ユーザーインターフェイスの基本を理解するのに十分な情報が得られるはずなので、これら2つのビデオをご覧ください。
- GoogleGlassの紹介
- Google Glassハウツー:はじめに
ここには、セットアップとナビゲーションに役立つビデオがさらにあり、ユーザーインターフェイスの詳細についてはここにあります。
エンゲージメントのルール
このGoogleGlass開発者のチュートリアルでは、次のことを前提としています。
- Glassのナビゲーションとセットアップの基本を理解していることを前提としています。 Glassを使用したことがない場合は、上記のリンク先のビデオをご覧ください。
- プロジェクトファイルの構造、Androidアプリケーションの構成など、Android開発の基本を理解していることを前提としています。
- 私はAndroidStudioを使用しますが、手順はほとんどすべてのAndroid開発環境に変換されるはずです。 Android Studioはまだ「ベータ版」ですが、Glassも「ベータ版」です。 それを使い始めることを恐れないでください-それは本当に素晴らしい製品です。 AndroidStudioはこちらからダウンロードできます。
GoogleGlassを設定する
さて、始めましょう!
最初に行う必要があるのは、Glassでデバッグモードを有効にすることです。 アプリの開発に使用するすべてのAndroidデバイスでこのようなことを行う必要があるため、これはおなじみかもしれません。 デバッグを有効にするには、 [設定] -> [デバイス情報]までスワイプし、タップしてデバイスメニューを開きます。 「デバッグをオンにする」を選択すると、有効になります。
次に、開発環境を準備する必要があります。 現在のバージョンのGoogleGlassではAPIバージョン19を使用する必要があるため、インストールされていることを確認してください。 また、Glass開発キットをインストールする必要があります。 Android SDK Managerを使用して、これら2つのパッケージをまだインストールしていない場合は、インストールしてください。
"こんにちは世界"
それでは、最初の「ガラス製品」を作りましょう。 (はい、Googleは別の用語を作り出しました!「Glassware」はGoogle Glassで実行されているすべてのアプリケーションの名前です)。 まず、古き良き「HelloWorld!」の開発から始めます。 申し込み。 ほとんどの主要なAndroid開発環境と同様に、Android Studioは、この有名なフレーズを表示するためのテンプレートを新しいアプリに自動的に入力します。 その結果、「HelloWorld!」を取得できます。 稼働は、基本的なアプリのデプロイの演習にすぎません。
Android Studioで、[新しいプロジェクト]をクリックし、プロジェクトフォームに入力します。 次のようなものを使用できます。
フォームファクターとAPIを選択するときは、必ず「 Glass 」とAPI19を選択してください。
スタートアップアクティビティとして「イマージョンアクティビティ」を選択します。
イマージョンとライブカードの違いを学ぶ必要があると言ったことを覚えていますか? Googleのユーザーインターフェースの記事では、さまざまな種類のGlass画面について説明しています。 簡単な要約は次のとおりです。
ライブカードがGlassタイムラインに追加され、高頻度の更新を通じて何かに関するリアルタイムの情報が表示されます。 ユーザーが別のカードを操作しているときでも、これらは常にバックグラウンドで実行されています。 これにより、ユーザーはさまざまな種類のリアルタイム情報に常時アクセスしてマルチタスクを実行できます。
イマージョンは、タイムラインエクスペリエンスの範囲外で実行される完全にカスタマイズ可能な画面です。 これらを使用すると、独自のUIを設計し、ユーザー入力を適切と思われる方法で処理できます。 これが私たちが使用するものです!
ウィザードの次の画面で、「名前」と「タイトル」のデフォルト値をそのままにして、「終了」をクリックします。
Gradleが依存関係を処理し、プロジェクトの準備ができたら、Glassプラグインをインストールします。これが未来的な開発です。
すべてのAndroidADBドライバーが配置されており、Glassがシステムによって認識されていると仮定すると、Glassをデバイスリストに含める必要があります。
デバイスをコンピューターに接続するのが初めての場合、Glassは承認/信頼の確立を要求します。 ガラスをタップするだけで接続が可能になり、準備が整います。
「実行」をクリックし、「USB」デバイスで起動するための起動アクティビティとして「MainActivity」を使用して「デフォルトAPK」をデプロイします。
数秒後、Glass画面に次のようなものが表示されます。
やあ! アプリケーションはGlassで実行されています! そして、あなたがしなければならなかったのは、アプリを作成したときにいくつかのデフォルト値を入力することです!
別の方法で指定しなかったため、Glassは「Showdemo」という名前でアプリを表示します。 スタート画面にスワイプして戻り、タップしてアプリメニューを開くと、次のように表示されます。
少しポーランド語
実行しましたが、これは実際のGlassアプリケーションのようには見えないため、「デモを表示」でアプリケーションを起動する必要はありません。
このチュートリアルでは、実際の感覚を得るために少し調整します。
テーマの設定
まず、この醜いヘッダー「Hello World Immersion」アクティビティのタイトルバーで小さなGlass画面を使用したくないし、画面を黒のフォントで灰色にしたくないことは間違いありません。 これを修正するには、Androidのテーマを切り替えて、GlassOSに処理させる必要があります。
res/values/styles.xml
を開いて編集します。 次の内容が含まれている必要があります。
<?xml version="1.0" encoding="utf-8"?> <resources> <style name="AppTheme" parent="android:Theme.Holo.Light"> </style> </resources>
android:Theme.Holo.Light
をandroid:Theme.DeviceDefault
Theme.DeviceDefaultに変更するだけです。 これにより、Glassのデフォルトのテーマを使用して、アプリケーションのレイアウトと色が自動的に処理されます。
メニューの外観の定義
さて、このGlass開発チュートリアルで次にやりたいことは、適切な名前と適切な音声制御の起動を持つようにアプリケーションを設定することです。 Androidマニフェスト( AndroidManifest.xml
)を開き、上記の<application…
タグを追加します。
<uses-permission android:name="com.google.android.glass.permission.DEVELOPMENT" />
DEVELOPMENT
パーミッションを使用する理由は、カスタムボイスコントロールで遊ぶことができるようにするためです。 Googleは、承認されたGlassアプリで許可される音声コマンドについてかなり厳格であり、すべての新しいコマンドを承認する必要があります。 このチュートリアルは学習を目的としており、このアプリケーションをGlasswareの公式ストアに提出することはないため、心配する必要はありません。 DEVELOPMENT
権限をオンにするだけで、「リストにない音声コマンド」にアクセスできるようになります。 詳細については、このGDKページをお読みください。
編集のためにvoice_trigger.xml
を開きます。 ここで、アプリケーションを起動するための音声コマンドが定義されます。 res/xml/
フォルダーに配置する必要があります。 次のようなコンテンツを取得する必要があります。
<trigger command="SHOW_ME_A_DEMO" />
「デモを見せて」と言ってアプリを起動する代わりに、アプリの名前を言ってみましょう。 ファイルの内容を次のように変更します。
<trigger keyword="@string/app_name" />
マニフェストファイルに戻ると、 android:label="@string/app_name"
が自動的に更新され、以前のようにハードコードされたHello Glass
値の代わりにリソース文字列@string/app_name
も使用されることに気付くかもしれません。 。 この設定が更新されていない場合は、必ず値をandroid:label="@string/app_name"
に設定してください。
そして、あなたのアプリ名は正確には何ですか? res/values/strings.xml
を開くと、 app_name
は次のように表示されます。
<string name="app_name">Hello Glass</string>
これで、最初のHelloGlassアプリケーションの準備が整います。 それが今どのように機能するか見てみましょう!
スタート画面から「OKGlass」と発声して音声メニューを表示できます。 これで、アプリケーションが音声起動コマンドのリストに追加されました。
このチュートリアルをガイドすると、Glassアプリのスタート画面は次のようになります。
「 Helloglass 」と言うと、アプリケーションが起動し、標準化されたGlassエクスペリエンスを取得する必要があります。
音声を使用してアプリケーションをアクティブ化したくない場合は、スタート画面をタップするだけで、メニューにアプリケーションが表示されていることがわかります。
音声またはタッチ? 両方を使う!
アプリケーションのインターフェースとユーザーとアプリケーションの相互作用に細心の注意を払うことが非常に重要です。 ユーザーは、講義やプレゼンテーションを見ているときなど、常に自分の声を使用できるとは限らないことに注意してください。 または、手をいっぱいにしてタッチを使用できない場合があります。 可能な限り、タッチメニューと音声メニューの両方の操作を提供して、ユーザーが音声とタッチパッドを並行して使用してアプリケーション内を移動できるようにすることをお勧めします。
実際のアプリケーション-ToptalFinder
Glassの開発に慣れ、Hello Glassを作成したので、次は新しいGlass機能を動作させる実際のアプリケーションを作成します。 開発プラットフォームに基づいてトップのToptal開発者のプロファイルを閲覧できるアプリを作成しましょう。
サンプルのGlassアプリケーションの構造は単純です。
- スタート画面に音声付きのToptalロゴを表示し、アクティブ化されたメニューをタップして、開発者が必要な開発プラットフォームを選択できるようにします。
- プラットフォームを選択した後、開発者の写真と名前のリストを取得したいと思います。 開発者プロファイルは、個人カードのスクロール可能なリストの形式で表示されます。
- 開発者プロフィールを表示するときに、それらをお気に入りに追加したり、採用リクエストを送信したりできるようにしたいと考えています。
基礎
Androidの知識に加えて、すでに追加した内容を簡単に要約してみましょう。
- Glasswareを構築するための開発環境をセットアップする方法。
- 標準のGlasswareGUIテーマを使用するようにアプリケーションを構成する方法。
- カスタム音声コマンドとメニュー名を使用してアプリケーションを起動する方法。
この知識を使用して、新しいアプリを起動して実行します。 上記からHelloGlassアプリを更新するか、同じ手順に従って新しいアプリを起動できます。 このアプリケーションに「 TopFinder 」という名前を付け、 voice_trigger.xml
ファイルを次のようにします。
<?xml version="1.0" encoding="utf-8"?> <trigger keyword="@string/app_name" > <constraints network="true" /> </trigger>
network="true"
制約は、このアプリを起動するときにネットワーク接続をチェックするようにGlassに指示します。これは、Toptal開発者リストに接続する必要があります。 接続がない場合、Glassは警告メッセージを表示します。
ホーム画面
アプリケーションのホーム画面を次のようにしましょう。
画面に「okglass」というメッセージが表示されている場合は、アプリケーションのその場所に音声起動メニューがあることを意味します。 ここで「okglass」というフレーズを話すと、この場所の音声メニューがアクティブになります。 このフレーズはGlassによって事前定義されており、変更することはできません。
「okglass」は、スマートフォンやタブレットの開発で使用したのと同じように「アプリケーションメニュー」と考えることができ、まったく同じ役割を果たします。 画面上の「アプリケーションメニューアイコン」(多くの場合、3つの点または線)を「タップ」してAndroidアプリケーションメニューを開くのと同じように、Glasswareアプリで音声起動メニューを開くには「okglass」と言う必要があります。
「okglass」メニューを有効にするには、APIからFEATURE_VOICE_COMMANDS
をリクエストする必要があります。 これを行うには、 MainActivity
のonCreate
ハンドラーに次の行を追加します。
getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS);
この機能が含まれているすべてのアクティビティは、下部中央に「okglass」というテキストでレンダリングされます。
次に行う必要があるのは、メイン画面のメニューを作成することです。 res/menu
フォルダーに、 main.xml
という名前の新しいXMLメニュー定義を作成します。 簡単にするために、3つのToptal開発者プラットフォームを有効にしますが、必要に応じて自由に変更してください。
次の内容が含まれている必要があります。
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:andro> <item android: android:title="Top Android developer" /> <item android: android:title="Top JavaScript developer" /> <item android: android:title="Top iOS developer" /> </menu>
なぜ私がAndroid、JavaScript、iOSだけでなく、かなり長いメニュータイトルを選んだのか不思議に思うかもしれません。 まあ、理由は非常に簡単です。 Glass開発チームのメンバーはまだ音声認識を改善しています。 Glassがそれらを認識しやすくするために、メニューで2つまたは3つの単語を使用することをお勧めします。
「okglass」メニューは、標準のAndroidアプリケーションメニューと同じです。 アクティビティにメニューを添付することは、実質的に同じです。 MainActivity
のonCreatePanelMenu
ハンドラーをオーバーライドし、作成したメインメニューを膨らませるだけです。
@Override public boolean onCreatePanelMenu(int featureId, Menu menu){ if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { getMenuInflater().inflate(R.menu.main, menu); return true; } return super.onCreatePanelMenu(featureId, menu); }
次に、メニューハンドラーを追加する必要があります。 その前に、 findDevelopers
という名前の空のメソッドを1つ作成します。 後でこれに戻って検索を開始し、結果を表示します。 その後、メニューハンドラーをオーバーライドできます。
public void findDevelopers(String platform){ } @Override public boolean onMenuItemSelected(int featureId, MenuItem item) { if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { switch (item.getItemId()) { case R.id.find_android: findDevelopers("Android"); break; case R.id.find_javascript: findDevelopers("Java Script"); break; case R.id.find_ios: findDevelopers("iOS"); break; } return true; } return super.onMenuItemSelected(featureId, item); }
次に、GoogleGlassアプリケーションの例のホーム画面をきれいにします。 Toptalロゴをres/drawable/logo.png
としてアプリケーションにインポートします。 私はこの画像を使用しました:
MainActivity
クラスで、次の変更を行います。

次のプライベート変数がクラスの開始時に宣言されていることを確認してください。
private CardScrollView mCardScroller; private View mView; private GestureDetector mGestureDetector;
buildView
メソッドを変更して、カードのレイアウトをカスタマイズします。
private View buildView() { Card card = new Card(this); card.setText(R.string.app_name); card.setImageLayout(Card.ImageLayout.LEFT); card.addImage(R.drawable.logo); return card.getView(); }
そして、 onCreate
ハンドラーを次のように変更します。
protected void onCreate(Bundle bundle) { super.onCreate(bundle); getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); mView = buildView(); mCardScroller = new CardScrollView(this); mCardScroller.setAdapter(new CardScrollAdapter() { @Override public int getCount() { return 1; } @Override public Object getItem(int position) { return mView; } @Override public View getView(int position, View convertView, ViewGroup parent) { return mView; } @Override public int getPosition(Object item) { if (mView.equals(item)) { return 0; } return AdapterView.INVALID_POSITION; } }); // Handle the TAP event. mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { openOptionsMenu(); } }); mGestureDetector = createGestureDetector(this); setContentView(mCardScroller); }
前に述べたように、 「ok glass」と一緒にタップ起動メニューを含めたいので、Androidアプリの場合と同じようにジェスチャーを有効にします。 MainActivity
クラスに次のメソッドを追加します。
private GestureDetector createGestureDetector(Context context) { GestureDetector gestureDetector = new GestureDetector(context); //Create a base listener for generic gestures gestureDetector.setBaseListener( new GestureDetector.BaseListener() { @Override public boolean onGesture(Gesture gesture) { if (gesture == Gesture.TAP) { openOptionsMenu(); return true; } else if (gesture == Gesture.TWO_TAP) { // do something on two finger tap return true; } else if (gesture == Gesture.SWIPE_RIGHT) { // do something on right (forward) swipe return true; } else if (gesture == Gesture.SWIPE_LEFT) { // do something on left (backwards) swipe return true; } else if (gesture == Gesture.SWIPE_DOWN){ finish(); } return false; } }); gestureDetector.setFingerListener(new GestureDetector.FingerListener() { @Override public void onFingerCountChanged(int previousCount, int currentCount) { // do something on finger count changes } }); gestureDetector.setScrollListener(new GestureDetector.ScrollListener() { @Override public boolean onScroll(float displacement, float delta, float velocity) { // do something on scrolling return true; } }); return gestureDetector; } @Override public boolean onGenericMotionEvent(MotionEvent event) { if (mGestureDetector != null) { return mGestureDetector.onMotionEvent(event); } return false; }
それはそれであるはずです! これで、アプリを起動して、メニューをアクティブ化する両方の方法を試すことができます。 「okglass」と言うと、画面に3つのメニュー項目が表示され、ガラスをタップすると、スクロール可能なメニューが開きます。 メニュー項目をナビゲートするには、前後にスワイプできます。
音声メニューは次のようになります。
そして、これがジェスチャーメニューです:
メニュー項目を選択した場合、 findDevelopers
メソッドはまだ実装されていないため、何も起こりません。
開発者画面
左側に画像、右側にテキスト、およびいくつかのフッター情報を含む、デフォルトのGlassCardレイアウトを引き続き使用します。 カードをデザインするためのベストプラクティスの詳細については、GoogleGlassスタイルガイドを参照してください。
開発者プロファイルは、単純なプロパティによって定義されます。
- 名前
- 写真
- 開発プラットフォーム
だから、私たちのアプリでクラスの適切な構造を持っていることを確認しましょう。 java/models
フォルダーにDeveloperModel.java
という名前の新しいクラスを作成します。 このクラスにはリスト内のプロファイルが含まれるため、このクラスをシリアル化できるようにする必要があります。
public class DeveloperModel implements Serializable { private String name; public String getName(){ return name; } public void setName(String name){ this.name=name; } private String platform; public String getPlatform(){ return platform; } public void setPlatform(String platform){ this.platform=platform; } private String image; public String getImage(){ return image; } public void setImage(String image){ this.image=image; } }
カードを開発者のプロファイルデータに緊密にバインドする必要があります。 デフォルトのCardScrollAdapter
は、そのデータモデルに関して少し一般的であるため、それを拡張して独自のものにする必要があります。 java/adapters
フォルダーにDeveloperAdapter.java
を作成します。
public class DeveloperAdapter extends CardScrollAdapter { private List<Card> mCards; private List<DeveloperModel> mData; public DeveloperAdapter(List<Card> cards){ this.mCards = cards; } @Override public int getCount() { return mCards.size(); } @Override public Object getItem(int i) { return mCards.get(i); } @Override public View getView(int i, View view, ViewGroup viewGroup) { return mCards.get(i).getView(); } @Override public int getPosition(Object o) { return this.mCards.indexOf(o); } }
アプリケーションのホーム画面に検索結果を追加したくないので、検索を実行して結果を表示する新しいアクティビティを作成します。 MainActivityの横に新しいアクティビティResultsActivity
を作成します(おそらくjava/com.helloglass
MainActivity
あります)。
extends Activity
することを確認してください。
次に、開発者プロファイルカードのメニューを指定する必要があります。 次の内容で新しいメニューdeveloper.xml
を作成します。
<?xml version="1.0" encoding="utf-8"?> <menu xmlns:andro> <item android: android:title="Add to favorites" /> <item android: android:title="Hire" /> <item android: android:title="Go back" /> </menu>
ResultsActivity
とMainActivity
の間でパラメーターを渡すことができるようにするには、 ResultsActivity
クラスの先頭に次の行を追加します。
public static final String SEARCH = "search"; private String mPlatform="Android";
マニフェストファイルに新しいアクティビティを必ず追加してください。
<activity android:name=".ResultsActivity" android:immersive="true" android:icon="@drawable/ic_launcher" android:label="@string/title_activityresults" android:parentActivityName=".MainActivity"> <meta-data android:name="android.support.PARENT_ACTIVITY" android:value="com.eloptico.MainActivity" /> </activity>
ResultsActivity
の初期画面の設定とカードの構成は、 MainActivity
で行ったものと非常によく似ています。 まず、最初にカードとスクローラーが定義されていることを確認します。
private CardScrollView mCardScroller; private List<Card> mCards; private GestureDetector mGestureDetector;
後で実装するために戻ってくる一時的な検索メソッドを作成します。 プロファイルリストに新しいカードを追加するのは、アレイにアイテムを追加するのと同じくらい簡単です。 このメソッドにもfindDevelopers
という名前を付けますが、これはResultsActivity
に属しています。
private void findDevelopers(String platform){ for (int i=1; i<=10; i++){ Card card = new Card(this); card.setText(platform+" "+Integer.toString(i)); card.setTimestamp(platform); card.setImageLayout(Card.ImageLayout.LEFT); card.addImage(R.drawable.ic_person_50); mCards.add(card); } mCardScroller.setSelection(0); }
ここで、 ResultsActivity
に戻り、 MainActivity
を更新して、 findDevelopers
を開始し、 platform
プロパティを渡します。
public void findDevelopers(String platform){ Intent resultsIntent = new Intent(this, ResultsActivity.class); resultsIntent.putExtra(ResultsActivity.SEARCH, platform); startActivity(resultsIntent); }
開発者メニューをResultsActivity
に添付します。 どのプロファイルカードでもメニューを開くことができます。
@Override public boolean onCreatePanelMenu(int featureId, Menu menu){ if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { getMenuInflater().inflate(R.menu.developer, menu); return true; } return super.onCreatePanelMenu(featureId, menu); }
前と同じように、 ResultsActivity
が表示されているときに、ジェスチャーを有効にしてGlassのタッチパッドを処理します。 これを行うには、 onGesture(Gesture gesture)
メソッドでopenOptionsMenu()
を呼び出すだけです。
private GestureDetector createGestureDetector(Context context) { // … @Override public boolean onGesture(Gesture gesture) { if (gesture == Gesture.TAP) { openOptionsMenu(); return true; } else if // …
また、開発者関連のアクションにメニューハンドラーを追加します。 とりあえず簡単なトーストメッセージを残しておきます。
@Override public boolean onMenuItemSelected(int featureId, MenuItem item) { if (featureId == WindowUtils.FEATURE_VOICE_COMMANDS || featureId == Window.FEATURE_OPTIONS_PANEL) { switch (item.getItemId()) { case R.id.developer_fav: Toast.makeText(getApplicationContext(), "Favorite", Toast.LENGTH_LONG).show(); break; case R.id.developer_hire: Toast.makeText(getApplicationContext(), "Message", Toast.LENGTH_LONG).show(); break; case R.id.go_back: break; } return true; } return super.onMenuItemSelected(featureId, item); }
すべてのアプリケーションは、いくつかの優れた視覚要素、アイコンなどを使用する必要があります。GoogleGlassチームは、Glass開発者がアプリケーションで無料で使用できる、非常に多くの一般的な標準化されたアイコンのセットを提供しています。 ライブラリには、標準のGlassアイコンとフォントのフルセットがあります。
今のところ、必要なアイコンic_person_50.png
は1つだけなので、先に進んでres\drawable
drawableフォルダーにダウンロードしてください。 開発者の写真をダウンロードする代わりに、このアイコンを使用します。
今のところGlassアプリ開発チュートリアルに残っている最後のことは、 ResultsActivity
のonCreate
ハンドラーをオーバーライドすることです。ここで、 MainActivity
から転送された開発プラットフォームを確認し、リストに入力します。
@Override protected void onCreate(Bundle bundle) { super.onCreate(bundle); getWindow().addFlags(WindowManager.LayoutParams.FLAG_KEEP_SCREEN_ON); getWindow().requestFeature(WindowUtils.FEATURE_VOICE_COMMANDS); mCardScroller = new CardScrollView(this); mCards = new ArrayList<Card>(); if(getIntent().hasExtra(SEARCH)){ mPlatform = getIntent().getStringExtra(SEARCH); } findDevelopers(mPlatform); mCardScroller.setAdapter(new DeveloperAdapter(mCards)); // Handle the TAP event. mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { openOptionsMenu(); } }); mGestureDetector = createGestureDetector(this); setContentView(mCardScroller); }
MainActivity
メソッドとonPause
メソッドは、 onResume
と同じままにすることができます。
今すぐアプリケーションを起動すると、 MainActivity
で選択したメニューに基づいて、開発者プロファイルがその場でどのように作成されるかを確認できます。 ここでも、 「OK Glass」を使用するか、タッチパッドをタップするか、音声アクティベーションを使用してメニューを表示するオプションがあります。 現在、「10番目のAndroid開発者」プロファイルは次のようになっています。
タップするとタッチメニューが表示されます。
そして、 「ok glass」と言うと、音声メニューが表示されます。
リストから下にスワイプして、アプリのホーム画面に戻ります。
インターネットからプロファイルを取得する
最後に、JavaScript、Android、iOSのトップ10のToptal開発者向けの実際の情報をメニューに入力しましょう。
プロフィール写真をダウンロードしてHTTP経由で利用できるようにするか、toptal.comから直接URLを使用する必要があります。
Toptalのトップ開発者の名前を取得するためだけにWebクローラーを構築することは、この記事の迂回にはなりすぎる可能性があるため、Android、JavaScript、およびiOSで使用するJSONファイルを作成しました。
アプリで最初に行う必要があるのは、AndroidOSからインターネットへのアクセスをリクエストすることです。 マニフェストファイルに次の行を追加します
<uses-permission android:name="com.google.android.glass.permission.INTERNET"/>
Glassでは、HTTPリクエストを直接使用してメインスレッドをブロックすることはできないことに注意してください。 JSONのダウンロードと個々の画像を非同期的に処理する必要があります。 非同期タスクを使用したり、独自のダウンロードサービスやインテントを作成したり、日常業務で好きなものを作成したりできます。
この機能の構築はGoogleGlassに固有のものではないため、コードスニペットはスキップします。 先に進んでこの最後の機能を機能させると、プロファイルカードは次のようになります。
チュートリアルのまとめ
このGoogleGlass開発チュートリアルに従って、最初のGlasswareアプリケーションを作成して楽しんでいただけたでしょうか。 これで、Glass用のアプリケーションの作成は他のAndroidプラットフォームとそれほど変わらないという考えに慣れているはずです。
この時点で、Google Glassの音声起動ホーム画面を拡張する方法、独自の音声起動メニューを作成する方法、および音声コントロールとタッチジェスチャを組み合わせる方法を学習しました。 また、カード、レイアウト、要素など、GlassUIの概念と基本的な構成要素を理解する必要があります。 カードを動的に作成する方法と、さまざまなアクティビティ間を移動する方法を見てきました。
詳細については、developers.google.com/glassにあるGoogleの開発者向けリソースにアクセスしてください。 より複雑なアプリケーションの構築を開始すると、非常に役立つリソースになることがわかります。
Glassはまだ開発段階にあり、消費者市場に到達する前に、さらに多くの拡張機能が実装される可能性があることに注意してください。 これを念頭に置いて、私はあなたに1つの重要な注意を持っています:
音声認識にはかなりの作業が残っており、活動を開始したり情報を入力したりしようとしているときに、想像上の友達に向かって叫んでいることに気付くかもしれません。 心配はいりません。GoogleGlassの開発を試みる人は誰もが同じように感じるので、あなただけではありません。
技術は進歩し、ガラスはすぐに小売りできるようになります。 店頭に並ぶと必ず大きな波が押し寄せますので、このエキサイティングなテクノロジーの最前線に立つ最初の一人になることについて、私と同じように興奮していただければ幸いです。
シャウトアウト:この記事のスクリーンショットは、Droid@Screenを使用して作成されています。