Titanium 3.4.0 beta で iPhone 6 / iPhone 6 Plus の画面サイズに仮対応する #TitaniumJP

## DEPRECATED (2014/09/17)

この記事は既に過去の情報となりました。 [Titanium SDK 3.4.0 Beta の配布ページ](http://www.appcelerator.com/blog/2014/09/titanium-sdk-3-4-0-beta-for-ios-8-now-available/)が更新されており、 **3.4.0.v20140916181713** では既に iPhone 6 / iPhone 6 Plus の画面サイズに対応しています。このバージョンの SDK でプロジェクトを生成すると `PROJECT_ROOT/Resources/iphone` ディレクトリの中には iPhone 6 / iPhone 6 Plus に対応するスプラッシュスクリーンが設置されています。

### Titanium CLI 3.4.0 RC と Titanium SDK 3.4.0 Beta のインストール

```text:インストール
$ npm install -g titanium@3.4.0-rc4
$ titanium sdk install http://builds.appcelerator.com/mobile/3_4_X/mobilesdk-3.4.0.v20140916181713-osx.zip
$ titanium sdk select 3.4.0.v20140916181713
$ titanium
Titanium Command-Line Interface, CLI version 3.4.0-rc4, Titanium SDK version 3.4.0.v20140916181713
Copyright (c) 2012-2014, Appcelerator, Inc.  All Rights Reserved.
………
```

## はじめに

先日 iPhone 6 / iPhone 6 Plus が発表され、縦横比は iPhone 5 シリーズと同じながらも解像度が変わることが分かりました。 iPhone 6 Plus に関しては [1242 × 2208 という内部解像度を 1 / 1.15 にダウンスケールする](http://www.paintcodeapp.com/news/iphone-6-screens-demystified)ことで 1080p のディスプレイに映し出すようで、ついに Dot by Dot の表示から脱却することになりました。

さて、 Titanium アプリでは iPhone 5 登場時、 `Default-568h@2x.png` というファイルを `PROJECT_ROOT/Resources/iphone` に設置することで縦長になった画面サイズに対応させることができました。では、 iPhone 6 / iPhone 6 Plus ではどうしたら良いのでしょうか。

## tiapp.xml + 画像の配置で仮対応

[Titanium 3.4.0 beta](http://www.appcelerator.com/blog/2014/09/titanium-sdk-3-4-0-beta-for-ios-8-now-available/) は iOS 8 対応をうたっていますが、まだ iPhone 6 / iPhone 6 Plus の画面解像度には対応していません。アプリを iPhone 5 シリーズに対応させている場合は縦横比が同じなので、 iPhone 6 / iPhone 6 Plus の解像度に「引き延ばされて」表示されました。

既に [Appcelerator の JIRA](https://jira.appcelerator.org/browse/TIMOB-17663) には対応のためのチケットが切られていますので、遅かれ早かれ対応されると思いますが、 3.4.0.GA が出ていない状態で 3.5.0 で直す予定になっているため、既に Titanium 製の iOS アプリをマーケットにリリースしていて、 iPhone 6 / iPhone 6 Plus の解像度表示に対応させたい場合、これを待つのは辛いでしょう。特に受託開発で Titanium を使っているとしたら、大変もどかしいのではないかと思います。

そこで、 tiapp.xml の編集と、画像の配置で仮対応してみましょう。 Titanium 3.4.0 beta でプロジェクトを作ると tiapp.xml 中には `ios` タグのセクションがあります。

```xml:tiapp.xml
<ios>
    <plist>
        <dict>
            <!-- 略 -->
        </dict>
    </plist>
</ios>
```

dict セクション中に以下のタグを追記します。

```xml:tiapp.xmlへの追記要素
<key>UILaunchImages</key>
<array>
    <dict>
        <key>UILaunchImageMinimumOSVersion</key>
        <string>8.0</string>
        <key>UILaunchImageName</key>
        <string>Default-667h</string>
        <key>UILaunchImageOrientation</key>
        <string>Portrait</string>
        <key>UILaunchImageSize</key>
        <string>{375, 667}</string>
    </dict>
    <dict>
        <key>UILaunchImageMinimumOSVersion</key>
        <string>8.0</string>
        <key>UILaunchImageName</key>
        <string>Default-736h</string>
        <key>UILaunchImageOrientation</key>
        <string>Portrait</string>
        <key>UILaunchImageSize</key>
        <string>{414, 736}</string>
    </dict>
</array>
```

次に画像を2つ用意します。用意する画像のファイル名は、

- `Default-667h@2x.png`
- `Default-736h@3x.png`

です。これらの画像を `PROJECT_ROOT/Resources/iphone` ディレクトリの中に入れます。これで仮対応完了です。一応、 Xcode 6 GM 上の iPhone 6 / iPhone 6 Plus のシミュレータで起動してみる限り、 iPhone 6 / iPhone 6 Plus の表示解像度に対応した状態でアプリが起動します。引き延ばされていないので、文字や UI ウィジェット類は綺麗に表示されます。

### 注意事項

今回の方法は[昔、私のブログで書いた方法](http://ryugoo.hateblo.jp/entry/2013/10/30/162358)の流用なのですが、この方法には1つ欠点があって、 Titanium がデフォルトで使用する `Default.png` のスプラッシュスクリーンが一瞬チラッと見えてしまうのです。具体的には tiapp.xml で使うように指定した画像がスプラッシュスクリーンとして表示されるのですが、その裏では `Default.png` も表示されているようで、スプラッシュスクリーンが消える瞬間に `Default.png` も見えてしまいます。

これは非常にかっこ悪いので、今回のワークアラウンドを実施する場合には、単色のスプラッシュスクリーン (真っ白とか真っ黒とか) でだけ行った方が良いでしょう。

### おまけ

今回使った iPhone 6 / iPhone 6 Plus 用のスプラッシュスクリーン画像です。

| iPhone 6 | iPhone 6 Plus |
|:------------:|:------------:|
| ![Default-667h@2x.png](https://qiita-image-store.s3.amazonaws.com/0/5036/1a6ee5be-f169-8fbb-2f2e-e3a79ce8969b.png) | ![Default-736h@3x.png](https://qiita-image-store.s3.amazonaws.com/0/5036/6b947964-2a91-b2ac-848f-3d68ec902e80.png) |