沉浸模式

本指南以 Charades 遊戲的形式，說明構成簡易沉浸式體驗的元件。遊戲是絕佳的沉浸式應用實例，因為大部分需要自訂 UI 和輸入控制項。

過程中，你也會學到設計自己的 Glassware 的重要設計、開發和發布提示。

事前準備

GitHub 提供 Charades 遊戲的完整來源。開始匯入之前，請將其匯入 Android Studio，因為本指南經常提及該部分。

  1. 在「快速入門」畫面中，依序按一下 [從版本控制登出] > [Git]。
  2. 從圖表複製本機網址。
  3. 將本機複製網址貼到「Vcs 存放區網址」，然後按一下 [複製]。
  4. 然後在下一個畫面中點選 [是]。
  5. 點選以下畫面的 [確定]。
  6. 按一下「播放」按鈕，建立專案並在已連結的 Glass 上執行。請務必查看範例的 README，瞭解叫用詳情。

課程內容

您將瞭解如何使用 Android SDK 中的元件建構大量的 Charades 沉浸式裝置，然後運用 GDK 以融入 Glass 體驗。你將瞭解以下主題：

  • 使用我們提供的設計資源來設計 UI 流程
  • 設計語音觸發條件來啟動 Glassware
  • 使用 Android 活動定義遊戲的 UI 結構
  • 建立 Android 選單項目，讓使用者選取遊戲選項
  • 在主選單中透過語音觸發條件整合 Google Glass 服務
  • 使用 GDK 手勢偵測工具偵測使用者輸入內容，並執行自訂動作
  • 學習簡單的 Android 使用者介面實作，以強化處理並遵循 Glass 樣式
  • 瞭解發布程序，以及發布 Glassware 時應注意的事項

設計

開始開發之前，請花點時間設計 Glassware如此，您就能充分瞭解哪個 UI 流程最適合 Glass 和所需語音指令，以及資訊卡的外觀。

當然，設計 Glassware 是一道疊代過程，而您現在設計的部分設計將會有所改變，不過一開始就要有良好的工作成果，才能產生絕佳的體驗。

UI 流程

設計 UI 流程是一個簡單的練習，讓您在編寫程式碼之前，以視覺化方式呈現 Glass 軟體。我們隨時都在建構我們打造的 Glassware ！

讓我們來看看 Charades 沉浸式的主要 UI 元素，讓您瞭解 UI 的運作方式，以及在建立自己的 Glassware 時，其流程有多實用。

啟動畫面

使用者首次啟動 Charades 沉浸式螢幕時，最先看到這個畫面。這個模式可讓使用者在前往遊戲體驗之前，先確定自己已熟悉，而且是使用者熟悉的一般遊戲結構。

使用者輕觸觸控板時，系統會顯示包含兩個項目的選單系統：「New Game」和「操作說明」。

指示模式

建立沉浸式時，輸入機制有時會是新奇的，因此建議您告知使用者應如何與沉浸式互動，尤其是在遊戲中。

這組資訊卡會顯示遊戲的操作說明，並引導使用者玩遊戲，以及哪些手勢可用於瀏覽使用者介面。使用者只要在啟動畫面上輕觸 [操作說明] 選單項目，即可到達該選單。

遊戲模式

這些畫面是主要的遊戲過程流程。使用者只要輕觸啟動畫面中的 [新增遊戲] 選單項目，即可前往這個流程。

這組資訊卡會顯示隨機字詞 (最多 10 個)。使用者只要向前滑動，或是在正確描述字詞時輕觸觸控板，即可略過該字詞。

遊戲結果畫面

此畫面會顯示遊戲結果。畫面上隨即會顯示「遊戲結束」畫面，使用者只要往前滑動即可查看遊戲結果。使用者輕觸任何搜尋結果資訊卡時，畫面上會顯示「New Game」(新增遊戲) 選單項目，讓使用者開始其他遊戲。

語音指令

在設計過程中，您應該儘早發現語音指令。如有需要，語音指令可讓使用者透過 Glass 首頁 (時鐘) 語音選單啟動 Glassware，也是設計 Glassware 的主要環節。

舉例來說，「發布更新」指令適用於啟用和清除模型，讓使用者可以說出指令和部分文字，而 Glassware 會處理這些指令，使用者完全不需要介入。讓使用者可以快速返回之前做的事。

另一方面，如果是「玩遊戲」，您通常會想將使用者出現在啟動畫面，以便先取得他們使用。這個語音指令很可能會觸發沉浸式，因此您可以讓使用者看到額外的畫面和選單來啟動遊戲。一般來說，在使用者下達語音指令後，立即將玩家帶入遊戲體驗中，通常對遊戲體驗造成負面影響。

小夏使用「玩遊戲」語音指令。使用者叫用語音指令後，系統會顯示「Charades」啟動畫面，提示使用者輕觸更多選項 (本例中為「New game」(新遊戲) 或「操作說明」)。

資訊卡版面配置

無論您要建構沉浸式或即時資訊卡，都應盡可能使用 CardBuilder 或 XML 版面配置。

您通常還是需要建立自己的版面配置，因此請按照我們的 UI 指南，打造最佳外觀的 Glassware。

碼表遵循一般版面配置規範，但使用自訂 Android 元件 (例如檢視畫面和版面配置) 提供自訂 UI 版面配置。

開發

如要開發沉浸式服務，您可以使用與 Android 開發作業相同的工具來建構大量 Glassware 大量工具，然後使用 GDK 外掛程式中的 API 存取 Glass 專用的功能，例如手勢偵測工具和語音指令。

您通常會使用常見的 Android 元件建立 Glassware，但請注意，部分概念有時可能不同。例如，請勿使用沉浸於 Android 活動的沉浸式體驗。沉浸式設計是一種專為使用 Glass 建構的體驗，這種版本是以一或多個 Android 活動，以及 GDK 和 Android SDK 的許多其他元件所建構。

「開發」的其他部分會說明 Charades 遊戲的結構和先前匯入的專案的主要元件。建議您立即啟用 Android Studio，以便掌握最新消息。系統會對原始碼本身加註，因此本節將說明每個檔案的高階用途，以及可用於自己的 Glassware 的實用提示。

以下是 Charades 的主要元件簡介：

  • 聲音觸發條件宣告可連結 Glass 主要語音選單。
  • 啟動畫面活動，讓使用者可以開始遊戲或查看操作說明。這個活動會啟動指令活動或遊戲活動
  • 教學課程會向使用者說明如何實際執行遊戲的主要動作
  • 遊戲過程可讓使用者玩遊戲
  • 結果活動會顯示遊戲分數，以及猜測和未拼出的字詞清單。使用者也可以在遊戲項目中開始新遊戲。

語音指令

您可以使用 XML 資源檔案建立語音指令，而該指令會指定您使用的指令，然後在 AndroidManifest.xml 檔案中指定 XML 資源。

下列檔案與 Charades 語音指令相關聯：

  • res/xml/voice_trigger_play_a_game .xml - 宣告要使用的語音指令。
  • AndroidManifest.xml - 宣告啟動語音指令時要啟動的活動。

啟動畫面活動

啟動畫面是使用者啟動遊戲前看到的畫面。首先，系統會在啟動遊戲前顯示方向。

以下是與這個活動相關聯的檔案：

  • res/layout/activity_start_game.xml - 宣告啟動畫面的版面配置。
  • res/menu/start_game.xml - 宣告啟動畫面的選單系統，其中包括「操作指示」和「新增遊戲」選單項目。
  • res/values/dimens.xml - 宣告這項專案的活動標準和邊框間距，以用於此專案的活動來遵循 Glass 樣式。
  • src/com/google/android/glass/sample/charades/StartGameActivity.java - 啟動畫面的主要類別。
  • res/drawable-hdpi/ic_game_50.png - 新遊戲的選單圖示。
  • res/drawable-hdpi/ic_help_50.png -「操作說明」的選單圖示。

遊戲模式

建議將遊戲的模型 (遊戲狀態) 與使用者介面區隔開來。CharadesModel 類別會追蹤遊戲的分數，以及遊戲模式中猜測到的詞組數量，以及各種指示，以及使用者是否在指令模式中通過了這些詞組。

下列檔案與遊戲模型相關聯：

  • src/com/google/android/glass/sample/charades/CharadesModel.java

基本遊戲活動

由於遊戲的教學課程和遊戲模式具有相似的功能和 UI，因此這個基礎類別會定義兩者的常見功能。說明和遊戲模式的活動也擴充了這個類別。

以下是與這個活動相關聯的檔案：

  • res/layout/activity_game_play.xml：定義由 Charades 的遊戲過程和指示模式共用的版面配置。
  • src/com/google/android/glass/sample/charades/BaseGameActivity.java - 定義共享的遊戲過程基本功能以及 Charades 的共用模式。

操作說明活動

操作說明活動會顯示三張資訊卡，說明如何玩這個遊戲。其會偵測使用者是否在繼續之前執行卡片上顯示的動作。

以下是與這個活動相關聯的檔案：

  • src/com/google/android/glass/sample/charades/TutorialActivity.java - 擴充 BaseGameActivity 並定義要顯示的指示文字，以及如何在使用者完成遊戲指示時處理手勢。

遊戲活動

遊戲活動會定義遊戲的主要流程。它會決定要顯示的字詞、如何保持分數、透過手勢偵測工具來處理手勢，並在遊戲結束後啟動結果活動。

以下是與這個活動相關聯的檔案：

  • GamePlayActivity - 擴充 BaseGameActivity 並包含主要遊戲流程邏輯。

結果活動

結果活動會顯示猜測到的字詞、未拼出的字詞和遊戲分數。其中包含的選單項目，可讓使用者啟動新遊戲。

以下是與這個活動相關聯的檔案：

  • res/layout/game_results.xml - 定義「遊戲結束」資訊卡的版面配置
  • res/layout/card_results_summary.xml - 定義在清單中顯示猜測及未拼出的字詞。
  • res/layout/table_row_result.xml - 定義結果摘要的個別資料列版面配置。
  • src/com/google/android/glass/sample/charades/GameResultsActivity.java：定義實際活動，顯示由上述 XML 資源定義的版面配置和選單。
  • res/raw/sad_trombone.ogg - 在使用者沒有完整字詞時播放的音效。
  • res/raw/triumph.ogg - 在使用者輸入全部 10 個字詞時，系統播放的音效。
  • res/drawable-hdpi/ic_done_50.png - 勾號圖示，代表字詞經過正確猜測。

動畫資源

這些動畫資源為 Charades 增添了更多細節：

  • res/anim/slide_out_left.xml - 此動畫為結束檢視以向左滑出 (例如，當傳送字詞時)。
  • res/anim/slide_in_right.xml - 此動畫可進入進入檢視的右側滑入畫面 (例如，在新字詞進入檢視畫面中時)。
  • res/anim/tug_right.xml - 如果以不會滑動滑動的檢視畫面滑動，則定義了結尾動畫。這可讓使用者瞭解滑動手勢不會產生任何作用。

Android 資訊清單

AndroidManifest.xml 檔案描述了 Glassware 的主要元件，以便系統知道如何執行。Charades 的資訊清單宣告下列內容：

  • Glassware 的圖示和名稱。如有多個 Glassware 回應相同的語音指令，Google Glass 會在主選單上顯示這項資訊。
  • 與 Charades 相關的所有活動。系統需要這項資訊，才能知道如何啟動 Glassware 的活動。
  • 語音指令和意圖篩選器，會在語音指令說出特定活動時啟動特定活動。
  • Glassware 的版本代碼。每當這個 APK 的新版本上傳至 MyGlass 時，都必須更新這個程式碼 (通常是版本名稱)。