Objective-C:StoryboardからUnwind Segueを使用して前の画面に戻る

Advertising

Storyboad を使用すればコーディングなしで簡単に画面遷移を行う事が可能です。

Xcode5 になってから Storyboard の利便性も少しづつ良くなっていますが、実用性のあるアプリを作成する場合には、View のレイアウトや画面遷移が Storyboard 上だけで完結するわけではありません。

誰しもサンプルアプリを作るのが最終目標ではないはずですので、実戦向けの内容としてまとめました。

INDEX

Unwind Segueを使用して前の画面に戻る（準備）

「Single View Application」テンプレートを作成し、Xcode の一番左下の「+」から「New File…」で ViewControllerクラスの SecondViewController を追加します。
Main.storyboard を選択し、ViewContoroller を配置します。
storyboard 上の ViewController を選択し、identity inspector タブ > Custom Class から SecondViewController を選択します。これで storyboard で追加した ViewController と SecondViewController が関連付けられました。
storyboard から ViewController と SecondViewController に画面遷移のための UIButton をそれぞれ配置します。
画面遷移を確認しやすくするため、SecondViewController.m の viewDidLoad に以下の１行を追加し、SecondViewController の背景色を赤に変更します。（背景色は Storyboard 上のインスペクタで設定してもかまいません。）
[code]
// SecondViewController.m
– (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor redColor];
}
[/code]
準備完了

ここまでで、プロジェクト内には以下のファイルがある状態となります。(※AppDelegate.h/mを除く)

次に Storyboard の Unwind Segue を使用して画面遷移の設定を行います。

Storyboard の ViewController に配置した UIButton を右ドラッグし、SecondViewController 上で離します。今回は segue を modal としました。これでアプリをビルドして ViewController 内のボタンをクリックすれば　SecondViewController へ遷移します。（この状態では SecondViewController から ViewController へは戻ってこれません。）
続いて、SecondViewController の UIButton をクリックすれば ViewController へ戻るためのメソッドを ViewController.m に記述します。（SecondViewController.m ではないので注意。）メソッド内に NSLog を記述していますが、空でもかまいません。
[code]
// ViewController.m
– (IBAction)firstViewReturnActionForSegue:(UIStoryboardSegue *)segue
{
NSLog(@”Return to ViewController”);
}
[/code]
Storyboard の SecondViewController の緑色アイコンの Exit をクリックし、Connections inspector タブを選択すると、上記 firstViewReturnActionForSegue が表示されるので、右の「◯」から今度は左ドラッグで SecondViewController の UIButton へ接続します。
以上で双方向からの画面遷移の設定が完了しました。

ViewController 間での値の受け渡し等も後日まとめてみたいと思います。お疲れ様でした。

この記事がみなさんのお役に立ちましたら、下記「Share it」よりブックマークやSNSで共有していただければ幸いです。

Please share it!