2012年3月28日水曜日

Storyboardを使った画面遷移と値の受け渡し 其の二

其の一では単純に画面遷移するアプリを作成しました。
このアプリを使って値を受け渡すように機能を追加していきます。

(1)カスタム・ビューコントローラの作成
メイン画面からサブ画面へ値を受け渡す場合はViewControllerクラスの「prepareForSegue:sender:メソッド」を使用します。
そのためにサブ画面用のビューコントローラクラスを作成しておきます。

Xcodeのメニューから「File」→「New」→「File...」を選択してカスタム・ビューコントローラクラスを作成します。
Templates
Objective-C Class
Class
SubViewController
Subclass of
UIViewController

(2)カスタム・ビューコントローラの設定
サブ画面の「ViewController」を選択して画面右のIdentity inspectorから先ほど追加した「SubViewController」を選択します。


今回のアプリではメイン画面で入力した文字をサブ画面で表示するアプリにしたいのでメイン画面とサブ画面に部品を貼付けていきます。

(3)メイン画面の修正
メイン画面に入力ボックス(TextField)を配置します。
配置したAssistant editorを使用して関連付けを行います。
Connection
Outlet
Name
aTextField
Type
UITextField
関連付けはこれで完了ですがそのままではキーボードが閉じません。
以前作ったページがあるのでこちらを参照にキーボードを閉じる処理を追加します。
iOSのソフトウェアキーボードを閉じる

(4)サブ画面の修正
メイン画面で入力した内容を表示するためにラベル(Label)を配置します。
同様にAssistant editorを使用して関連付けを行います。
Connection
Outlet
Name
aMessage
Type
UILabel
(5)サブ画面のプロパティを設定
メイン画面からサブ画面へ値を受け渡すためにSubViewControllerクラスにNSString型のプロパティ「msgValue」を設定します。

SubViewController.h
@interface SubViewController : UIViewController

@property (copy, nonatomic) NSString *msgValue;  // ← 追加
@property (strong, nonatomic) IBOutlet UILabel *aMessage;

@end

SubViewController.m
@implementation SubViewController
@synthesize msgValue;  // ← 追加
@synthesize aMessage;

// 途中省略

- (void)viewDidLoad
{
    [super viewDidLoad];
    // msgValueの内容をラベルに表示
    aMessage.text = msgValue;
}

(6)メイン画面から値を渡す
テキストエリアから入力した内容をサブ画面に渡します。

MainViewController.m
#import "SubViewController.h"

// 途中省略

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender
{
    // サブ画面のビューコントローラを取得
    SubViewController *aSubViewController = (SubViewController *)[segue destinationViewController];
    // サブ画面のmsgValueプロパティに文字列を代入
    aSubViewController.msgValue = aTextField.text;
}

まず、MainViewControllerクラスでSubViewController.hをインポートします。
次に「prepareForSegue:sender:メソッド」をオーバーライドして処理を行います。

(7)実行
メイン画面の入力エリアに文字を入力して「Next」ボタンを押す

サブ画面のラベル部分に入力した文字が表示される

簡単にですがStoryboardでの画面遷移と値の受け渡しのサンプルアプリ完成です。


※Scene(シーン)とSegue(セグエ?)
Storyboardで画面レイアウト(ViewController)部分をScene、画面遷移の部分をSegue


0 件のコメント:

コメントを投稿