清单没有可遮盖式图标
使用集合让一切井井有条
根据您的偏好保存内容并对其进行分类。
可遮罩的图标是一种新的图标格式,可确保 PWA 图标的外观
。新款 Android 设备不支持 PWA 图标
可遮盖式图标格式的背景为白色。使用遮盖时
图标,可确保图标占据 Android 为其提供的所有空间。
Lighthouse 可遮盖图标如何审核失败
灯塔
标记不支持可遮罩图标的网页:
若要通过审核,您需要满足以下条件:
- Web 应用清单必须存在。
- Web 应用清单必须包含
icons
数组。
icons
数组必须包含一个具有 purpose
属性的对象,
并且该 purpose
属性的值必须包含 maskable
。
。
如何为 PWA 添加可遮盖式图标支持
- 使用 Maskable.app Editor 将现有图标转换为可遮罩图标。
将 purpose
属性添加到 Web 应用清单中的某个 icons
对象。
将 purpose
的值设置为 maskable
。请参阅值。
{
…
"icons": [
…
{
"src": "path/to/maskable_icon.png",
"sizes": "196x196",
"type": "image/png",
"purpose": "maskable"
}
]
…
}
使用 Chrome 开发者工具验证可遮盖式图标是否正常显示。
请参阅我当前的图标准备好了吗?
资源
如未另行说明,那么本页面中的内容已根据知识共享署名 4.0 许可获得了许可,并且代码示例已根据 Apache 2.0 许可获得了许可。有关详情,请参阅 Google 开发者网站政策。Java 是 Oracle 和/或其关联公司的注册商标。
最后更新时间 (UTC):2024-04-16。
[[["易于理解","easyToUnderstand","thumb-up"],["解决了我的问题","solvedMyProblem","thumb-up"],["其他","otherUp","thumb-up"]],[["没有我需要的信息","missingTheInformationINeed","thumb-down"],["太复杂/步骤太多","tooComplicatedTooManySteps","thumb-down"],["内容需要更新","outOfDate","thumb-down"],["翻译问题","translationIssue","thumb-down"],["示例/代码问题","samplesCodeIssue","thumb-down"],["其他","otherDown","thumb-down"]],["最后更新时间 (UTC):2024-04-16。"],[],[]]