Maskable 图标与安全区域

不同的 Android launcher 使用不同的图标形状。为了保持一致，Android 会拿你的图标裁剪成设备所用的任意形状。一个 logo 靠近边缘的标准图标会丢掉边角，一个透明背景的图标会出现难看的裁剪线。

maskable 图标就是为这种裁剪打造的。它用背景填满整个画布，所以没有透明区域，并且把所有重要内容都远离可能被切掉的边缘。

规则很简单：把关键画面保持在内圆之内，大约是画布中央 80% 的范围。在一个 512x512 的图标上，那是一个直径约 410 像素的居中圆。圆外的任何东西都可能被裁掉。

外圈是出血区。它应当只有背景，没有 logo、没有文字、没有任何你舍不得丢掉的边缘。因为你不知道某个设备会用哪种形状，所以要这样设计：无论最终是圆形、squircle 还是圆角方形，图标都能正确呈现。

{
  "icons": [
    {
      "src": "/icon-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "any"
    },
    {
      "src": "/icon-maskable-512.png",
      "sizes": "512x512",
      "type": "image/png",
      "purpose": "maskable"
    }
  ]
}

purpose 字段告诉 Android 该遮罩哪个图标。在你的标准 any 图标旁边再提供一个 maskable，把两种情况都覆盖。如果一个图标在裁剪和不裁剪下都表现良好，你也可以在这一个图标上设置 "purpose": "any maskable"。