Penerima Media Bergaya (SMR) memungkinkan aplikasi pengirim memutar media di perangkat Transmisi tanpa membuat aplikasi penerima kustom Anda sendiri. Anda dapat menyesuaikan skema warna dan branding SMR dengan memberikan file CSS Anda sendiri selama pendaftaran.
Pendaftaran
Untuk menggunakan SMR bagi aplikasi, pilih opsi Penerima Media Bergaya saat menambahkan aplikasi baru di Konsol Developer Google Cast SDK. Lihat Pendaftaran untuk mengetahui informasi selengkapnya. Opsi ini menyertakan link ke Preview sheet gaya default serta kolom tempat Anda memasukkan URL ke style sheet. Anda dapat menggunakan gaya default atau memberikan URL HTTPS ke file CSS. Anda dapat menggunakan server Anda sendiri untuk menghosting file CSS. Setelah memberikan URL ke file CSS, Anda dapat mengklik Pratinjau untuk melihat tampilan gaya Anda di penerima.
Media yang didukung
Semua penerima mendukung jenis media, seperti yang dijelaskan di Media yang Didukung.
SMR mendukung video, audio, dan gambar, serta dikontrol dari aplikasi pengirim menggunakan saluran media Cast SDK. SMR sepenuhnya mematuhi Panduan UX untuk pemutaran media di perangkat Cast.
Jenis font
Lihat Font bawaan untuk melihat daftar font yang telah diinstal sebelumnya dengan penerima.
CSS
Penerima Media Bergaya menggunakan class CSS berikut:
- .background: Latar belakang untuk penerima.
- .logo: Logo yang ditampilkan saat penerima diluncurkan. Class ini juga digunakan saat penerima dalam status tidak ada aktivitas dan tidak ada class .splash yang dideklarasikan.
- .progressBar: Status progres untuk pemutaran media.
- .splash: Layar yang ditampilkan saat penerima dalam status tidak ada aktivitas. Jika class ini tidak dideklarasikan, penerima akan secara default menggunakan .logo atau nama aplikasi.
- .watermark: Watermark yang ditampilkan saat media diputar.
Berikut adalah contoh file CSS yang menggunakan class ini:
.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;
}
Berikut adalah beberapa ilustrasi class ini yang digunakan.
Video
Catatan: Gambar video berukuran 96x143 piksel dan resource gambar pertama yang terkait dengan metadata media dipilih untuk ditampilkan. Gambar diskalakan agar sesuai dengan dimensi yang diharapkan.
Audio
Catatan: Sampul album audio berukuran 384x384 piksel dan resource gambar pertama yang terkait dengan metadata media dipilih untuk ditampilkan. Gambar diskalakan agar sesuai dengan dimensi yang diharapkan.
Gambar dari Big Buck Bunny: (c) hak cipta 2008, Blender Foundation / www.bigbuckbunny.org
Gambar dari Sintel: (c) hak cipta Blender Foundation / www.sintel.org