【Swift5/Xcode】複数のstoryboardを分割してスマートに管理する方法

この記事では、storyboardのスマートな管理方法をご紹介します。

ある程度複雑なアプリを作るとなると、どうしても画面が多くなってしまいますよね。画面が多いのに、全ての画面をMain.storyboardでやりくりしていると結構大変です。

というわけで、storyboardも機能ごとに分割しましょう。

実行環境

【Xcode】Version 11.3

【Swift】Version 5.1.3

超簡単に説明

1. 分け方を考え、決める
2. フォルダとファイルを作成する
3. ViewContorollerの引っ越しする
4. MainのViewControllerからStoryboard Referenceでファイルと接続する
5. 引っ越し先のViewControllerのattributer inspectorのIs Initial ViewControllerにチェックを入れる

storyboardがごちゃごちゃの状態

スパゲッティ状態です。どこのSegueがどこに繋がってるか一瞬ではとてもわかりづらいです。

このような時に、新たにstoryboardファイルを作成して、綺麗に分けたらわかりやすいですよね。

storyboardの分類の仕方

今回、仮で少し散らかってるstoryboardを用意しました。

このMain.storyboardは、いたってシンプルで、青い画面から、A画面とB画面に別れています。A画面には、AViewControllerが紐づいています。

手順1：storyboardの分類の仕方を考える

まずは、どう分けるのがスマートなのか、よく考えてからstoryboardの分割をしましょう。

今回の例の場合では、簡単です。

storyboardファイルを2つ作成し、以下の３つのファイルでstoryboardを管理します。

• Main.storyboard
• A.storyboard
• B.storyboard

図で表すとこんな感じです。

手順2：ファイルとフォルダを作成する

次に、ファイルとフォルダを作成しましょう。

storyboardファイルをまとめるフォルダを作成しましょう。

名前はstoryboardなど、わかりやすい名前にしましょう。

次に、A.Storyboardと、B.Storyboardを作成します。

作成方法は、command + nでテンプレート選択でStoryboardを選ぶだけです。

フォルダ構成がこんな感じにします。

手順3：引っ越し

次は、storyboardのViewControllerの移動をしていきます。

ミスってしまうと、データがなくなってしまう可能性があるので、以下の作業をする前にバックアップを取っておきましょう。

まずは、A側のViewControllerを移動していきます。

A.storyboardに移動させたいViewControllerをcommandを押しながら複数選択します。

選択したら、command + xで切り取りましょう。（怖い人は、コピペして消すでもよし）

そして、A.storyboardの右側の一番広いエリアにcommand + vで、ペーストするだけです。

BもAと同じように、行います。

そうすると、Main.storyboardは何もない状態になります。

この段階では、切り取ったことにより、Segueも切り離されている状態なので、画面遷移できません。

手順4：Segueを繋げる

次に、Segueをつなげていきます。

引っ越し元のSegue

まずは、Main.storyboardをつなげましょう。

command + shift + Lを押して、Objects Libraryを開きます。開いたら、Storyboard Referenceをドラッグ&ドロップしてください。

次に、各Storyboard Referenceをstoryboardファイルと紐付けをしていきます。

Bも同じように、紐付けします。

紐付けが終わったら、Segueで繋いでください。

引っ越し先のSegue

次に、作成したstoryboardのA、BのSegueの設定をします。

各Storyboardの最初の画面に、attributer inspectorのIs Initial ViewControllerにチェックを入れてください。

Bもこれと同じ手順を行います。

まとめ

現在Swift勉強中なので、このような簡単なことを備忘録として記事に残しています。

こうした方がもっといいよとかあったら教えてください。

あなたにオススメの記事

【Swift5/Xcode】プログラミングできない俺が、iOSアプリ開発してみた。 【Swift5/Xcode】TextFieldに値が入っていないときにボタンを非活性（無効）にする方法

iOSエンジニア必見

【17選】MacBook Pro/Air周辺機器のオススメのまとめ。〜作業を効率的かつおしゃれに〜