iOS アプリ開発に関連するトピックを提供しています。

Xcode Playground / Swift Playgrounds で各種 iPhone の画面サイズを再現する iPhoneSimulator for Playground

Xcode Playgrounds / Swift Playgrounds で手軽に各種 iPhone 端末の画面サイズを再現できる ViewController を作成しました。 この ViewController を使用すると、Storyboard Editor 上で端末サイズを変更するように、Playground の画面サイズを変更することができます。

https://raw.githubusercontent.com/watanabetoshinori/iPhoneSimulator-for-SwiftPlaygrounds/master/Preview/Preview.gif

各種 Size Class や AutoLayout に対応した複雑な View の動作確認を Playground の再実行なしで行えるようになります。 また、Playground だけではなくアプリの ViewController としても使用できますので、iPad 向けアプリに組み込むことで iPhone モード (等倍 / 2倍) の代替表示としても使用できます。

ダウンロード

Xcode Playground 用と iPad アプリの Swift Playgrounds 用をそれぞれ以下からダウンロードすることができます。

github.com

github.com

使用方法

Xcode Playground の場合は cocoapod でインストールし、Swift Playgrounds の場合は git からダウンロードして Airdrop などで iPad へ転送してください。

どちらも Playground で以下のように指定することで使用できます。

PlaygroundPage.current.liveView = iPhoneSimulator.liveView(with: viewController)

画面下部の端末名が表示されている領域をタップすると、端末サイズとオリエンテーションを選択する画面が表示されます。

iPad アプリの ViewController として使用する

iPhone にしか対応していないアプリを iPad 上で起動すると、自動的に以下のような iPhone モードで表示されます。

f:id:watanabetoshinori:20180910234508p:plain:w240

およそ3.5インチディスプレイ相当の画面サイズで表示されるため、アプリが最近の機種の画面サイズのみを想定してデザインされている場合にはデザインが崩れる可能性があります。通常は、iPad 用の画面を用意したり、AutoLayout設定を調整して iPad でもデザインが崩れないように修正を行う必要があります。

iPhone Simulator for Playground を ViewController として組み込むと、以下のように iPhone 8 など高解像度の画面サイズでアプリを表示することができます。

f:id:watanabetoshinori:20180910234601p:plain:w240

デザイン修正の手間も軽減されますし、あえて iPad 対応せずにこの iPhone 表示のままでアプリを使ってもらうという選択肢も現実的になります。

設定方法

iPhone のみ対応したアプリのプロジェクトを開き、設定から Device を Universal に変更します。

f:id:watanabetoshinori:20180910235035p:plain

あとは、AppDelegate に import を追加して、iPhoneSimulator の run メソッドを呼び出せば完了です。

import iPhoneSimulator

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
    
    iPhoneSimulator.shared.run(window: window!)
    
    return true
}

この状態でターゲットに iPad シミュレータを指定してアプリを起動すると、iPhone サイズでアプリが表示されます。