設定画面生成ライブラリのBohrを試す #iOS

UITableViewで設定画面とかを作るのが面倒なので、githubにていつくかピックアップして試したみた。
まずは　Bohrというのを試してみる。
使用したバージョンは3.0.0。スター数はこれを書いている時点では938。

実現したい事

プロフィールとかアカウントの設定等の画面を、簡単に構築したい。
表示するデータはAPIサーバー等やリモートから取得して表示する

ざっくりとまとめ

セクションを追加して、その中にセルを追加という流れを、ブロックを使用して簡単に記述できる。視覚的にも見やすい。
セル追加時に指定するキー名を使用してNSUserDeaultとセルの表示内容がバインディングされる。
- UIでデータを変更すると、指定したキー名でへ自動的に保存
- 指定したキー名のデータがUIに反映される
各セルはNSUserDefaultにバインドされるので、任意のデータを画面に反映したい場合はNSUserDefaultを介して行う。
NSUserDeaultを介して値を設定する設計のため、使用するキー名を考慮しないとまずい。保存されるデータも考慮する必要あるかも。

基本的な使い方

インストールはcocopodsを使用した。インストール後は、ブリッジヘッダを作成して下記の記述を追加する

#import <Bohr/Bohr.h>

サンプルはgithubからクローンすればデモプロジェクトがあるので、それを見ればすぐ理解できるとおもう。

追加したセルのプロパティを変更したい場合は、ハンドラでセルのオブジェクトを受け取れるのでそこで設定。
幾つかのプロパティはBohrが追加したプロパティで上書きされるので注意。updateAppearanceを検索すると、上書きされているプロパティがわかる

import UIKit

class SettingViewController: BOTableViewController {
    override func viewDidLoad() {
        super.viewDidLoad()

        // 1つめのセクション
        self.addSection(BOTableViewSection(headerTitle: "セクション1", handler: { section in
            section.addCell(BOSwitchTableViewCell(title: "タイトル1", key: "key_1", handler: { (cell:AnyObject!) in
            }))
            section.addCell(BOSwitchTableViewCell(title: "タイトル2", key: "key_2", handler: { (cell:AnyObject!) in
                guard let switchCell = cell as? BOSwitchTableViewCell else {
                    return
                }

                // ここでプロパティ等にアクセスできる
                switchCell.toggleSwitch.tintColor = UIColor.lightGrayColor()

                // スイッチセルの場合はonTintColorはsecondaryColorプロパティで上書きされる
                switchCell.secondaryColor = UIColor.redColor()
            }))
        }))

        // 2つめのセクション
        self.addSection(BOTableViewSection(headerTitle: "セクション2", handler: { section in
            section.addCell(BOTextTableViewCell(title: "テキスト入力", key: "text_1", handler: { (cell:AnyObject!) in
                guard let textFieldCell = cell as? BOTextTableViewCell else {
                    return
                }
                // ここでプロパティ等にアクセスできる
                textFieldCell.textField.backgroundColor = UIColor.darkGrayColor()

                // テキストセルの場合はonTintColorはsecondaryColorとうプロパティで上書きされる
                textFieldCell.mainColor = UIColor.redColor()
                textFieldCell.secondaryColor = UIColor.whiteColor()
            }))
        }))


    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
}

生成結果

上記の例だと以下のような画面ができあがる。プロパティ変更の結果をわかりやすくするため適当な色を設定した。

非同期のデータを画面に反映する

セルの生成時に指定したキー名でNSUserDefaultを監視されていて変更があれば、セルのUIパーツにデータが反映とテーブルのリロードも行われる。(NSUserDefaultの監視はBOSettingクラスで行っている)
例えば上記の例で2つめのセクションのテキストフィールドに、データを設定した場合は以下のようにする
NSUserDefaults.standardUserDefaults().setObject("this is test", forKey: "text_1")