Help us understand the problem. What is going on with this article?

【Xcode】Storyboardを複数に分割して管理する方法

More than 3 years have passed since last update.

少し複雑なアプリを作ろうとするとビューが増えて一つのStoryboadだと見にくくなります。
そこでStoryboard Referenceを使ってStoryboardを分割して管理する方法を解説していきます。

デモ

story4.gif

手順

  1. Tabbed Applicationで新規プロジェクトを作成し、First ViewとSecond Viewを削除しておきます。
    スクリーンショット 2016-10-23 16.31.32.png

  2. タブ数分のStoryboardファイルを作成します。⌘+Nでファイルの新規作成画面に移動します。
    今回はタブを3つにするので3つのStoryboardファイルを作成しました。(A.storyboard、B.storyboard、C.storyboard)
    a.png

  3. Storyboard Referenceをタブ数分(3つ)設置します。
    b.png

  4. Storyboard ReferenceにStoryboardを設定していきます。3つとも同じように設定します。
    c.png

  5. control+ドラッグでStoryboard ReferenceにSegueを接続。
    d.png
    3つとも同じように設定します。
    スクリーンショット 2016-10-23 17.01.35.png

  6. 分割されたStoryboardの設定
    View Controllerを設置して、「Is Initial View Controller」にチェックを入れます。
    Tab Bar Controllerで接続されるのでTab Bar Itemを設置。
    ついでにLabelでStoryboardのIDも入れて置きました。
    これを3つとも同様に設定し、完了です。
    e.png

起動時に表示されるタブを変更する

デフォルトでは一番左のタブが起動時に表示されるようになっています。
変更するにはAppDelegate.swiftにselectedIndexで指定します。

AppDelegate.swift
import UIKit

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?


    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
        if let initialTab = self.window!.rootViewController as? UITabBarController  {

            // 0が一番左のタブ
            initialTab.selectedIndex = 2 // 左から3つ目のタブを指定
        }
        return true
    }

    func applicationWillResignActive(_ application: UIApplication) {
    }

    func applicationDidEnterBackground(_ application: UIApplication) {
    }

    func applicationWillEnterForeground(_ application: UIApplication) {
    }

    func applicationDidBecomeActive(_ application: UIApplication) {
    }

    func applicationWillTerminate(_ application: UIApplication) {
    }
}

起動時にロードするStoryboardを変更する

Tab Bar Controllerを使わずにStoryboardを分割した場合、起動時にロードするStoryboardを任意のStoryboardに指定したい場合があると思います。
その場合は、プロジェクト→TARGETS→General→Main Interfaceから指定できます。
g.png

関連記事

【Swift3】コードで画面遷移を行う方法

Simmon
とにかく速いWordPressテーマ「Godios.」の作者。 公式サイト→https://godios.simmon.design/ ブログ→https://blog.simmon.design/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした