プログレッシブウェブのスプラッシュ画面にロゴが表示されない

Question

これらのデモでは、スプラッシュ画面にロゴが表示されます。

https://addyosmani.com/blog/getting-started-with-progressive-web-apps/

私は私が私のマニフェストに間違ってやっているかわからない - 私はアイコンを持っているが、それは私のスプラッシュ画面上に表示されていません。

私のマニフェストは次のようになります。

{ 
    "short_name": "Weather Service", 
    "name": "Weather Service", 
    "icons": [ 
    { 
     "src": "logo.png", 
     "sizes": "144x144", 
     "type": "image/png" 
    } 
    ], 
    "start_url": "index.html", 
    "display": "standalone", 
    "orientation": "portrait", 
"background_color": "#FAFAFA", 
    "theme_color": "#512DA8" 
} 

は、スプラッシュ画面に表示するために、私は1枚の以上の画像が必要ですか？

Answer 1

PWAは、あなたが常に表示されるアイコンは、48dpは、あなたが取る場合は、我々が表示されます最小画像サイズは、であることを考えるようにしたい場合は最小

として192pxに置かアイコンをなかれすることをお勧めです現在サポートされている最大濃度表示（4x）、次に48 * 4 = 192pxです。これは、私たちが192pxの画像を必要とするので、幸運です。わーい。したがって、私は常に最小サイズのアイコンとして192pxを持つことをお勧めし、256px、384px、および512pxで3つの他のバージョンを作成します。ただし、ユーザーがスプラッシュ画面、特に低密度デバイスでデータを大量にダウンロードしないようにするには、低くするとChromeが最も適切なイメージを取得しようとします。

https://developers.google.com/web/updates/2015/10/splashscreen