最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - PWA - Forcing orientation to landscape not working - Stack Overflow

programmeradmin10浏览0评论

We have a PWA on an Ipad where the manifest file specificy indicates it should be run on landscape mode, however I can still rotate the screen on the app.

Here is my manifest file

  "name": "App",
  "short_name": "App",
  "theme_color": "rgba(33,150,243,0)",
  "background_color": "rgba(33,150,243,0)",
  "display": "standalone",
  "orientation": "landscape",
  "Scope": "/",
  "start_url": "/",
  "prefer_related_application" : false,
  "icons": [
    {
      "src": "images/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    }
  ],
  "splash_pages": null
}

As you can see "orientation": "landscape", is set, but it is not behaving that way. Any idea how to force it in a PWA?

We have a PWA on an Ipad where the manifest file specificy indicates it should be run on landscape mode, however I can still rotate the screen on the app.

Here is my manifest file

  "name": "App",
  "short_name": "App",
  "theme_color": "rgba(33,150,243,0)",
  "background_color": "rgba(33,150,243,0)",
  "display": "standalone",
  "orientation": "landscape",
  "Scope": "/",
  "start_url": "/",
  "prefer_related_application" : false,
  "icons": [
    {
      "src": "images/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    }
  ],
  "splash_pages": null
}

As you can see "orientation": "landscape", is set, but it is not behaving that way. Any idea how to force it in a PWA?

Share Improve this question asked Jan 13, 2020 at 22:22 S_WS_W 3395 silver badges14 bronze badges 1
  • Perhaps iOS Safari hasn't support for orientation in manifest.json. Did you try on other browser? – brendan Commented Jan 15, 2020 at 3:08
Add a ment  | 

1 Answer 1

Reset to default 6

As of today April 2020, the latest iOS Safari (iOS 13) has only partial support for manifest files.

And orientation does not seem supported. It will work on Android though.

You could have a look at this question for some details and workarounds.

发布评论

评论列表(0)

  1. 暂无评论