Storyboardについて発表してきました

SWWDC 仙台iOS開発者向け勉強会で Storyboard について発表してきました。
今までInterfaceBuilderすら毛嫌いして使ってこなかったのですが、他の開発者の方から便利になったと聞いて色々と試してみました。現段階ではデメリットはあるものの、メリットの部分が大きいので利用する価値は高いです。まだまだ発展途上のツールに感じますが、今後こうなるだろうなという方向性も見えてくるように思います。

  • Storyboardの特徴 (IBとの違い)
    • トランジションをUIで定義できる
    • UIで設定できるパーツのプロパティが増えた (User Defined Runtime Attributes)
    • TableView Static Cellsの機能が増えた
  • Storyboardを使うメリット
    • コード量が減る
    • 第3者がアプリ全体を把握しやすくなる
    • 画面間の設計が疎結合になる
    • 簡単なTableViewであればUI操作のみで作成可能
    • デザイナとプログラマの作業領域が分離しやすくなる
  • Storyboardの痒いところ
    • モーダルコントローラのdismiss処理はコーディングが必要
    • Static Cellsが利用できるのはUITableViewControllerの継承が必須
    • User Defined Runtime Attributesで設定できる型が少ない

一から作成することを目的としたので、ほとんどライブコーディングで行いました。
EmptyApplicationから作成して、簡単なトランジション、遷移間パラメータの受け渡し、CustomSegue、NavigationController、TabController、User Defined Runtime Attributesなどを使って試しています。

資料と作成したサンプルプロジェクト

サンプルプロジェクト

https://github.com/hmori/StoryboardTest



今回、開場はBeehive+さんのお店だったのですが設備も充実してて勉強会にも十分使えそうな雰囲気で良かったと思います。

UITableViewをStoryboard上でStatic Cellsみたいに使ってみる

Static Cellsはコード量が極端に減り非常に有効ですが、UITableViewController上でしか使えない制限があるためカスタマイズしにくい欠点があります。UIViewControllerにUITableViewを載せてできるだけStoryboard上で定義する方法を紹介しました。


UIViewController継承のControllerにUITableViewのdelagate, dataSourceを定義する


TableViewのContentプロパティは通常通りDynamic Propertiesにする
Prototype cellsはStoryboard上で扱うCell数


TableViewCellのidentifierを"cell_0_0", "cell_0_1"のように"cell_{sectionNo}_{rowNo}"にする


UITableViewを載せたControllerのUITableViewDataSourceをオーバーライドする

#pragma mark UITableViewDataSource

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section {
    //prototype cellsで設定した数
    return 4;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
    return [tableView dequeueReusableCellWithIdentifier:
            [NSString stringWithFormat:@"cell_%d_%d", indexPath.section, indexPath.row]
            ];
}


あくまで通常のUITableViewの機構に頼っただけのものなので、高さの変更など必要があればそれぞれのDelegateメソッドをオーバーライドする必要があります。

#pragma mark UITableViewDelegate

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath {
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:
     [NSString stringWithFormat:@"cell_%d_%d", indexPath.section, indexPath.row]
     ];
    return cell.frame.size.height;
}

Dynamic propertiesは通常のUITableView通りに、Section, Rowをコードで制御する仕組みであるため、Storyboardのパレット上にTableSectionを扱うパーツが存在しません。残念ながらヘッダー、フッターの制御はコードで定義するか、Cellのパーツを拡張してUser Defined Runtime Attributesを利用するなどの工夫が必要になります。そこまでStoryboard上の編集にこだわるメリットは薄いとは思いますが。今後、Static Cellsが進化して使いやすくなることを願います。

サンプルプロジェクト

https://github.com/hmori/StoryboardTest


参考サイト

UITableViewのStatic Cellsが使えなかったけどstoryboardでできる限りそれっぽくやってみた



Storyboardは個人的に今後の進化に非常に期待がもてる内容だと思います。iOS開発はデザイナ・プログラマなどと複数人での分業が難しいと感じていましたが可能性があるように見えますね。色々と工夫すればデータ部、コントロール部、デザイン部が効果的に分離できるか、これからも調べていきたいと思います。