Приемник воспроизводит контент и отображает его состояние пользователю. Получатель должен немедленно реагировать на действия в приложении отправителя. Например, когда контент приостанавливается на приемнике, отображается значок паузы, а когда пользователь нажимает кнопку воспроизведения в приложении-отправителе, получатель начинает воспроизведение контента и удаляет значок паузы.
Примеры отзывов пользовательского интерфейса приемника:
- Играя
- Приостановлено
- Позиция воспроизведения/поиск
- Буферизация
Пользовательский интерфейс приемника
Необходимый
Размещайте большинство элементов пользовательского интерфейса в нижней четверти экрана и сохраняйте соответствие с другими элементами пользовательского интерфейса.
Б. Не представляйте элементы как интерактивные элементы управления. Например, не воспроизводите пользовательский интерфейс отправителя в пользовательском интерфейсе получателя.
Лучшие практики
- Используйте переход (затухание), прозрачность и нюансы, чтобы смягчить визуальный эффект.
- Учтите тот факт, что пользователи хотят видеть как можно больше контента. Пользователи часто приостанавливают контент, чтобы изучить его, поэтому по возможности удаляйте ненужный пользовательский интерфейс.
Андроид
Пользовательский интерфейс отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=7&hl=ru)
Пользовательский интерфейс приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=7&hl=ru)
iOS
Пользовательский интерфейс отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=7&hl=ru)
Пользовательский интерфейс приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=7&hl=ru)
Хром
Пользовательский интерфейс отправителя
![Пользовательский интерфейс отправителя](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.png?authuser=7&hl=ru)
Пользовательский интерфейс приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-elements1_a.png?authuser=7&hl=ru)
Приложение-приемник неактивно
На приемнике отображается экран ожидания, когда приемник подключен к отправителю, но не осуществляет трансляцию.
Необходимый
A Определите, какое приложение-приемник загружено
Лучшие практики
- Используйте экран ожидания для продвижения контента или функций приложения-отправителя.
- Меняйте контент каждые 30–60 секунд, чтобы отображать больше и предотвратить выгорание экрана.
- Отключитесь от приложения-приемника и остановите его работу, если он не используется в течение 5 минут. При остановке появляется главный экран ресивера, что поможет предотвратить выгорание экрана.
Андроид
Диалог трансляции, подключен, но не транслируется
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-menu-connected1.png?authuser=7&hl=ru)
Приложение-приемник загружено/неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1_a.png?authuser=7&hl=ru)
iOS
Диалог трансляции, подключен, но не транслируется
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-menu-connected1.png?authuser=7&hl=ru)
Приложение-приемник загружено/неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-idle1_a.png?authuser=7&hl=ru)
Загрузка приложения приемника
Когда пользователь подключается к приемнику, приложение-приемник должно сначала загрузиться, прежде чем оно сможет отобразить состояние ожидания приложения или начать воспроизведение контента.
Необходимый
Определите , какое приложение-приемник загружается, отобразив логотип приложения.
Б. Определите, что приложение-приемник загружается, отобразив анимированный индикатор загрузки.
Андроид
Подключение отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states4.png?authuser=7&hl=ru)
Загрузка приложения приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=7&hl=ru)
iOS
Подключение отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4.png?authuser=7&hl=ru)
Загрузка приложения приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=7&hl=ru)
Хром
Подключение отправителя
![Подключение отправителя](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4.png?authuser=7&hl=ru)
Загрузка приложения приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-player-loading1_a.gif?authuser=7&hl=ru)
Загрузка содержимого приемника
После загрузки приложения-приемника контент может начать потоковую передачу на приемник.
Необходимый
A Определите, какой контент загружается, отобразив заголовок контента или иллюстрацию.
Б. Определите, что контент загружается, отобразив анимированный индикатор загрузки.
Лучшие практики
При возобновлении приостановленного контента перемотайте воспроизведение на 5–10 секунд, чтобы зритель ничего не пропустил при переходе от отправителя к получателю.
Андроид
Загрузка контента отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements1.gif?authuser=7&hl=ru)
Загрузка содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=7&hl=ru)
iOS
Загрузка контента отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements1.gif?authuser=7&hl=ru)
Загрузка содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=7&hl=ru)
Хром
Загрузка контента отправителя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements1.gif?authuser=7&hl=ru)
Загрузка содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-content-loading1_a.gif?authuser=7&hl=ru)
Воспроизведение приемника
Необходимый
A Определите, что воспроизводится при запуске контента
B Определите положение воспроизведения, когда положение отрегулировано
C Определите, что приемник ищет контент, когда позиция воспроизведения изменена, но еще не воспроизводится.
Андроид
Отправитель меняет позицию воспроизведения
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements3.gif?authuser=7&hl=ru)
Поиск контента получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=7&hl=ru)
iOS
Отправитель меняет позицию воспроизведения
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements3.gif?authuser=7&hl=ru)
Поиск контента получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=7&hl=ru)
Хром
Отправитель меняет позицию воспроизведения
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements3.gif?authuser=7&hl=ru)
Поиск контента получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-seek1_a.gif?authuser=7&hl=ru)
Приемник приостановлен
Необходимый
Определите , что контент приостановлен, отобразив значок паузы и позицию воспроизведения.
Б. Определите, какой контент приостановлен, отображая заголовок или иллюстрацию контента.
C Определите, какое приложение-приемник загружено, по отображению логотипа приложения.
Лучшие практики
- Пользователи часто приостанавливают контент, чтобы изучить его, поэтому ненужный пользовательский интерфейс исчезает при приостановке на несколько секунд, отображая значок паузы.
- Приложение-получатель не должно продолжать воспроизведение контента, если от пользователя не поступил явный запрос на начало воспроизведения, например возобновление или пропуск элемента в очереди.
- Отключитесь от приложения-приемника и остановите его работу, если он не используется в течение 20 минут. При остановке появляется главный экран ресивера, что поможет предотвратить выгорание экрана. Сохраните место паузы, чтобы пользователь мог возобновить воспроизведение с этого места позже.
Андроид
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=7&hl=ru)
Контент приемника приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=7&hl=ru)
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-persistent-control2.png?authuser=7&hl=ru)
Приемник поставлен на паузу через 5 секунд.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=7&hl=ru)
iOS
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=7&hl=ru)
Контент приемника приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=7&hl=ru)
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-persistent-control2.png?authuser=7&hl=ru)
Приемник поставлен на паузу через 5 секунд.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=7&hl=ru)
Хром
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.jpg?authuser=7&hl=ru)
Контент приемника приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause1_a.png?authuser=7&hl=ru)
Отправитель приостановлен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-persistent-control2.jpg?authuser=7&hl=ru)
Приемник поставлен на паузу через 5 секунд.
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-pause2.png?authuser=7&hl=ru)
Буферизация приемника
Буферизация на приемнике происходит, когда задержка в сети или другие факторы вызывают задержку воспроизведения.
Необходимый
Определите , что получатель выполняет буферизацию через несколько секунд, отобразив счетчик буферизации. Подождите несколько секунд, чтобы указать буферизацию, чтобы предотвратить слишком частое появление счетчика буферизации при плохих условиях сети.
Лучшие практики
Определите, какой контент находится в буферизации, если буферизация продолжается через 5 секунд.
Андроид
Отправитель указывает на буферизацию получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-control-elements3.gif?authuser=7&hl=ru)
Буферизация содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=7&hl=ru)
iOS
Отправитель указывает на буферизацию получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-control-elements3.gif?authuser=7&hl=ru)
Буферизация содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=7&hl=ru)
Хром
Отправитель указывает на буферизацию получателя
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-control-elements3.gif?authuser=7&hl=ru)
Буферизация содержимого приемника
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-buffer1_a.gif?authuser=7&hl=ru)
Ресивер прекращает трансляцию
Когда воспроизведение останавливается или истекает время ожидания, пользовательский интерфейс получателя должен продвигать другой контент или функции, доступные в приложении-отправителе.
Необходимый
Определите , какое приложение-приемник загружено или находится в режиме ожидания, отображая логотип приложения.
Лучшие практики
- Используйте экран ожидания после воспроизведения, чтобы рекомендовать контент или функции из приложения-отправителя на основе только что транслированного контента.
- Меняйте содержимое экрана ожидания каждые 30–60 секунд, чтобы предотвратить выгорание экрана.
- Отключитесь от приложения-приемника и остановите его работу, если он не используется в течение 5 минут. При остановке появляется главный экран ресивера, что поможет предотвратить выгорание экрана.
Андроид
Приложение отправителя неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states4.png?authuser=7&hl=ru)
Приложение-приемник неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=7&hl=ru)
Отправитель отключен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/a/sender-cast-icon-states2.png?authuser=7&hl=ru)
Трансляция главного экрана
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=7&hl=ru)
iOS
Приложение отправителя неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states4.png?authuser=7&hl=ru)
Приложение-приемник неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=7&hl=ru)
Отправитель отключен
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/i/sender-cast-icon-states2.png?authuser=7&hl=ru)
Трансляция главного экрана
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=7&hl=ru)
Хром
Приложение отправителя неактивно
![Приложение отправителя неактивно](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states4.png?authuser=7&hl=ru)
Приложение-приемник неактивно
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-ui-complete1_a.png?authuser=7&hl=ru)
Отправитель отключен
![Отправитель отключен](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/w/sender-cast-icon-states2.png?authuser=7&hl=ru)
Трансляция главного экрана
![](https://developers-dot-devsite-v2-prod.appspot.com/static/cast/images/r/receiver-home2.png?authuser=7&hl=ru)
Изображения, использованные в этом руководстве по дизайну , любезно предоставлены Blender Foundation и защищены авторским правом или лицензией Creative Commons.
- Мечта слона: (c) авторские права 2006 г., Blender Foundation/Нидерландский институт медиаискусства/www.elephantsdream.org
- Синтел: (c) авторские права Blender Foundation | www.sintel.org
- Слезы стали: (CC) Blender Foundation | mango.blender.org
- Big Buck Bunny: (c) авторские права 2008, Blender Foundation / www.bigbuckbunny.org