Разработчики трансляции могут добавлять информационное (дополнительное) изображение в пользовательский интерфейс для аудио- и видеоприложений. Просмотрите поддерживаемые форматы изображений для совместимости.
Дополнительное изображение появляется в правом верхнем углу дисплея и может использоваться для отображения графического изображения с дополнительной информацией о воспроизводимом в данный момент контенте, такой как формат контента, позывной радиостанции или рейтинг телешоу. Вторичное изображение остается на экране до тех пор, пока эта функция включена для текущего содержимого и проигрыватель не находится в состоянии ожидания.
В таблице 1 показано взаимодействие с пользователем, когда эта функция включена на соответствующих типах устройств и элементах управления. Детали реализации и интеграции немного различаются между аудио- и видеоприложениями. См. разделы ниже для интеграции этой функции в ваше приложение Web Receiver.
| Тип устройства | Аудиоконтент | Видеоконтент |
|---|---|---|
| Chromecast |  |  |
| Chromecast с Google TV |  |  |
| Умный дисплей |  |  |
| Дистанционное управление интеллектуальным дисплеем |  | Примечание. Дополнительное изображение не поддерживается на пультах дистанционного управления для видеоконтента. |
Аудио
Обзор
Вторичное изображение для аудиоконтента управляется метаданными загруженного контента. После загрузки элемента мультимедиа любые последующие изменения свойства secondaryImage изображения метаданных отражаются в пользовательском интерфейсе.
Если интеллектуальный дисплей используется в качестве пульта дистанционного управления для аудио, вторичное изображение также будет отображаться в пользовательском интерфейсе интеллектуального дисплея, если установлено.
Реализация
Чтобы установить, удалить или обновить secondaryImage изображение, необходимо изменить свойствоsecondaryImage объекта MusicTrackMediaMetadata . Свойство принимает объект Image , заполненный URL-адресом, описывающим, где размещено вторичное изображение.
В приведенном ниже примере вторичное изображение установлено в перехватчике load . Когда проигрыватель заканчивает загрузку контента, отображается вторичное изображение.
const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
playerManager.setMessageInterceptor(
cast.framework.messages.MessageType.LOAD, loadRequestData => {
loadRequestData.media.metadata =
new cast.framework.messages.MusicTrackMediaMetadata();
// Set image on secondaryImage field of metadata object
loadRequestData.media.metadata.secondaryImage =
new cast.framework.messages.Image('https://www.image.png');
return loadRequestData;
});
Чтобы обновить вторичное изображение во время воспроизведения, приложение должно использовать PlayerManager для получения MediaInformation , вызвав getMediaInformation . Затем приложение должно изменить metadata , обновив свойство secondaryImage до нужного значения. Наконец, вызов setMediaInformation с новой информацией обновит пользовательский интерфейс. Этот метод можно использовать для обработки изменений в метаданных, предоставленных посредством обновлений, таких как EMSG или ID3 во время воспроизведения.
const context = cast.framework.CastReceiverContext.getInstance();
const playerManager = context.getPlayerManager();
playerManager.addEventListener(cast.framework.events.EventType.EMSG, () => {
let mediaInformation = playerManager.getMediaInformation();
mediaInformation.metadata.secondaryImage =
new cast.framework.messages.Image('http://anotherimage.png');
playerManager.setMediaInformation(mediaInformation);
});
Чтобы отключить secondaryImage изображение, задайте для свойстваsecondaryImage значение null в объекте метаданных.
// To unset the secondary image, set secondaryImage to null.
let mediaInformation = playerManager.getMediaInformation();
mediaInformation.metadata.secondaryImage = null;
playerManager.setMediaInformation(mediaInformation);
видео
Обзор
Для видеоконтента вторичное изображение устанавливается и удаляется с помощью UiManager . Вторичное изображение отображается с наложением элементов управления видео.
Реализация
Чтобы установить вторичное изображение, приложение должно получить экземпляр UiManager и вызвать setSecondaryImage . Он принимает два параметра: SecondaryImagePosition и URL-адрес изображения. Настроить вторичное изображение можно в любое время, но оно будет отображаться только тогда, когда пользователь запускает наложение на передний план.
/**
* Sets the image url for the secondary image overlay. Replaces any image that
* was previously set.
*/
castUiManager.setSecondaryImage(
cast.framework.ui.SecondaryImagePosition.TOP_RIGHT_VIDEO_OVERLAY,
'http://www.image.png');
Удаление вторичного изображения выполняется путем установки URL-адреса изображения равным null или пустой строке.
// To clear out the image, set the url to null or an empty string.
const castUiManager = cast.framework.ui.UiManager.getInstance();
castUiManager.setSecondaryImage(
cast.framework.ui.SecondaryImagePosition.TOP_RIGHT_VIDEO_OVERLAY, null);
Следующие шаги
На этом функции, которые вы можете добавить в свой веб-приемник, заканчиваются. Теперь вы можете создать приложение-отправитель на iOS , Android или в Интернете .