iPhone6 4.7、5.5inch対応 メモ

More than 3 years have passed since last update.

既存アプリを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

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


Launch Image Source

Lauch Image SourceにiPhone6、6 Plus用の画像を入れても僕の環境ではiPhone6の解像度に最適化されているとみなされませんでした。

kobito.1413339500.569946.png

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

kobito.1413339542.333382.png


Autosizingによる対応

単純なレイアウトであれば、Auto Layoutを使わずにAutosizingだけでも対応できます。

背景の画像などは横いっぱいに伸びるようにします。

kobito.1413339800.826847.png

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

        //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

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

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

iOSで柔軟に対応可能なレイアウトを作成できるAuto Layout入門 #ios7yahoo

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

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


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


Constrain to marginにチェックを入れない

スクリーンショット 2014-10-15 11.40.52.png

参考

iPhone6Plus対応で苦労したこと3つ


First Baselineを使わない

情報が少なく、ちょっと自信がありませんがFirst Baselineを使うと落ちました。

スクリーンショット 2014-10-15 11.51.15.png


Auto Layout対応しているxibのViewの位置をコード上で指定

「translatesAutoresizingMaskIntoConstraints」をYESにする必要があります。

    // iPhone6対応

musicVolumeLabel.translatesAutoresizingMaskIntoConstraints = YES;


ソースコードでの対応

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


MyUtils.h

+ (CGSize)getScreenSize;



MyUtils.m

+ (CGSize)getScreenSize {

return [[UIScreen mainScreen] bounds].size;
}

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

       // iPhone6対応

offsetYNot3_5inch = [MyUtils getScreenSize].height - 480.0;
offsetXNot3_5inch = [MyUtils getScreenSize].width - 320.0;

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