2016/03/16

[JavaScript][android]Web App Manifest in Chrome for Android

デベロッパー向け日本語 YouTube チャンネル "Google Developers Japan" のご紹介というエントリーで紹介されていた

の動画を見て
Web App Manifest in Chrome for Android
の確認を行いました。

どうやらhttpsではなくhttp環境下でもおkみたいで基本的なテンプレートは以下のようになります。

{
  "name": "hoge",
  "short_name": "foo",
  "start_url": "./?utm_source=web_app_manifest",
  "display": "standalone",
  "icons": [{
    "src": "images/touch/homescreen48.png",
    "sizes": "48x48",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen72.png",
    "sizes": "72x72",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen96.png",
    "sizes": "96x96",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen144.png",
    "sizes": "144x144",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen168.png",
    "sizes": "168x168",
    "type": "image/png"
  }, {
    "src": "images/touch/homescreen192.png",
    "sizes": "192x192",
    "type": "image/png"
  }]
}
displayパラメータは
fullscreen
standalone
minimal-ui
browser
の4つがある。

androidのchrome 42から適用できるみたいなので、結構、いい感じ。

htmlには
<link rel="manifest" href="/manifest.json">
という形で、上で記述した内容を「manifest.linkタグに記述すればおk

0 コメント:

コメントを投稿