iPhone6 4.7、5.5inch対応 メモ


既存アプリをiPhone6に対応させる場合のメモです。
Xcode6を使っています。


## 対応にかかる工数

iPhone5 4inch対応ではほとんどAutosizingで対応できたため、あまり手間ではありませんでした。iPhone6、6 Plusは横にも表示領域が拡大しているため、Auto Layoutを使う必要があります。
Auto LayoutはAutosizingよりも複雑なため対応に時間がかかります。アプリのボリュームにもよりますが3日〜2週間程度はかかると思います。

## 対応していないアプリはどうなる？
iPhone6の解像度に最適化されていないアプリは拡大表示されます。
iPhone5と6、6 Plusは縦横の比率(アスペクト比)がほとんど一緒のため、上下に黒い枠は表示されません。

## iPhone6とPlusの解像度

| 機種 |サイズ| 解像度 | ベースとなる解像度 |比率|ppi|
|:--|:-:|:-:|:-:|:-:|:-:|
|iPhone4|3.5インチ|640x960|320x480の2倍解像度|1.5|330|
|iPhone5|4インチ|640x1136|320x568の2倍解像度|1.775|326|
|iPhone6|4.7インチ|750x1334|375x667の2倍解像度|1.778666667|326|
|iPhone6 Plus|5.5インチ|1080x1920|414x736の3倍解像度 (1242x2208を縮小して表示)|1.777777778|400|

## 対応方法

### Launch Screen
Launch Screen FileがあるとiPhone6の解像度に最適化されているとみなされ、アプリが拡大表示されなくなります。

TARGETS > General > App Icons and Launch ImagesのLaunch Screen

![kobito.1413339268.684501.png](https://qiita-image-store.s3.amazonaws.com/0/27793/2ade23b8-5aee-e2f1-ca25-cc4839fb4c62.png "kobito.1413339268.684501.png")

Launch Screen.xibはiOS8以降対応です。スプラッシュ画面にxibが使えて便利です。



### Launch Image Source
Lauch Image SourceにiPhone6、6 Plus用の画像を入れても僕の環境ではiPhone6の解像度に最適化されているとみなされませんでした。
![kobito.1413339500.569946.png](https://qiita-image-store.s3.amazonaws.com/0/27793/dc284d21-6f3b-028a-221a-70696884f1c6.png "kobito.1413339500.569946.png")

画像でスプラッシュ画面を表示する場合、iOS 8.0 and Laterにチェックを入れる必要があります。

![kobito.1413339542.333382.png](https://qiita-image-store.s3.amazonaws.com/0/27793/fbf81f9f-c9d9-2df6-5f83-fc9e34f0ee74.png "kobito.1413339542.333382.png")

## Autosizingによる対応
単純なレイアウトであれば、Auto Layoutを使わずにAutosizingだけでも対応できます。
背景の画像などは横いっぱいに伸びるようにします。

![kobito.1413339800.826847.png](https://qiita-image-store.s3.amazonaws.com/0/27793/0a10ff25-ad0e-a4c9-6c55-8a09b753f251.png "kobito.1413339800.826847.png")

画像に伸ばしたくない場所がある場合、resizableImageWithCapInsetsで対応できます。

```objective-c:
        //iPhone6 対応
        UIImage *bgImage = [UIImage imageNamed:@"Default-568h.png"];
        bgImage = [bgImage resizableImageWithCapInsets:UIEdgeInsetsMake(113.0, 0, 518., 0)
                                          resizingMode:UIImageResizingModeStretch];
        [bgImageView setImage:bgImage];

```

※ resizingModeでUIImageResizingModeStretchを指定しないと画像が繰り返し表示されます。


## Auto Layoutによる対応
Autosizingだけでは対応できない箇所がでてくると思います。そういったxibはAuto Layoutで対応します。
xibの右側の「Use Auto Layout」にチェックを入れます
![kobito.1413340385.995379.png](https://qiita-image-store.s3.amazonaws.com/0/27793/db5f2697-9513-9d29-d449-709d975e3a1a.png "kobito.1413340385.995379.png")

Auto Layoutの使い方は前もって勉強しておくと効率がいいです。

以下のサイトが参考になりました。

[iOSで柔軟に対応可能なレイアウトを作成できるAuto Layout入門 #ios7yahoo](https://codeiq.jp/magazine/2014/02/6035/	)

制約の不足、矛盾は赤矢印で解決できますが、この機能は使わずなるべく自分で制約を付けるのがコツです。

Xcode6でAuto Layout対応をすることになると思いますが、iOS7に対応していない制約をつけるとiOS7で落ちてしまうので注意が必要です。私はiOS7に対応させるのが面倒だったため、iOS8以降対応にしてしまいました。

### iOS7に対応させる場合、以下に注意しましょう。

#### Constrain to marginにチェックを入れない
![スクリーンショット 2014-10-15 11.40.52.png](https://qiita-image-store.s3.amazonaws.com/0/27793/e45b66aa-5251-6beb-9c64-593c783aecff.png "スクリーンショット 2014-10-15 11.40.52.png")

参考
[iPhone6Plus対応で苦労したこと3つ](http://qiita.com/naodroid/items/35ca25c438d27cfcf9cd)

#### First Baselineを使わない
情報が少なく、ちょっと自信がありませんがFirst Baselineを使うと落ちました。
![スクリーンショット 2014-10-15 11.51.15.png](https://qiita-image-store.s3.amazonaws.com/0/27793/20187516-2228-bb41-b138-d83921335e37.png "スクリーンショット 2014-10-15 11.51.15.png")

### Auto Layout対応しているxibのViewの位置をコード上で指定
「translatesAutoresizingMaskIntoConstraints」をYESにする必要があります。

```objective-c:
    // iPhone6対応
    musicVolumeLabel.translatesAutoresizingMaskIntoConstraints = YES;
```

## ソースコードでの対応

ScreenSizeを取得するメソッドを作っておくと便利です。

```objective-c:MyUtils.h
+ (CGSize)getScreenSize;
```


```objective-c:MyUtils.m
+ (CGSize)getScreenSize {
    return [[UIScreen mainScreen] bounds].size;
}
```

ソース上で位置をハードコーディングしている場所はoffset値を加算するようにしました。

```objective-c:
       // iPhone6対応
       offsetYNot3_5inch = [MyUtils getScreenSize].height - 480.0;
       offsetXNot3_5inch = [MyUtils getScreenSize].width - 320.0;


		// こんな感じにoffset値を加算
       frameMusicVolumeLabel.origin.y = POPUP_LABEL1_Y + offsetYNot3_5inch;
```