Question

我按照说明在html canvas文本字段中加载自定义字体。当我使用桌面Chrome浏览器打开页面时，效果很好，但是当我使用Chromecast接收器应用程序打开页面时，则不会加载字体。可能是什么问题？

定义自定义字体：

<html>
<head>
<style type="text/css">

@font-face {
  font-family: 'myfont';
  src: url('myfont.TTF') ;
}

实际文本：

ctx.font = "30px myfont";
ctx.fillText("MyText:",50, 50);

Answer 1

您可以使用Styled Media Receiver来允许发送者通过在注册过程中提供自己的CSS文件来在Cast设备上播放媒体，而无需创建自己的自定义接收者应用程序。

以下是Pre-installed fonts可以与接收者一起使用的列表：

Droid Sans，无衬线

Droid Sans Mono，等宽

Droid Serif Regular，衬线

单声道

短堆栈

必需品

Alegreya Sans SC

以下是可以在SMR中使用的classes：

.background:接收者的背景。

.logo:接收器启动时显示的徽标。当接收器处于空闲状态并且没有.splash时，也使用此类。   类已声明。

.progressBar:媒体播放的进度条。

.splash:当接收机处于空闲状态时显示的屏幕。如果未声明此类，则接收方将默认为.logo或   应用名称。

.watermark:播放媒体时显示的水印。

Answer 2

问题是使用Drawing text to <canvas> with @font-face does not work at the first time中的解决方案，显然是未加载字体，放置了

<div style="font-family: PressStart;">.</div>

在预加载中使其正常工作。

Chromecast接收器应用程序未显示自定义字体

2 个答案: