福野泰介の一日一創 - create every day

結論、meta viewportからwidthの設定を消せば、スタータスバーを除く画面いっぱいを使ったWebアプリになります。

事の発端は、「iOS6が Single App Mode を搭載で超絶進化!! iOS6で最も恩恵を受けるのは実はエンタープライズ!! | 関西/大阪のiPhone・iPadアプリ開発 feedtailor Inc. 社長ブログ」で紹介されていたiOS6の新機能、iPhone/iPad/iPod touchを専用端末化できてしまう、アクセスガイド(設定、一般、アクセシビリティ、アクセスガイド)、通称 Single App Mode 機能。この機能を使うとそのiPhoneなどが、指定した1つのアプリのみ使える状態になるので・・・

・小さい子供が不用意にホームボタン押してしまうのを防げる
・子供に使わせたくない機能を使わせないようにすることができる
・iPhoneなどを専用端末化できる(注文システム、受付システム、その他業務システムもろもろ・・・)

と、利用シーンが大きく広がります!(ホームアプリを入れ替えできるAndroid並に!)

ただ早速、apple-mobile-web-app-capableを使った、Webアプリの実験を思って作ってみたのですが、このように隙間が空いてしまいます。ワイド化する前のiPhone/iPod touchとの互換性のためだと思われますが、解除の仕方が分かりません。



Apple公式情報にも記述なし
Safari Web Content Guide: Configuring Web Applications

とりあえず情報待ちかと思っていたら、「iPhone 5やiOS 6端末でGoogleマップのWebアプリをフルスクリーン表示する方法 - もとまか日記」を試すとなんとフルスクリーン化できている!希望が見えたので、いろいろ調べた結果、冒頭でのviewportのwidthを突き止めた、というわけでした。

めでたしめでたし!

惜しいのは、この Single App Mode から抜けるためのパスワードがわずか4桁の数字であるところ。
ここはぜひ、パスワードの自由入力を可能にしてほしい。(でないと、大人数から使われるシーンでは使いづらい)

PR: 一日一創、269コ目のWebアプリを公開しました!

Tweet
クリエイティブ・コモンズ・ライセンス
この作品は「Creative Commons — CC BY 4.0」の下に提供されています。
CC BY 福野泰介 - Taisuke Fukuno / @taisukef / アイコン画像 / プロフィール画像