Question

我的应用程序不适合在iPad上以纵向模式使用（我以不同的方式处理其他移动设备）。我需要向用户显示一条消息，将他们的设备旋转到横向，以便使用该应用程序。

Answer 1

控制器/ application.js中

isPortrait: false,

handlePortrait: function() {
  const mql = window.matchMedia("(orientation: portrait)");

  if (!isMobile.apple.tablet) {
    return;
  }

  if (mql.matches) {
    this.set('isPortrait', true);
  } else {
    this.set('isPortrait', false);
  }

  mql.addListener((m) => {
    if (m.matches) {
      this.set('isPortrait', true);
    }
    else {
      this.set('isPortrait', false);
    }
  });
}.on('init'),

application.hbs

{{#if isPortrait}}
  <div class="text-center">
    <i class="fa fa-refresh fa-5x text-muted" aria-hidden="true"></i>
  </div>
  <h2 class="text-center">Please rotate your device</h2>
  <h4 class="text-center text-muted">This app needs more horizontal space than is available in portrait orientation</h4>
{{else}}
    <!-- your normal template code here -->
{{/if}}

强制Web应用程序访问者在iPad上使用横向模式

1 个答案: