Storyboardとは 
Storyboardは、画面レイアウトと画面間の遷移を管理するためにXcode4.2から導入されたUIビルダーです。
Stroyboardの導入にともない、xlibファイルを利用するかstoryboardファイルを利用するかを選択する必要があります。（両方使わないという選択肢もあり）
iPhone上で、各シーンはコンテンツのフルスクリーンの価値に相当し、iPad上では、複数のシーンとしても表示されることがあります。
Stroyboardの導入にともない、xlibファイルを利用するかstoryboardファイルを利用するかを選択する必要があります。（両方使わないという選択肢もあり）
| 項目名 | 説明 |
| シーン( Scene ) | シーンとは、ViewControllerとDockで構成されています。噛み砕くと、画面レイアウト部分かな？ |
| セグエ( Segue ) | セグエとは、シーンとシーンをくっつけるためのオブジェクト。画面がどういう見栄えで遷移するかの演出を担当してるみたい。 |
iPhone上で、各シーンはコンテンツのフルスクリーンの価値に相当し、iPad上では、複数のシーンとしても表示されることがあります。
SingleViewTemplateにSceneとSegueを追加する
- UIViewContorllerを継承したSecondViewControllerを追加する
- Storyboardファイルを開く
- ViewControllerを左のペインからドラッグ＆ドロップする
- ドックのViewControllerを選択して、InspectorからSecondViewControllerを選択する。これでSceneの追加終わり。
- 遷移元のViewに配置したボタン等の上でCtrlを押しながら、SecondViewControllerのシーンへドラッグ＆ドロップする
- 画面遷移スタイルを選択する（今回はModalを選択）
- InspectorでSegueのIdentifierに任意の識別文字列を入れる。（今回はGotoSecond）
Segueを使ってViewController間でデータの受け渡しをする
- 遷移元のViewControllerに次のメソッドを追記する。
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender{
if ([[segue identifier] isEqualToString:@"GotoSecond"]) {
SecondViewController *viewController = (SecondViewController*)[segue destinationViewController];
viewController.FromMessage = @"受け渡したい文字列";
}
}
StoryBoad確認用プログラム
とりあえずStoryBoard確認用プロジェクトでもつくりましょう。
プロジェクトを用意する
次の条件でプロジェクトを作ります。
| 項目名 | 説明 |
| Product Name | StudyStroyBoard |
| Company Identifier | edu.self |
| ClassPrefix | StudyStoryBoard |
| Device Family | iPhone |
| ChkBox | Use StoryBoard,Use ARC |
起動画面を作成
MainStoryboard.storyboardを開いて、ラベルとボタンを配置しましょう。
一枚目とわかるようにラベルのTextを"View1"としましょう。
ボタンのtitleは"Go to V2"とでもしておきます。
一枚目とわかるようにラベルのTextを"View1"としましょう。
ボタンのtitleは"Go to V2"とでもしておきます。
２枚目のViewを作成
２枚目用ViewControllerの作成
独自のViewControllerでなくてもいいですけど、今回はView１枚につき一つのViewConrollerをつくります。
プロパティとかはまだ無しでいいです。
| 項目名 | 説明 |
| Class Name | SecondViewController |
| Super Class | UIViewController |
２枚目のViewを作成
- MainStoryboard.storyboardを開いて、右のペインからViewControllerの黄色の丸いアイコンをキャンバスにD&Dします。
- ベースのViewControllerを選択し、Identity Inspector を開いて、Classを先ほど作成した"SecondViewController"にします。
- Labelを配置し、LabelのTextをView2とします。
起動画面と２枚目の画面をつなぐセグエを作成
- 一枚目の画面にあるボタンをCtrolを押しながら、２枚目の画面へD&Dします。
- Popupが表示されるので"Modal"を選択します
- segue（セグエ）を選択し、Attribute InspectorのIdentifierに"FirstToSecond"と入力します。
- segueの識別しなのでわかりやすい名前をつけてあげましょう
- Transitionは好きなのを選んでください。画面遷移時のアニメーションがかわります。
２枚目と起動画面の遷移はセグエではなく、dismissで対応します。
Modalで循環遷移していると画面遷移ごとに新たなインスタンスを生成し、メモリをどんどん消費します。
そのため、今まで通りと同様にdismissModalViewControllerAnimatedで閉じます。
- (IBAction)dismiss:(id)sender {
[self dismissModalViewControllerAnimated:YES];
}
3枚目の作成
１枚目から３枚目に遷移させます。また、遷移時に１枚目に追加したTextfeildの情報を３枚目に渡します。
３枚目用のThirdViewControllerを作成
| 項目名 | 説明 |
| Class Name | ThirdViewController |
| Super Class | UIViewController |
| Property | NSString *message |
- ３枚目
| 追加オブジェクト | 項目 | 設定値 |
| ViewController | ClassName | ThirdViewController |
| Label | text | View3 |
| Label | text | message |
| RectButton | title | Go to Top |
- １枚目
| 追加オブジェクト | 項目 | 設定値 |
| TextBox | Placeholder | Plz Input Your Message |
| RectButton | title | Go to V3 |
ThridViewCotrollerにプロパティを追加
#import <UIKit/UIKit.h>
@interface ThirdViewController : UIViewController{
NSString *mymessage;
}
@property (weak, nonatomic) IBOutlet UILabel *myMessagelabel;
@property (strong,nonatomic) NSString *mymessage;
@end
ThridViewControllerでviewWillAppear:を実装
- (void)viewWillAppear:(BOOL)animated{
self.myMessagelabel.text = self.mymessage;
}
1枚目のViewControllerで値を受け渡す記述を書く
StudyStoryBoardViewControllerでprepareForSegue:を実装
- (void) prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender{
if ([[segue identifier]isEqualToString:@"GoToThird"]) {
ThirdViewController *dController;
dController = (ThirdViewController *)[segue destinationViewController];
[dController setMymessage:self.MessageTextField.text];
}
}
※textFielddelgateを忘れずに
タグ
このページへのコメント
StoryBoards - iOS Developer鐃緒申道 - Seesaa Wiki鐃淑ワ申鐃緒申鐃緒申鐃緒申 for 鐃緒申鐃殉￥申鐃夙フワ申鐃緒申 ��≪�潟�������若�� 2014 腱���� ��������ｃ�若�� http://www.pslcbi.com/moncler2014.html
StoryBoards - iOS Developer鐃緒申道 - Seesaa Wiki鐃淑ワ申鐃緒申鐃緒申鐃緒申 for 鐃緒申鐃殉￥申鐃夙フワ申鐃緒申 ��≪�潟�������若�� ��������� 篋堺�� http://www.pslcbi.com/moncler2014.html
StoryBoards - iOS Developer鐃緒申道 - Seesaa Wiki鐃淑ワ申鐃緒申鐃緒申鐃緒申 for 鐃緒申鐃殉￥申鐃夙フワ申鐃緒申 ��≪�潟�������若�� 綺���� http://www.pslcbi.com/moncler2014.html
StoryBoards - iOS Developer鐃緒申道 - Seesaa Wiki鐃淑ワ申鐃緒申鐃緒申鐃緒申 for 鐃緒申鐃殉￥申鐃夙フワ申鐃緒申 ��≪�潟�������若�� 2014 腱���� ��������ｃ�若�� http://www.pslcbi.com/moncler2014.html