Иммерсионный шаблон

В этом руководстве описываются компоненты, составляющие простое погружение в игру в виде шарады. Игры — идеальный вариант использования для погружения, поскольку для большинства из них требуется собственный пользовательский интерфейс и элементы управления вводом.

Попутно вы также узнаете советы по дизайну, разработке и распространению, которые важны для создания собственной посуды Glassware.

Прежде чем вы начнете

Полный исходный код игры Charades доступен на Github. Прежде чем начать, импортируйте его в Android Studio, потому что в этом руководстве он часто упоминается.

  1. На экране «Быстрый запуск» нажмите «Извлечь из системы управления версиями» > «Git» .
  2. Скопируйте URL-адрес клона из Charades .
  3. Вставьте URL-адрес клона в URL-адрес репозитория Vcs и нажмите «Клонировать» .
  4. Нажмите Да на следующем экране.
  5. Нажмите OK на следующем экране.
  6. Создайте проект и запустите его на подключенном устройстве Glass, нажав кнопку «Воспроизвести» . Обязательно ознакомьтесь с README примера для получения подробной информации о вызове.

Что вы узнаете

Вы узнаете, как использовать компоненты из Android SDK для создания основной части погружения в Charades, а затем GDK для подключения к Glass. Вот список тем, о которых вы узнаете:

  • Разработка потока пользовательского интерфейса с помощью ресурсов дизайна, которые мы предоставляем
  • Разработка голосовых триггеров для запуска Glassware
  • Использование действий Android для определения структуры пользовательского интерфейса игры
  • Создание элементов меню Android, которые позволяют пользователям выбирать параметры игры
  • Интеграция в Glass с помощью голосового триггера в главном меню
  • Использование детекторов жестов GDK, которые обнаруживают ввод пользователя и выполняют настраиваемые действия.
  • Изучение простых реализаций пользовательского интерфейса Android, которые добавляют дополнительный блеск и следуют стилю Glass.
  • Изучение процесса распространения и того, на что мы обращаем внимание при выпуске Glassware.

Дизайн

Прежде чем приступить к разработке, найдите время и спроектируйте свою стеклянную посуду. Это дает вам хорошее представление о том, какие потоки пользовательского интерфейса лучше всего работают на Glass, какую голосовую команду вы будете использовать и как будут выглядеть ваши карты.

Конечно, проектирование Glassware — это итеративный процесс, и некоторые вещи, которые вы проектируете сейчас, изменятся, но хорошая часть этой работы, выполненная в начале, имеет решающее значение для создания отличного опыта.

поток пользовательского интерфейса

Проектирование потока пользовательского интерфейса — это простое упражнение, которое позволяет визуализировать Glassware перед написанием строки кода. Мы делаем это все время для стеклянной посуды, которую мы производим!

Давайте рассмотрим основные элементы пользовательского интерфейса погружения в Charades, чтобы вы получили представление о том, как работает пользовательский интерфейс и насколько полезным может быть этот процесс при создании собственного Glassware.

Заставка

Этот экран — первое, что видят пользователи, когда начинают погружение в Charades. Это позволяет пользователям сориентироваться перед тем, как перейти к игровому процессу, и является общей игровой конструкцией, с которой пользователи знакомы.

Когда пользователи касаются сенсорной панели, появляется система меню с двумя пунктами: «Новая игра» и «Инструкции» .

Режим инструкций

При создании погружений механизмы ввода иногда являются новыми, поэтому полезно сообщить пользователям, как они должны взаимодействовать с погружением, особенно с игрой.

Этот набор карточек показывает инструкции к игре и подсказывает пользователям, как играть и какие жесты использовать для навигации по пользовательскому интерфейсу. Пользователи попадают в него, нажав на пункт меню «Инструкции» на заставке.

Режим игры

Эти экраны составляют основной игровой процесс. Пользователи могут перейти к этому потоку, нажав на пункт меню «Новая игра» на заставке.

Этот набор карточек показывает случайное слово (до 10). Пользователи пропускают слово, проводя пальцем вперед и касаясь сенсорной панели, когда они правильно описывают слово.

Экран результатов игры

На этом экране отображаются результаты игры. Сначала появляется экран «Игра окончена», и пользователи могут провести пальцем вперед, чтобы увидеть результаты игры. Когда пользователи нажимают на любую из карточек результатов, появляется пункт меню «Новая игра» , позволяющий пользователям начать другую игру.

Голосовая команда

Вы должны определить голосовую команду довольно рано в процессе проектирования. Голосовые команды позволяют пользователям запускать Glassware из голосового меню Glass Home (карта часов), если это необходимо, и являются важной частью того, как вы проектируете Glassware.

Например, команда «Опубликовать обновление» хорошо работает в модели «запустил и забыл», когда пользователи произносят команду и некоторый текст, а Glassware обрабатывает их без дальнейшего вмешательства пользователя. Это позволяет пользователям быстро вернуться к тому, что они делают.

С другой стороны, для чего-то вроде Play a game вы обычно хотите, чтобы пользователи появлялись на экране-заставке, чтобы они могли сначала сориентироваться. Поскольку эта голосовая команда, скорее всего, запускает эффект погружения, вы можете ожидать, что пользователи не будут против видеть дополнительные экраны и меню для запуска игры. Сразу бросать пользователей в игровой процесс сразу после голосовой команды, как правило, плохой опыт для игр.

Charades использует голосовую команду «Играть в игру» . После того, как пользователи вызовут голосовую команду, появится экран-заставка Charades, предлагающий пользователям коснуться для получения дополнительных параметров (в данном случае «Новая игра » или «Инструкции »).

Раскладки карт

Независимо от того, создаете ли вы иммерсивные или живые карты, по возможности следует использовать макеты CardBuilder или XML.

Часто вам все равно нужно будет создать свой собственный макет, поэтому следуйте нашим рекомендациям по пользовательскому интерфейсу , чтобы иметь самое красивое стекло.

Секундомер следует общим рекомендациям по макету, но имеет настраиваемые макеты пользовательского интерфейса с использованием стандартных компонентов Android, таких как представления и макеты.

Развивать

Для разработки погружений вы используете те же инструменты, которые вы использовали бы для разработки Android для создания основной части Glassware, а затем используете API-интерфейсы в надстройке GDK для доступа к специфичным для Glass функциям, таким как детекторы жестов и голосовые команды.

Вы будете часто использовать общие компоненты Android для создания Glassware, но имейте в виду, что некоторые концепции иногда отличаются. Например, не приравнивайте погружение к активности Android. Погружения — это возможности, разработанные для Glass и созданные с помощью одного или нескольких действий Android, а также многих других компонентов GDK и Android SDK.

В остальных разделах «Разработка» рассказывается о том, как устроена игра Charades, и об основных компонентах проекта, которые вы импортировали ранее. Полезно иметь Android Studio сейчас, чтобы вы могли следовать за ней. Сам исходный код прокомментирован, поэтому в этом разделе рассматривается общее назначение каждого файла и полезные советы, которые вы можете применить к своему собственному Glassware.

Вот краткий обзор основных компонентов Charades:

  • Объявление голосового триггера для подключения к главному голосовому меню Glass.
  • Экран-заставка, позволяющий пользователям начать игру или просмотреть инструкции. Это действие запускает действие инструкций или действие игрового процесса.
  • Учебное занятие показывает пользователям, как играть в игру, фактически выполняя основные игровые действия.
  • Игровая активность позволяет пользователям играть в настоящую игру.
  • Активность результатов показывает счет игры и список угаданных и неугаданных слов. Он также позволяет пользователям начать новую игру с помощью пункта меню.

Голосовая команда

Вы создаете голосовые команды с файлом ресурсов XML, в котором указывается используемая команда, а затем указываете ресурс XML в файле AndroidManifest.xml .

Следующие файлы связаны с голосовой командой Charades:

  • res/xml/voice_trigger_play_a_game .xml — указывает используемую голосовую команду.
  • AndroidManifest.xml — объявляет действие, которое запускается при произнесении голосовой команды.

Активность экрана-заставки

Заставка — это первое, что видят пользователи при запуске Charades, и ориентирует их перед запуском игры.

Следующие файлы связаны с этим действием:

  • 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

Основная игровая активность

Поскольку обучающий и игровой режимы игры имеют очень похожие функциональные возможности и пользовательские интерфейсы, этот базовый класс определяет общую функциональность для обоих. Действия для инструкций и игровых режимов расширяют этот класс.

Следующие файлы связаны с этим действием:

  • 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 — значок галочки, который появляется рядом с правильно угаданными словами.

Анимационные ресурсы

Эти анимационные ресурсы добавляют Шарадам дополнительный блеск:

  • res/anim/slide_out_left.xml — это анимирует выходящий вид, чтобы скользить влево (например, когда передается слово).
  • res/anim/slide_in_right.xml — это анимирует входное представление, чтобы оно скользило справа (например, когда в поле зрения появляется новое слово).
  • res/anim/tug_right.xml — определяет анимацию перетягивания, если вы проводите пальцем по представлению, которое не потребляет движение. Это позволяет пользователям понять, что смахивание не имело никакого эффекта.

Манифест Android

Файл AndroidManifest.xml описывает основные компоненты вашего Glassware, чтобы система знала, как его запускать. Манифест для Charades объявляет следующие вещи:

  • Значок и название стеклянной посуды. Glass отображает эту информацию в главном сенсорном меню, если несколько устройств Glassware отвечают на одну и ту же голосовую команду.
  • Все мероприятия, связанные с Charades. Это необходимо для того, чтобы система знала, как начать работу вашей Glassware.
  • Голосовая команда и фильтр намерений, который запускает определенное действие при произнесении голосовой команды.
  • Код версии для Glassware. Этот код необходимо обновлять (как правило, и название версии) каждый раз, когда новая версия этого APK загружается в MyGlass.