Стилизованный медиа-ресивер

Стилизованный медиа-приемник (SMR) позволяет приложению-отправителю воспроизводить мультимедиа на устройстве Cast без создания собственного приложения-получателя. Вы можете настроить цветовую схему и фирменный стиль SMR, предоставив собственный CSS-файл при регистрации.

Регистрация

Чтобы использовать SMR для своего приложения, выберите параметр «Стилизованный медиаприемник» при добавлении нового приложения в консоль разработчика Google Cast SDK . Дополнительную информацию см. в разделе Регистрация . Этот параметр включает ссылку на предварительный просмотр таблицы стилей по умолчанию, а также поле, в котором вы вводите URL-адрес своей таблицы стилей. Вы можете использовать стили по умолчанию или указать URL-адрес HTTPS для вашего CSS-файла. Вы можете использовать свой собственный сервер для размещения файла CSS. Указав URL-адрес своего CSS-файла, вы можете нажать «Предварительный просмотр» , чтобы увидеть, как ваши стили будут выглядеть на приемнике.

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

Поддерживаемые носители

Все ресиверы поддерживают типы носителей, как описано в разделе «Поддерживаемые носители» .

SMR поддерживает видео, аудио и изображения и управляется из приложения-отправителя с помощью медиаканала Cast SDK. SMR полностью соответствует рекомендациям UX для воспроизведения мультимедиа на устройстве Cast.

Введите шрифты

См. «Предустановленные шрифты» для получения списка шрифтов, предустановленных в ресивере.

CSS

Стилизованный медиаприемник использует следующие классы CSS:

• .background : фон для приемника.
• .logo : логотип, отображаемый при запуске ресивера. Этот класс также используется, когда приемник находится в состоянии ожидания и класс .splash не объявлен.
• .progressBar : индикатор выполнения воспроизведения мультимедиа.
• .splash : Экран, отображаемый, когда приемник находится в состоянии ожидания. Если этот класс не объявлен, получатель по умолчанию будет использовать .logo или имя приложения.
• .watermark : водяной знак, отображаемый при воспроизведении мультимедиа.

Вот пример CSS-файла, в котором используются эти классы:

.background {
  background: center no-repeat url(background.png);
}

.logo {
  background-image: url(logo.png);
}

.progressBar {
  background-color: rgb(238, 255, 65);
}

.splash {
  background-image: url(splash.png);
}

.watermark {
  background-image: url(watermark.png);
  background-size: 57px 57px;
}

Ниже приведены некоторые иллюстрации использования этих классов.

Видео

Примечание . Размер видеоизображения составляет 96x143 пикселей, и для отображения выбирается первый ресурс изображения, связанный с метаданными мультимедиа. Изображения масштабируются в соответствии с ожидаемыми размерами.

Аудио

Примечание . Обложка аудиоальбома имеет размер 384x384 пикселей, и для отображения выбирается первый ресурс изображения, связанный с метаданными мультимедиа. Изображения масштабируются в соответствии с ожидаемыми размерами.

Изображения из Big Buck Bunny: (c) авторские права 2008, Blender Foundation / www.bigbuckbunny.org

Изображение от Sintel: (c) авторские права Blender Foundation / www.sintel.org