CAF接收器定制

Question

我正在尝试自定义CAF接收器的缓冲UI（https://github.com/googlecast/BasicReceiverCAF）。

现在我只是在屏幕左下角有一个黑屏和一个小进度条，就像从这里https://developers.google.com/cast/docs/design_checklist/receiver#receiver-ui-buffer，但没有预览图片。

我的问题是，如何设置此预览而不是黑色背景？

我试过了：

 let playerElement = document.getElementById('player');
 playerElement.style
    .setProperty('--buffering-image', 'url("/img/megacast-placeholder.jpg")'); 

但是此代码会影响进度条控件，它会替换图像上的响铃。另外，我尝试了其他属性https://developers.google.com/cast/docs/caf_receiver_features

请帮忙， 提前谢谢。

Answer 1

  

- 防溅图像

是您应该使用的属性。如果由于某种原因不能使用：

playerElement.style.setProperty('--splash-image', 'url("../img/megacast-placeholder.jpg")'); 

尝试添加包含

的单独样式标记

#player {
  --splash-image: url("../img/megacast-placeholder.jpg"); 
}