Стилизованный медиа-приемник (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