Установите заголовок окна и значок PWA - PullRequest
1 голос
/ 06 ноября 2019

Я превращаю свой веб-сайт в PWA и прошел процедуру, чтобы сделать его загружаемым с собственным значком на главном экране.

Однако я не могу найти никакой документации о том, как установить заголовок окна. и значок, поскольку он в настоящее время является значком Chrome и называется Application .... Возможно ли это, и если да, то как мне этого добиться?


Манифест приложения:

{
  "name": "AppName",
  "short_name": "AppName",
  "lang": "en-US",
  "start_url": "/",
  "display": "standalone",
  "background_color": "white",
  "theme_color": "black",
  "icons": [{
    "src": "../content/themes/AppName/images/fuzz.png",
      "sizes": "512x512",
      "type": "image/png"
    }]
}

Окно приложения (содержимое окна удалено для конфиденциальности ) в Android:

image

1 Ответ

1 голос
/ 06 ноября 2019

В некоторых дистрибутивах Android имя и значок PWA не отображаются в переключателе приложений, вы можете обратиться к исправному PWA, чтобы проверить, является ли ваш дистрибутив одним из них.

Пример манифеста из Airhorner :

{
  "name": "The Air Horner",
  "short_name": "Airhorner",
  "description": "The world's best airhorner, and it's free",
  "icons": [
      {
        "src": "/images/touch/android-launchericon-48-48.png",
        "type": "image/png",
        "sizes": "48x48"
      }, 

      {
        "src": "/images/touch/android-launchericon-72-72.png",
        "type": "image/png",
        "sizes": "72x72"
      }, 
      {
        "src": "/images/touch/android-launchericon-96-96.png",
        "type": "image/png",
        "sizes": "96x96"
      }, 
      {
        "src": "/images/touch/android-launchericon-144-144.png",
        "type": "image/png",
        "sizes": "144x144"
      }, 
      {
        "src": "/images/touch/android-launchericon-192-192.png",
        "type": "image/png",
        "sizes": "192x192"
      }, 
      {
        "src": "/images/touch/android-launchericon-512-512.png",
        "type": "image/png",
        "sizes": "512x512"
      } 
      ],
  "start_url": "/?homescreen=1",
  "scope": "/",
  "display": "standalone",
  "background_color": "#2196F3",
  "theme_color": "#2196F3"
}

Результат на панели запуска Pixel: enter image description here

...