我一直在研究科尔多瓦应用程序,我已经用三星SM-J700P进行了测试.
我的材料图标的设置基本是这样的：
HTML –
<div id="alarm"><i class="material-icons">add_alert</i></div>
CSS –
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src:
url(./path/to/MaterialIcons-Regular.woff2) format(woff2),url(./path/to/MaterialIcons-Regular.woff) format(woff);
}
我的材质图标包本地保存在我的项目中,所以它不会有任何问题的图标.这一直在为这款手机的整个测试工作,直到几天前,我收到了我的SM-J700P的更新.之后,我的图标都没有出现了.目前手机上的软件版本是：J700PVPS1AQD1.
因为Cordova默认是Android上的chrome窗口,所以我只需要使用woff2包的图标,所以我怀疑是这个问题.当我运行程序时,我的Android Studio控制台中也有一个奇怪的错误.
E/libEGL: validate_display:225 error 3008 (EGL_BAD_DISPLAY) I/OpenGLRenderer: Initialized EGL,version 1.4 W/AudioCapabilities: Unsupported mime audio/mpeg-L1 W/AudioCapabilities: Unsupported mime audio/mpeg-L2 //... Lots more Unsupported mime types which I don't understand... E/chromium: [ERROR:interface_registry.cc(104)] Failed to locate a binder for interface: autofill::mojom::PasswordManagerDriver More unsupported mime types...
我不知道控制台中的错误有多少,但是自更新以来它们也是新的.其余的应用程序工作正常,这些错误都不会崩溃,它只会不再显示材料图标.
有任何想法吗？
编辑：更多信息.如果我只是在自己的Chrome浏览器中显示html文件,图标就会正常显示.所以似乎也许这是科尔多瓦的一个问题.我也用三星S7 Edge测试了这个应用程序,它也不会显示图标,因此它似乎不符合手机.
解决方法
答案并不奇怪,简单.在CSS中,我忘记了引号.
所以：
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src:
url(../Path/To/MaterialIcons-Regular.woff2) format (woff2);
}
本来应该：
@font-face {
font-family: 'Material Icons';
font-style: normal;
font-weight: 400;
src:
local('Material Icons'),local('MaterialIcons-Regular'),url(../Path/To/MaterialIcons-Regular.woff2) format ('woff2');
}
这是根据Google文档here
