Интеллектуальные дисплеи — это устройства с сенсорными функциями, которые позволяют приложениям веб-приемника поддерживать сенсорные элементы управления. Пакет SDK для веб-приемника предоставляет пользовательский интерфейс по умолчанию с дополнительной настройкой элементов управления проигрывателя.
В этом руководстве объясняется, как оптимизировать приложение Web Receiver при запуске на интеллектуальных дисплеях и как настроить элементы управления проигрывателем.
Доступ к элементам управления пользовательского интерфейса
Доступ к объекту UI Controls можно получить с помощью следующего кода:
const controls = cast.framework.ui.Controls.getInstance();
Если вы не используете элемент cast-media-player
, вам необходимо установить для свойства touchScreenOptimizedApp
значение true
в UiConfig
в разделе CastReceiverOptions
.
context.start({
uiConfig: {
touchScreenOptimizedApp: true
}
});
Пользовательский интерфейс видео по умолчанию
Кнопки управления по умолчанию назначаются каждому слоту на основе MetadataType
и MediaStatus.supportedMediaCommands
.
MetadataType.Movie, MetadataType.Generic
B. MovieMediaMetadata.subtitle
или GenericMediaMetadata.subtitle
.
C. MovieMediaMetadata.title
или GenericMediaMetadata.title
.
F. ControlsSlot.SLOT_SECONDARY_1
G. ControlsSlot.SLOT_PRIMARY_1
H. Воспроизведение/Пауза
I. ControlsSlot.SLOT_PRIMARY_2
J. ControlsSlot.SLOT_SECONDARY_2
Когда значение supportedMediaCommands
равно ALL_BASIC_MEDIA
, макет элемента управления по умолчанию будет отображаться, как показано ниже:
Когда значение supportedMediaCommands
равно ALL_BASIC_MEDIA | QUEUE_PREV | QUEUE_NEXT
, макет элемента управления по умолчанию будет отображаться, как показано ниже:
Когда значение supportedMediaCommands
равно PAUSE | QUEUE_PREV | QUEUE_NEXT
, макет элемента управления по умолчанию будет отображаться, как показано ниже:
Когда текстовые дорожки доступны, кнопка субтитров всегда будет отображаться на SLOT_SECONDARY_1
.
Чтобы динамически изменить значение supportedMediaCommands
после запуска контекста приемника, вы можете вызвать PlayerManager.setSupportedMediaCommands
, чтобы переопределить значение. Кроме того, вы можете добавить новую команду с помощью addSupportedMediaCommands
или удалить существующую команду с помощью removeSupportedMediaCommands
.
Звуковой интерфейс по умолчанию
Тип метаданных.MUSIC_TRACK
B. MusicTrackMediaMetadata.albumName
C. MusicTrackMediaMetadata.title
D. MusicTrackMediaMetadata.albumArtist
, MusicTrackMediaMetadata.artist
или MusicTrackMediaMetadata.composer
E. MusicTrackMediaMetadata.images[0]
H. ControlsSlot.SLOT_SECONDARY_1
I. ControlsSlot.SLOT_PRIMARY_1
J. Воспроизведение/Пауза
K. ControlsSlot.SLOT_PRIMARY_2
L. ControlsSlot.SLOT_SECONDARY_2
Когда значение supportedMediaCommands
равно ALL_BASIC_MEDIA
, макет элемента управления по умолчанию будет отображаться, как показано ниже:
Когда значение supportedMediaCommands
равно ALL_BASIC_MEDIA | QUEUE_PREV | QUEUE_NEXT
, макет элемента управления по умолчанию будет отображаться, как показано ниже:
Чтобы динамически изменить значение supportedMediaCommands
медиакоманд после запуска контекста веб-приемника, вы можете вызвать PlayerManager.setSupportedMediaCommands
, чтобы переопределить это значение. Кроме того, вы можете добавлять новые команды с помощью addSupportedMediaCommands
или удалять существующие команды с помощью removeSupportedMediaCommands
.
Настройка макета кнопки управления пользовательского интерфейса
Использование пользовательского макета, если вы хотите изменить кнопки в элементах управления пользовательского интерфейса.
const controls = cast.framework.ui.Controls.getInstance();
controls.clearDefaultSlotAssignments();
Затем вы можете назначить кнопки управления 4 слотам, вызвав assignButton
.
controls.assignButton(
cast.framework.ui.ControlsSlot.SLOT_SECONDARY_1,
cast.framework.ui.ControlsButton.LIKE
)
controls.assignButton(
cast.framework.ui.ControlsSlot.SLOT_SECONDARY_2,
cast.framework.ui.ControlsButton.DISLIKE
)
И пользовательский макет будет отображаться, как показано ниже:
Если назначенная кнопка не поддерживается в MediaStatus.supportedMediaCommands
, она отображается серым цветом. Например, если supportedMediaCommands
MediaCommands равны ALL_BASIC_MEDIA | QUEUE_NEXT | LIKE | DISLIKE
, то кнопка QUEUE_PREV
будет отключена.
Чтобы динамически изменить значение supportedMediaCommands
медиакоманд после запуска контекста веб-приемника, вы можете вызвать PlayerManager.setSupportedMediaCommands
, чтобы переопределить это значение. Кроме того, вы можете добавлять новые команды с помощью addSupportedMediaCommands
или удалять существующие команды с помощью removeSupportedMediaCommands
.
Вторичное изображение
Вторичное изображение предоставляет разработчикам Cast возможность добавлять информационное изображение в пользовательский интерфейс для аудио- и видеоприложений, например, для отображения логотипов местных каналов или формата мультимедиа. Эта новая функциональность предоставляется с очень небольшими накладными расходами при сохранении согласованного пользовательского интерфейса на разных платформах отображения Cast: Chromecast, интеллектуальных дисплеях и Chromecast с Google TV.