PWA支持Android自适应图标

其实就是在 manifest.json 中多声明一行"purpose": "maskable",像这样

{
    "icons": [
        {
            "src": "example.png",
            "sizes": "192x192",
            "type": "image/png",
            "purpose": "maskable"
        }
     ]

支持自适应图标的浏览器就会调用这个

注意遮罩图标与非遮罩图标的边距是不同的,直接使用非遮罩图标可能会导致图标的一部分被裁切掉。这里有一个在线工具,可以调整图标的边距

另外适配各系统的非遮罩图标可以用这个生成

https://www.favicon-generator.org/