Навигация на телевизоре

На телевизорах доступно ограниченное количество элементов управления навигацией в приложениях. Чтобы создать эффективную схему навигации для ТВ-приложения, необходимо учитывать ограниченные возможности управления и особенности взаимодействия пользователей с приложением. При разработке приложения для Android TV обратите особое внимание на то, как пользователь будет перемещаться по приложению с помощью кнопок пульта ДУ, а не сенсорного экрана.

Принципы

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

Контроллеры

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

D-pad
Основной способ навигации на телевизоре – с помощью D-pad, на котором есть аппаратные кнопки "Вверх", "Вниз", "Влево" и "Вправо". С помощью d-pad можно переходить от одного объекта к ближайшему в направлении нажатой кнопки.

Кнопка выбора
Выбирает элемент на экране, на котором установлен фокус.

Кнопка главного экрана
Переводит пользователя на главный экран системы.

Кнопка "Назад"
Позволяет вернуться к предыдущему представлению.

Кнопка микрофона
Запускает Google Ассистента или голосовой ввод.

Навигация с помощью D-pad

На телевизоре пользователи перемещаются с помощью d-pad или клавиш со стрелками. Этот тип управления позволяет перемещаться только вверх, вниз, влево и вправо. Чтобы создать удобное приложение для телевизора, необходимо разработать схему навигации, которая позволит пользователю быстро научиться управлять приложением с помощью ограниченного набора элементов управления.

Навигация между элементами макета в Android осуществляется автоматически, поэтому обычно вам не нужно ничего делать. Однако мы рекомендуем тщательно протестировать навигацию с помощью контроллера D-pad, чтобы выявить возможные проблемы.

Следуйте этим рекомендациям, чтобы проверить, насколько хорошо система навигации вашего приложения работает с d-pad на телевизоре.

• Убедитесь, что пользователь с контроллером D-pad может перейти ко всем видимым элементам управления на экране.
• Для списков с фокусом убедитесь, что кнопки вверх и вниз на d-pad прокручивают список, а кнопка выбора позволяет выбрать элемент в списке. Убедитесь, что пользователи могут выбирать элементы в списке и что список прокручивается, когда элемент выбран.
• Переключение между элементами управления должно быть простым и понятным.

Как изменить навигацию по направлениям

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

В приведенном ниже фрагменте кода показано, как определить следующий элемент управления, который получит фокус для объекта макета TextView:

<TextView android:id="@+id/Category1" android:nextFocusDown="@+id/Category2" />

В таблице ниже перечислены все доступные атрибуты навигации для виджетов интерфейса пользователя Android:

Чтобы использовать один из этих атрибутов навигации, задайте для него значение android:id другого виджета в макете. Настройте порядок перехода так, чтобы фокус с последнего элемента управления возвращался к первому.

Четко выделяйте элементы, на которые наведен фокус

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

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

В Android есть ресурсы списка состояний Drawable, которые позволяют выделять выбранные и активные элементы управления. В примере кода ниже показано, как включить визуальное поведение кнопки, чтобы указать, что пользователь перешел к элементу управления и выбрал его:

<!-- res/drawable/button.xml -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true"
          android:drawable="@drawable/button_pressed" /> <!-- pressed -->
    <item android:state_focused="true"
          android:drawable="@drawable/button_focused" /> <!-- focused -->
    <item android:state_hovered="true"
          android:drawable="@drawable/button_focused" /> <!-- hovered -->
    <item android:drawable="@drawable/button_normal" /> <!-- default -->
</selector>
button.xml

В следующем примере кода XML макета предыдущий список состояний применяется к элементу Button:

<Button
    android:layout_height="wrap_content"
    android:layout_width="wrap_content"
    android:background="@drawable/button" />

Убедитесь, что вокруг элементов управления, на которые можно переходить и которые можно выбирать, достаточно места, чтобы подсветка была хорошо видна.

Навигация с помощью кнопки "Назад"

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

Как использовать предсказуемое поведение кнопки "Назад"

Чтобы навигация была простой и понятной, при нажатии кнопки "Назад" на пульте дистанционного управления пользователь должен переходить к предыдущему пункту назначения.

Если пользователь переходит из пункта меню на карточку в середине страницы, а затем нажимает кнопку "Назад", результат зависит от того, какой тип навигации используется в приложении:

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

Убедитесь, что кнопка "Назад" не заблокирована экранами подтверждения или не является частью бесконечного цикла.

Чего не стоит делать
Не используйте заставки в конце видео. Разрешить пользователям выходить из приложения без подтверждения.

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

Не показывать кнопку "Вверх" или "Назад"

В отличие от мобильных устройств, на телевизоре кнопка "Назад" на пульте используется для навигации. Показывать виртуальную кнопку "Назад" на экране не обязательно:

Чего не стоит делать

При необходимости показывать кнопку отмены

Если видимые действия – это подтверждение, удаление или покупка, рекомендуется добавить кнопку Отмена, которая возвращает пользователя к предыдущему экрану:

Что стоит делать

Как реализовать обратную навигацию

Как правило, фреймворк Android хорошо обрабатывает навигацию назад, как и навигацию с помощью D-pad. Если вы используете компонент навигации, то можете поддерживать разные графы навигации. Иногда вам может понадобиться реализовать нестандартное поведение, например чтобы кнопка "Назад" возвращала фокус в начало длинного списка.

ComponentActivity – базовый класс для FragmentActivity и AppCompatActivity. Он позволяет управлять поведением кнопки "Назад" с помощью OnBackPressedDispatcher, которое можно получить, вызвав getOnBackPressedDispatcher().

Подробнее о том, как реализовать собственную обратную навигацию…

Элементы управления воспроизведением на телевизоре

Воспроизведение видео – одна из самых важных функций телевизора. Важно, чтобы видеопроигрыватели в приложениях на Android TV работали одинаково. Ознакомьтесь с правилами использования элементов управления воспроизведением на телевизорах.

Навигация по вкладкам в прямом эфире

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

Удобное воспроизведение

Воспроизведение без лишних действий применяется к действиям в приложении после перехода по ссылке на онлайн-телеканал или телеканал с линейным вещанием из Google TV или Android TV.

Когда пользователь нажимает на ссылку на контент, действуют следующие правила:

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

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

Прямой возврат

Когда пользователь запускает приложение по ссылке на контент на вкладке "Трансляции" и нажимает кнопку "Назад", он должен вернуться на эту вкладку одним нажатием, независимо от того, сколько времени прошло. Такое поведение при переходе назад обязательно для всех ссылок на контент на вкладке "Трансляции" в Google TV и Android TV.

Ссылки на контент на вкладке "Трансляции" отличаются от других ссылок на контент добавленным параметром:?exit_on_back=[true|false]. Приложения должны анализировать этот параметр, чтобы определить, было ли оно запущено с вкладки "Трансляции". Если exit_on_back имеет значение true, приложения должны поддерживать переход назад.

Если пользователь нажмет любую другую кнопку, а не кнопку "Назад", то требование прямого перехода назад не применяется и достаточно стандартного поведения кнопки "Назад".

Например, пользователь перешел по ссылке на контент и нажал кнопку выбора на пульте, чтобы открыть меню управления. Пользователь ждет, пока исчезнет оверлей, а затем нажимает кнопку "Назад". Поскольку первой кнопкой, нажатой после перехода по ссылке на контент, была кнопка выбора D-pad, требование прямого возврата не применяется. Вместо этого применяется обычная логика стека возврата приложения.

При многократном нажатии кнопки "Назад" пользователь должен сначала перейти на главный экран приложения, а затем вернуться в Google TV или Android TV. При этом не должно возникать бесконечных циклов. Подробнее о предсказуемом поведении кнопки "Назад"…

Архитектура навигации

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

Фиксированный пункт отправления

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

Ссылки на контент имитируют навигацию вручную

Независимо от того, переходит ли пользователь по ссылке на контент или вручную, он может вернуться к начальной точке, нажимая кнопку "Назад".

При переходе по ссылке на контент из одного приложения в другое имитируется ручная навигация. Например, если пользователь переходит на страницу сведений в приложении Moviestar из Google TV, а затем нажимает кнопку "Назад", он попадает на главную страницу приложения Moviestar.

Четкий путь ко всем фокусируемым элементам

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

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

Чего не стоит делать
Не размещайте элементы управления в труднодоступных местах. Достичь показанного здесь действия поиска с помощью d-pad может быть сложно.

Оси

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

Делать.
Категории можно просматривать по вертикальной оси, а элементы в каждой категории – по горизонтальной.

Чего не стоит делать
Избегайте сложных и вложенных иерархий макетов.