PhoneGap + jQuery Mobile + iOS SDK7で起きるステータスバー問題に対応する

PhoneGap + jQuery MobileでiOSアプリを作るというのは、それをどれだけ本気でやるかという違いはあるとしても、それなりに行われているのではないかと思います。
当社（アルティザンエッジ合同会社）においては、それがいま、メインの仕事となっていて、それを始めて9か月になったりします。

昨日、iOS7が正式リリースとなりました。私のiPhoneにも導入し、それと合わせてMacのXcodeの方もXcode5としてiOS SDK7を入れました。

その環境で、既存（PhoneGap 2.5 + jQuery Mobile 1.3.0ベース。ちょっと古いですね）のアプリをコンパイルしてみると・・・。

あれ？ステータスバーをアプリのナビゲーションバーが隠してしまっている。

iOS SDK6でコンパイルしたアプリをiOS7で動作させても、このような現象にはならないので、これはiOS SDK7 + iOS7特有の現象なわけですが、それというのは、iOS7からOS側で出しているステータスバーと、アプリ側で出しているナビゲーションバーが一体化したからなのですね。（例えば、iOS7でEvernoteの最新版アプリを動かしたりすると、ステータスバーが緑色になってナビゲーションバーと一体化したりします。）

PhoneGapはまだiOS7に正式対応していないこともあって、この辺の制御が上手く出来ないのではないかと思います（ちなみに、最新版であるPhoneGap 3.0を使っても同様の現象になりました。）。もしくは、jQUery Mobile側なのかなぁ・・・。

で、当面の解決策としては以下のようなコードをPhoneGap自体に入れてしまうことです。

修正するのは、ConrdovaLib.xcodeproj内にある、Classes/Cleaver/CDVViewController.mです。

- (void)createGapView
{
  CGRect webViewBounds = self.view.bounds;

  webViewBounds.origin = self.view.bounds.origin;

  //ここから追記
  NSString *currentSystemVersion = [[UIDevice currentDevice] systemVersion];
  if ([currentSystemVersion floatValue] >= 7.0f) {
    webViewBounds.origin.y += 20;
    webViewBounds.size.height -= 20;
  }
（後略）

単純にステータスバーの分のoriginを下にやって、高さを狭めるだけです。
iOS6以前に問題が出ないように、バージョン判定を入れておきます。

すると・・・

見事。ステータスバーが隠れないように、ナビゲーションバーが下に降りました。

ステータスバーとナビゲーションバーの一体化というiOS7の特徴を無視するような解決策なので、あくまで暫定案かなとは思いますが、簡単に対応できるので、まずはこれで切り抜けられるのではないかと思います。