樣式化媒體接收器

樣式式媒體接收器 (SMR) 可讓您的傳送端應用程式在投放裝置上播放媒體，而無需建立自訂接收端應用程式。只要在註冊時提供自己的 CSS 檔案，即可自訂 SMR 色彩配置與品牌宣傳。

註冊

如要為您的應用程式使用 SMR，請在 Google Cast SDK Developer Console 中新增應用程式，選取 Styled Media Receiver 選項。詳情請參閱註冊一文。這個選項包含 [預覽] 預設樣式表的連結，以及輸入樣式表的網址的欄位。您可以使用預設樣式，也可以提供 CSS 檔案的 HTTPS 網址。您可以使用自己的伺服器託管 CSS 檔案。提供 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